I added integrity
and crossorigin
tags to my scripts according to Subresource Integrity, but now they give an error in the console saying
Script from origin 'http://pagead2.googlesyndication.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:81' is therefore not allowed access.
Here is the script:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"
integrity="sha256-5xwrIw3xU3VvipjVMZNyf6+27C/a1Pxl3U0jl3hTcao="
crossorigin="anonymous"></script> <!-- Banner --> <ins class="adsbygoogle" style="display:inline-block;width:728px;height:90px" data-ad-client="ca-pub-3346556035533863" data-ad-slot="8052306231"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>
Here is the derivation:
$ curl -s http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js | openssl dgst -sha256 -binary | openssl base64 -A
5xwrIw3xU3VvipjVMZNyf6+27C/a1Pxl3U0jl3hTcao=
I also added the attributes to an Amazon script, and that fails too.
Script from origin 'http://s3.amazonaws.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:81' is therefore not allowed access.
<script async="async" type="text/javascript" src="//s3.amazonaws.com/cc.silktide.com/cookieconsent.latest.min.js"
integrity="sha256-/8egBZx4+UIzXH8il2CNdL5+npDYgoAsjC76KHO/re4=" crossorigin="anonymous"></script>
Chrome supports SRI: http://enable-cors.org/client.html, https://www.chromestatus.com/feature/6183089948590080
I verified the hash is generating correctly using the example in the specifications: http://www.w3.org/TR/SRI/#integrity-metadata
So why isn't it working? It works without the two new attributes.
Chrome Version 46.0.2490.86 m
I think it was because the server did not specifically allow CORS, so Chrome blocked it. Silktide cookie script moved to Cloudflare, which explicitly does have Access-Control-Allow-Origin
, so now it works. I don't know why the browser would care whether the server allows cross-origin scripts or not. It seems that as long as the hashes match it doesn't really matter where it comes from.
<script async="async" type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/1.0.9/cookieconsent.min.js"
integrity="sha256-GQ/ALY6PHdWsxA9I0NYgPmEV6zHj9H9V2ww/B3l9aPA=" crossorigin="anonymous"></script>
Server headers:
$ curl -I http://cdnjs.cloudflare.com/ajax/libs/cookieconsent2/1.0.9/cookieconsent.min.js
HTTP/1.1 200 OK
Date: Tue, 24 Nov 2015 19:37:10 GMT
Content-Type: application/javascript
Connection: keep-alive
Last-Modified: Mon, 19 Oct 2015 15:05:30 GMT
Expires: Sun, 13 Nov 2016 19:37:10 GMT
Cache-Control: public, max-age=30672000
Access-Control-Allow-Origin: *
CF-Cache-Status: HIT
Server: cloudflare-nginx
CF-RAY: 24a791216c9b03f4-EWR