我目前工作的一个新项目中,整个页面应该在HTML5 / JS针对API / JSON的工作来实现。 由于整个应用程序应该只包含一个HTML文件(index.html的)和JS MVC应用程序(也许backboneJs)我在想SEO和用户友好的URL。
在那里,我碰到
window.document.pushstate('','title','/url');
与HTML5功能的帮助下,我可以定义网址,并没有真正离开或重新加载页面。 但是......我想将应用程序部署到一个CDN像亚马逊CloudFount性能原因,低费用。 我不需要任何服务器基础设施(除了一个我需要的当然API)
所以,我可以配置一个CDN(实际上任何CDN像AWS,天青,Akamai的),以提供相同的HTML文件,不管叫什么网址
http://www.example.com =>提供的index.html
http://www.example.com/any_subpage =>提供的index.html
等等 ...
一个工作例如,你可以在这里找到http://html5.gingerhost.com 。 但是,页面的创建者可以使用.htaccess文件或者熟悉的东西映射一切相同的文件。 我想提供一个CDN相同的功能。
Answer 1:
任何CDN应该有定义源服务器的能力。 此服务器获取由CDN接触到提供服务的文件,如果边缘位置没有它。
好消息是,原始服务器可以是任何提供网页,如Apache,Nginx的,等等。这意味着你可以将任何类型的重写你希望的规则。
如果你不希望设置原始服务器自己,你可以看看主机上S3的(静态)网站 。 最近他们推出的网络重定向它可以帮助你来服务下一个不同的“别名”相同的文件。 如果做不到这一点,你可以看看重新定义标准错误文件 ,但我不知道是否错误状态码仍然会被发送。
Answer 2:
CDN的旨在通过从服务到客户端的最近地理位置来看可能的静态资源,提供静态内容。 CDN技术并不旨在做所述请求的重定向或服务器侧处理。 你需要别的东西这里涉及到这样做的部分。 现在的问题是仅仅这是否是一个服务器端技术或某种负载平衡器/防火墙请求重写(以避免具有服务器侧技术)。
我不认为有这样做的真正的平台无关的方式。 你总是被捆绑到任何一个服务器端技术或负载平衡器/防火墙平台。 但它也听起来像你需要的地方承载您的JSON API,你可能已经有了这样的约束? 即使你没有在平台上决定,几乎任何平台应该让你做一些基本的路由。 如果您可以提供JSON Http请求,你应该能够做一些页面路由了。
作为一个方面说明,我不相信你想在你的域名从绝对的所有可能的网址传回的你“的index.html”。 你会想有效的URL和无效网址的一些列表。 在这种情况下,你需要任何方式进行ping你的后端验证请求的URL。 这进一步表明,我认为一个服务器端的技术将更好地适合这个任务,然后盲“包罗万象”重定向在一个较低的水平。
我个人的偏好是使用自己喜欢的MVC框架服务索引的内容与你所需的URL结构(几乎所有的页面加载),然后用你的JSON API和页面加载后的内容合作(你希望能够任何动态的东西去做)。 整个事情,无论是页面加载和API,从同一个服务器平台/环境中投放。
Answer 3:
符号链接你的404页面的索引页。 这样,当你的网页内容中没有发现请求的URL(约任何一个环节,因为它出现在你的情况下),404页供应,而这又索引页面本身。
# ln -s index.html 404.html
Answer 4:
Nginx的http服务器可以做到这一点,如:
location /{
# serve a file
}
或者你可以定制你喜欢的链接
location /my_html{
# serve html file
}
location /cdn/{
# serve rest files
}
你甚至可以检查正则表达式的网址
location ~ /cdn/.*\.js${
# serve cdn
}
Answer 5:
如果你有自己的域名指向的CDN(我知道CloudFront的让你这样做),你可以使用CloudFlare的( https://www.cloudflare.com/ )为您的用户和CDN之间的反向代理。
由于他们的免费计划,您可以创建一个重定向一切的index.html的规则。 我想,这是实现你想要什么,因为CDN的配置,您知道,只服务静态现有文件的唯一途径。
Answer 6:
如果你正在考虑SEO和友好的URL,可以完成一些使用pushState
,肯定的。 请记住:
当重定向所有路由的index.html,你也将成为完全一样的HTML内容的搜索引擎,无论他们在三月在什么URL。 然后它不会不管如何“搜索引擎友好”您的网址是。
如果你想支持IE,它不支持历史API,所以你需要一个更高层次的历史框架或其他一些解决方法IE。 而这很可能将包括#
为基础的URL。 所以,你基本上会为每个视图两种不同的URL,这是要考虑的事情,当人们分享网址或搞清楚搜索机器人如何捕获链接到你的网站。
我会建议考虑以下两个选项,你走得太远在寻找一个合适的云主机之前:
一些数据逻辑的卸载到后端和至少服务于每个视图一些可消化的内容。 您还可以删除或也许解析您的应用程序,内容,并尽pushState的/ jsonAPI事情更好的UX,但你将有“真”,对于搜索引擎,Opera Mini用户和其他一些不幸的浏览器可扫描的URL。 这些静态页面不需要服务于相同的功能,甚至风格,只是把它作为最后的回退。
忘了CDN的应用程序,只需使用CDN静态文件,图片,脚本等,你可以有一对夫妇为回退的应用程序本身的,但它的真正拉动服务器的介质。 这样做将会把你在应用程序和它背后的服务器控件,但是你仍然可以使用CDN什么,它的意思了 - 提供静态内容。
Answer 7:
我们最近edgecast.com (这就像一个CloudFront的CDN),并通过他们的支持,他们告诉我,这确实是东西,他们可以做,但不是通过他们的标准接口。 有人告诉我,当我们需要一个通配符的路由到单个文件简单地与他们联系。
至于你的你的问题: 是的 ,这是可能的。 只是通过他们的在线聊天与他们联系,他们会帮助你,祝你好运!
一些更多的(负面)信息:像这样的包罗万象的规则意味着愚蠢的favicon.ico,强制要求某些浏览器(IE阅读)也将被捕获,并且常规的HTML页面将重新下载。 事实上,所有的自动请求(I帧还要求一个图标,例如)对根域名将被捕获,并且常规的HTML文件就会被下载。 这可能是也可能不是你的问题,但对我来说所有这些隐藏的请求是让我重新思考解决方案,并使用一个网络服务器后面做实际的包罗万象的。 真够受的。
Answer 8:
我在同一条船上,你和它似乎是CDN的不支持URL重写。 下面的解决方案并没有解决我们的“问题”究竟但非常接近节省$因为如果您使用的是“拉” CDN提供商托管。
默认页面(的index.html)的初始负荷将只提供一小片的HTML,基本上裸机HTML结构,就像这样:
<!doctype html>
<html lang="en">
<head>
<title>something</title>
<!-- Load the script "js/main.js" as our entry point -->
<script data-main="js/main" src="http://mycdn.com/js/libs/require/require.js"></script>
</head>
<body>
</body>
</html>
代码的其余部分将通过一些(异步)模块加载器加载像require.js - 而所有这些代码会来自你的CDN,包括require.js。
但是,如果你使用拉CDN在任何时候HTML甚至这么一点点也将来自CDN。 该CDN的“拉”提供者将打这个页面时,它没有找到在其缓存的HTML5 pushState的URL的文件。
在你的服务器,你必须有某种路由路由每个匹配在未从CDN提供的这一个文件的文件扩展名的方式请求。
是的,CDN将达到站点的每遇到一个新的URL时(如果你使用拉CDN),但它得到它后,它会分发到所有从它的高速缓存中的用户并不会打你的网站一样再次网址。 此外,由于你提供静态HTML的一点点在你的网站从CDN提供商命中将是微不足道的。 而且,如果你设置你的文件头,不要在这个HTML文件到期(该文件确实应该永远不会改变),该文件可以通过CDN提供商保持了很长一段时间(取决于供应商),让你的服务器上的点击率将几乎回落到每一个唯一的URL一次性事件。
Answer 9:
这家伙也有类似的问题,并且使用S3 / CloudFront的。 他的所有URL重定向到index.html的用的StatusCode 200。
这是一种解决方法,因为它涉及到设置index.html作为一个错误页面。
查看详情: https://kkob.us/2015/11/24/hosting-a-single-page-app-on-s3-with-proper-urls/
文章来源: Configuring any CDN to deliver only one file no matter what url has been requested