包括交叉起源HTML模板

我想包括与角像这样包括交叉起源HTML模板

<div ng-include="http://SOME_OTHER_DOMAIN/template.html"></div>

HTML模板如图所示，该模板是在另一个领域，是在S3存储桶更具体。我完全控制这个桶，我已经应用了这样的Cors配置。

<?xml version="1.0" encoding="UTF-8"?> 
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> 
<CORSRule> 
    <AllowedOrigin>*</AllowedOrigin> 
    <AllowedMethod>GET</AllowedMethod> 
    <MaxAgeSeconds>3000</MaxAgeSeconds> 
    <AllowedHeader>*</AllowedHeader> 
</CORSRule> 
</CORSConfiguration>

由于正确通过检查网络流量的预期模板负荷镀铬显示此响应头：

access-control-allow-methods:GET 
access-control-allow-origin:* 
access-control-max-age:3000 
content-encoding:gzip 
content-type:text/html 
........

现在奇怪的是，没有任何修改或变更，模板停止加载和浏览器抱怨有没有访问控制允许请求上的策略。事实上，当我再次检查网络时，CORS头部缺失。这种情况是随机发生的，甚至同时从chrome和firefox检查网站，一个浏览器会发现预期的CORS，另一个则不会。

我已阅读关于浏览器的同源策略和跨源资源共享（CORS）策略，但我发现这种行为真的很奇怪。

我想要你的建议，这是甚至浏览器问题，缓存相关，S3错误或其他？

我发现了一些涉及代理服务器的解决方案，只是给CORS提供没有的请求，但为此保留一台服务器有点难度，更不用说s3默认已经实现了CORS。

来源

2017-05-09 alex-rokabilis

鉴于此失败的间歇性，我猜测浏览器已经缓存了您要加载的html文件，并且此缓存版本未加载CORS。

所以基本上 - 你是否加载文件，而不通过CORS？然后，跨域的第二个请求将需要它，但从未离开浏览器，因为资源已被缓存。

你是否直接在浏览器中输入模板文件来输入网址（不是跨域请求，因为你直接从它的存储区访问它）？

对此的一个可能的解决方法是将URL缓存清除模式添加到模板，这意味着浏览器无法缓存它，例如，将?nocache附加到模板url的末尾。

看到这个答案：https://stackoverflow.com/a/14238351/808532

编辑：也是，也许现在的角度作品没有这一点，但不应该URL字符串用单引号里面的NG-包括属性？

例如ng-include="'http://SOME_OTHER_DOMAIN/template.html'"

来源

2017-05-09 15:40:56

感谢您的回答，ng-include仅仅是一个例子，实际上它是一个变量，所以没有错误。至于缓存，我不知道这是一件事情，因为我尝试过使用匿名方法，也使用了开发人员工具上禁用的缓存。我现在的猜测是，云端分布造成麻烦，这就是为什么一些请求是好的，有些则没有。无论如何，我会尝试添加缓存破坏，然后检查错误是否仍然发生！ –

包括交叉起源HTML模板

回答

相关问题