骨干路由/历史问题杰基尔静态网页基尔、路由、静态、骨干

2023-09-02 20:32:19 作者:有趣又阳光.

我要建一个简单的营销网站,杰基尔,并用骨干路由和历史在幕后处理导航。我的网站的每个页面是它自己的HTML文件,我的策略是 preventDefault()在页面之间的链接,把火关的jQuery获得()抓住新的HTML,并与来自新页面的信息取代我的 div.content

I'm building a simple marketing website with Jekyll, and using Backbone's routing and history behind the scenes to handle navigation. Each page of my site is its own HTML file, and my strategy is to preventDefault() on links between pages, fire off a jQuery.get() to grab the new HTML, and replace my div.content with the information from the new page.

我知道这种设置有点与众不同,但我有我的理由:一个单页的结构是preferable,因为我想在页面过渡precise控制,我想避免要求我webfonts每个用户导航到一个新的页面的时间。保持HTML文件的静态和分离也是一个双赢的搜索引擎。

I know this setup is a little out of the ordinary, but I have my reasons: a single-page structure is preferable because I want precise control over page transitions, and I want to avoid requesting my webfonts each time the user navigates to a new page. Keeping the HTML files static and separate is also a win for search engines.

下面的问题:一切工作正常,当我从我的根URL开始,但是当我开始在不同的页面,如 mydomain.com/page1 ,历史上休息。在初始化过程中,我的路由器试图路线我,我已经在页面上,产生了404:无法得到mydomain.com/page1/page1 。我可以prevent这一点的,哈克 isFirstLoad 布尔,但很明显很烂,它不休息的时候,我开始到处点击,并使用后退按钮返回到 /第1页

Here's the issue: everything works fine when I start from my root URL, but when I begin at a different page, e.g. mydomain.com/page1, the history breaks. During initialization, my Router attempts to route me to the page I'm already on, resulting in a 404: Could not GET mydomain.com/page1/page1. I can prevent this with a hacky isFirstLoad boolean, but that obviously sucks, and it doesn't breaks when I start clicking around and use the back button to return to /page1.

我认识到一个解决方案就是写一些提供服务器端逻辑我的 index.html的无论哪个网址被击中的。我不知道怎么然而做到这一点,特别是对当地的环境。它是关于PHP或htaccess的?这是即使我有什么做的?我要对这个完全错误的方式?

I recognize that one solution is to write some server-side logic that serves my index.html regardless of what URL is hit. I'm not sure how to do this, however, particularly for a local environment. Is it about PHP or .htaccess? Is this even what I have to do? Am I going about this totally the wrong way?

谢谢!

推荐答案

是的,一个解决方案将服务与 index.html的的每个请求。但是,这有一个很大的弊端:你的网站不再被搜索引擎访问。为了保持其静态网站的搜索引擎优化的好处,我建议你回避的选择。

Yes, one solution would be to serve every request with index.html. But that has a big downside: your site is no longer accessible by search engines. To keep the SEO benefit of having a static site, I'd suggest you shy away from that option.

我认为最佳的解决方案已经提供的骨干。从他们的文档:

I think the optimal solution is already provided by Backbone. From their documentation:

如果服务器已经渲染了整个页面,并启动历史,传递,当你不希望初始路径触发沉默:真正的

If the server has already rendered the entire page, and you don't want the initial route to trigger when starting History, pass silent: true.

所以,首先要确保您的路由器配置正确,所有的线路匹配您的静态页面,并实例化的路由器。

So, first make sure that your Router is configured properly and all the routes match up with your static pages, and instantiate the router.

然后,启动历史是这样的:

Then, start the History like this:

Backbone.history.start({pushState:真正的,无声的:真正的,根:'/'});

按国家,将有助于保持该网址友好。沉默的标志告诉骨干,你的静态服务器提供服务的页面已经和事实(你想要的)后,它只是加载研究。和根配置保证了骨干知道你的网站的真正根源是(这样你就不会得到第1页/第1页废话。

Push State will help keep the URLs friendly. The Silent flag tells Backbone that your static server served the page already, and it's just loading in after the fact (what you want). And the Root configuration ensures that Backbone knows what the true root of your site is (so you don't get the page1/page1 nonsense.

在我的经验中,得到的路由设置不当可有点善变...所以好运!

In my experience, getting routing set up properly can be a little fickle...so best of luck!