在不破坏URL的情况下将ember-cli应用程序部署到S3

Question

我正在研究一个我在S3中部署的ember-cli应用程序.我真的希望能够使用这种"无服务器"方法,因为它配置非常简单,而且非常实惠.

我的网址有问题.如果我点击http://my-bucket.s3-website-us-east-1.amazonaws.com/就可以了.但是如果我尝试直接加载除应用程序根目录之外的页面,例如http://my-bucket.s3-website-us-east-1.amazonaws.com/elephants/5,那么它会给出403 ,因为S3中没有这样的资源.(我可以通过应用程序很好地导航到这些页面,我可以在我的机器上以开发模式直接命中它们,因此ember应用程序工作正常.)

寻找解决方案,我找到了添加到我的路径的建议#!.这似乎更好,因为它没有返回403,但当我点击http://my-bucket.s3-website-us-east-1.amazonaws.com/#!/elephants/5时,它只是重定向到http://my-bucket.s3-website-us-east-1.amazonaws.com,丢失路径中包含的任何特定信息.

我有什么选择？有没有办法使用S3并有工作的URL？我需要服务器吗？还是有另一种方法让我望而却步？

Answer 1

仅具有基于#的重定向的方法几乎没有问题.我在下面列出了它们:

1. 当应用程序的路径得到解决时,会发生多重重定向.例如:www.myapp.com/path/for/test被重定向为www.myapp.com/#/path/for/test
2. 网址栏中有一个闪烁,因为"#"来自SPA框架的操作.
3. seo受到影响因为 - '嘿!它谷歌强迫他的手重定向'
4. Safari支持您的应用程序.

Ember-CLI-Deploy倡导的Lightening部署方法的变化方法如下:

1. 确保为您的网站配置了索引路由.主要是index.html
2. 从S3配置中删除路由规则
3. 将Cloudfront放在S3存储桶前面.
4. 配置Cloudfront实例的错误页面规则.在错误规则中指定:
   • Http错误代码:404(和403或其他错误根据需要)
   • 错误缓存最小TTL(秒):0
   • 自定义响应:是的
   • 响应页面路径:/index.html
   • HTTP响应代码:200

5.对于SEO需求+确保您的index.html不缓存,请执行以下操作:

• 配置EC2实例并设置nginx服务器.
• 将公共IP分配给您的EC2实例.
• 创建一个ELB,其中包含您作为实例创建的EC2实例
• 您应该能够将ELB分配给您的DNS.
• 现在,配置您的nginx服务器以执行以下操作:Proxy_pass对您的CDN的所有请求(仅针对index.html,直接从您的云端服务其他资产)和搜索机器人,按照Prerender.io等服务的规定重定向流量

关于nginx设置,我可以提供更多详细信息,只需留言即可.已经很难学会了.

一旦云前端分发更新.使您的云端缓存无效一次,使其处于原始模式.点击浏览器中的网址,一切都应该是好的.

Answer 2

好吧，我很接近。事实证明，正确的方法是：

http://my-bucket.s3-website-us-east-1.amazonaws.com/#/elephants/5

我尝试过各种方法，但没有一个是精确的 a #with no !，并且被 包围/。相关阅读是现场文档

值得注意的是，我正在使用：

App.Router.reopen({
  location: 'auto'
});

另外，我在静态网站托管RoutingRules下使用以下内容

<RoutingRules>
    <RoutingRule>
        <Condition>
            <HttpErrorCodeReturnedEquals>403</HttpErrorCodeReturnedEquals>
        </Condition>
        <Redirect>
            <HostName>my-bucket.s3-website-us-east-1.amazonaws.com</HostName>
            <ReplaceKeyPrefixWith>#/</ReplaceKeyPrefixWith>
        </Redirect>
    </RoutingRule>
</RoutingRules>