包括交叉起源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模板

回答

相關問題