CSS不是'；有些用户有时无法加载，可能是由于跨来源资源共享_Css_Angularjs_Google Chrome_Cross Domain

CSS不是'；有些用户有时无法加载，可能是由于跨来源资源共享

css angularjs google-chrome

CSS不是'；有些用户有时无法加载，可能是由于跨来源资源共享,css,angularjs,google-chrome,cross-domain,Css,Angularjs,Google Chrome,Cross Domain,我们正在使用Angular JS 1.5和Django 1.7开发一个单页Web应用程序，该应用程序托管在Heroku上，资源托管在Cloudfront上有时一些用户体验表明我们的css没有被加载。硬刷新可以解决这个问题。我们每周都会部署一个新版本的应用程序，但这并不总是问题再次出现的时候。属性crossorigin=“use credentials”添加到base.html中css的链接标记中我们的用户主要使用Chrome（Windows和Linux），所以我不能说这个问题是否也存在于其

我们正在使用Angular JS 1.5和Django 1.7开发一个单页Web应用程序，该应用程序托管在Heroku上，资源托管在Cloudfront上

有时一些用户体验表明我们的css没有被加载。硬刷新可以解决这个问题。我们每周都会部署一个新版本的应用程序，但这并不总是问题再次出现的时候。属性

crossorigin=“use credentials”

添加到base.html中css的链接标记中

我们的用户主要使用Chrome（Windows和Linux），所以我不能说这个问题是否也存在于其他浏览器中

控制台中的错误

CSS stylesheet from origin 'https://xxx.cloudfront.net' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://app.foobar.com' is therefore not allowed access.
XMLHttpRequest cannot load https://xxx.cloudfront.net/vendor/vendor.f2b1f43b27a2.css. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://app.foobar.com' is therefore not allowed access.

但带有请求的网络选项卡显示存在原始标头，但带有警告：

“显示临时标头”

可能是浏览器插件阻止了请求，所以我查看了

chrome://net-internals

在事件选项卡上。起初，我禁用了一些（可能的）阻塞插件

请求

Request URL:https://xxx.cloudfront.net/vendor/vendor.f2b1f43b27a2.css
Request Method:GET
Status Code:200 OK (from cache)
Remote Address:54.230.15.113:443
Response Headers
Age:16460
Cache-Control:max-age=1314000
Content-Encoding:gzip
Content-Type:text/css
Date:Tue, 04 Oct 2016 07:03:31 GMT
Expires:Fri, 27 Sep 2041 16:39:47 GMT
Last-Modified:Mon, 03 Oct 2016 16:41:26 GMT
Server:AmazonS3
Vary:Accept-Encoding
Via:1.1xyz.cloudfront.net (CloudFront)
X-Amz-Cf-Id:YQwFzOSQ2Be1khH0eHi4wwYpgtj8Q3Y7C_ylqwDfULjEMG9tSuFVmw==
X-Cache:Hit from cloudfront
Request Headers
Provisional headers are shown
Origin:https://app.foobar.com
Referer:https://app.foobar.com/
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/52.0.2743.116 Chrome/52.0.2743.116 Safari/537.36

事件

347949: URL_REQUEST
https://xxx.cloudfront.net/vendor/vendor.f2b1f43b27a2.css
Start Time: 2016-10-04 14:17:03.743

t=4656 [st= 0] +REQUEST_ALIVE  [dt=51]
t=4658 [st= 2]    URL_REQUEST_DELEGATE  [dt=0]
t=4658 [st= 2]   +URL_REQUEST_START_JOB  [dt=14]
                  --> load_flags = 33024 (MAYBE_USER_GESTURE | VERIFY_EV_CERT)
                  --> method = "GET"
                  --> priority = "HIGHEST"
                  --> url = "https://xxx.cloudfront.net/vendor/vendor.f2b1f43b27a2.css"
t=4659 [st= 3]      URL_REQUEST_DELEGATE  [dt=0]
t=4659 [st= 3]      HTTP_CACHE_GET_BACKEND  [dt=0]
t=4659 [st= 3]      HTTP_CACHE_OPEN_ENTRY  [dt=13]
t=4672 [st=16]      HTTP_CACHE_ADD_TO_ENTRY  [dt=0]
t=4672 [st=16]      HTTP_CACHE_READ_INFO  [dt=0]
t=4672 [st=16]      URL_REQUEST_DELEGATE  [dt=0]
t=4672 [st=16]      URL_REQUEST_FILTERS_SET
                    --> filters = "FILTER_TYPE_GZIP"
t=4672 [st=16]   -URL_REQUEST_START_JOB
t=4672 [st=16]    URL_REQUEST_DELEGATE  [dt=2]
t=4674 [st=18]    HTTP_CACHE_READ_DATA  [dt=8]
t=4685 [st=29]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 32768
t=4686 [st=30]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 32768
t=4690 [st=34]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 32768
t=4694 [st=38]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 32768
t=4696 [st=40]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 32768
t=4698 [st=42]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 32768
t=4699 [st=43]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 6170
t=4700 [st=44]    HTTP_CACHE_READ_DATA  [dt=1]
t=4701 [st=45]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 32768
t=4701 [st=45]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 32768
t=4703 [st=47]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                  --> byte_count = 32768
t=4706 [st=50]    CANCELLED
t=4707 [st=51] -REQUEST_ALIVE

但是css没有被加载（取消）

硬刷新后，事件如下所示：

349289: URL_REQUEST
https://xxx.cloudfront.net/vendor/vendor.f2b1f43b27a2.css
Start Time: 2016-10-04 14:23:14.081

t=205845 [st=  0] +REQUEST_ALIVE  [dt=132]
t=205845 [st=  0]    URL_REQUEST_DELEGATE  [dt=0]
t=205845 [st=  0]   +URL_REQUEST_START_JOB  [dt=43]
                     --> load_flags = 33025 (MAYBE_USER_GESTURE | VALIDATE_CACHE | VERIFY_EV_CERT)
                     --> method = "GET"
                     --> priority = "HIGHEST"
                     --> url = "https://xxx.cloudfront.net/vendor/vendor.f2b1f43b27a2.css"
t=205846 [st=  1]      URL_REQUEST_DELEGATE  [dt=0]
t=205846 [st=  1]      HTTP_CACHE_GET_BACKEND  [dt=0]
t=205846 [st=  1]      HTTP_CACHE_OPEN_ENTRY  [dt=7]
t=205853 [st=  8]      HTTP_CACHE_ADD_TO_ENTRY  [dt=1]
t=205854 [st=  9]      HTTP_CACHE_READ_INFO  [dt=8]
t=205863 [st= 18]      URL_REQUEST_DELEGATE  [dt=0]
t=205863 [st= 18]     +HTTP_STREAM_REQUEST  [dt=16]
t=205863 [st= 18]        HTTP_STREAM_REQUEST_STARTED_JOB
                         --> source_dependency = 349307 (HTTP_STREAM_JOB)
t=205879 [st= 34]        HTTP_STREAM_REQUEST_BOUND_TO_JOB
                         --> source_dependency = 349307 (HTTP_STREAM_JOB)
t=205879 [st= 34]     -HTTP_STREAM_REQUEST
t=205879 [st= 34]     +HTTP_TRANSACTION_SEND_REQUEST  [dt=0]
t=205879 [st= 34]        HTTP_TRANSACTION_SEND_REQUEST_HEADERS
                         --> GET /vendor/vendor.f2b1f43b27a2.css HTTP/1.1
                             Host: xxx.cloudfront.net
                             Connection: keep-alive
                             Cache-Control: max-age=0
                             Origin: https://app.foobar.com
                             User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/52.0.2743.116 Chrome/52.0.2743.116 Safari/537.36
                             Accept: text/css,*/*;q=0.1
                             DNT: 1
                             Referer: https://app.foobar.com/
                             Accept-Encoding: gzip, deflate, sdch, br
                             Accept-Language: en-US,en;q=0.8,nl;q=0.6
                             If-Modified-Since: Mon, 03 Oct 2016 16:41:26 GMT
t=205879 [st= 34]     -HTTP_TRANSACTION_SEND_REQUEST
t=205879 [st= 34]     +HTTP_TRANSACTION_READ_HEADERS  [dt=8]
t=205879 [st= 34]        HTTP_STREAM_PARSER_READ_HEADERS  [dt=7]
t=205886 [st= 41]        HTTP_TRANSACTION_READ_RESPONSE_HEADERS
                         --> HTTP/1.1 304 Not Modified
                             Connection: keep-alive
                             Date: Tue, 04 Oct 2016 12:23:13 GMT
                             Access-Control-Allow-Origin: https://app.foobar.com
                             Access-Control-Allow-Methods: GET, HEAD
                             Access-Control-Max-Age: 600
                             Access-Control-Allow-Credentials: true
                             Cache-Control: max-age=1314000
                             Expires: Fri, 20 Sep 2041 15:55:26 GMT
                             Server: AmazonS3
                             Vary: Accept-Encoding,Origin,Access-Control-Request-Headers,Access-Control-Request-Method
                             Age: 19823
                             X-Cache: Hit from cloudfront
                             Via: 1.1 e1199ec506dcf179c3e277ddd6c51498.cloudfront.net (CloudFront)
                             X-Amz-Cf-Id: wLxxeqDY8Jis1aua46vmQAyt-RO4UOmyK0ac8Qd4i0EOxxMB5WDaQQ==
t=205887 [st= 42]     -HTTP_TRANSACTION_READ_HEADERS
t=205887 [st= 42]      HTTP_CACHE_WRITE_INFO  [dt=0]
t=205888 [st= 43]      URL_REQUEST_DELEGATE  [dt=0]
t=205888 [st= 43]      URL_REQUEST_FILTERS_SET
                       --> filters = "FILTER_TYPE_GZIP"
t=205888 [st= 43]   -URL_REQUEST_START_JOB
t=205888 [st= 43]    URL_REQUEST_DELEGATE  [dt=3]
t=205891 [st= 46]    HTTP_CACHE_READ_DATA  [dt=6]
t=205897 [st= 52]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205898 [st= 53]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205906 [st= 61]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205907 [st= 62]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205908 [st= 63]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205917 [st= 72]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205918 [st= 73]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 6170
t=205922 [st= 77]    HTTP_CACHE_READ_DATA  [dt=3]
t=205925 [st= 80]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205925 [st= 80]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205926 [st= 81]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205928 [st= 83]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205929 [st= 84]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205930 [st= 85]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205931 [st= 86]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205933 [st= 88]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205934 [st= 89]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 25314
t=205935 [st= 90]    HTTP_CACHE_READ_DATA  [dt=12]
t=205948 [st=103]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 28672
t=205948 [st=103]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205972 [st=127]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205972 [st=127]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205975 [st=130]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205976 [st=131]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 32768
t=205977 [st=132]    URL_REQUEST_JOB_FILTERED_BYTES_READ
                     --> byte_count = 22121
t=205977 [st=132]    HTTP_CACHE_READ_DATA  [dt=0]
t=205977 [st=132] -REQUEST_ALIVE

css被成功加载，并且每次软刷新都会成功加载

有什么建议可以解释为什么会出现这个问题，以及我们可以做些什么来解决这个问题，或者一些需要调查的指针