I've successfully integrated google reCaptcha into my website.
<script src="https://www.google.com/recaptcha/api.js"></script>
It works OK. Now I', trying to make it more sucure. Adding Content-Security-Policy to .htaccess also worked well.
Header always set Content-Security-Policy ... Header always set Access-Control-Allow-Origin "https://www.google.com/" Header always set Access-Control-Allow-Methods "POST, GET"
Still works OK, but the problems begin when trying to add script integrity check:
<script src="https://www.google.com/recaptcha/api.js" integrity="sha512-s0NDd+2SST8+KCauhNc/r3PNSANq9TalIblRZkc+7ZqpHmo0bA+r/GJXTEygfi7Y+LgzuoHO7+1SQNuw8EbevA==" crossorigin = "anonymous"></script>
At this point browser refuses to work and throws bunch of errors at me:
Access to script at 'https://www.google.com/recaptcha/api.js' from origin 'https://mysite.lt' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. index.php:16 GET https://www.google.com/recaptcha/api.js net::ERR_FAILED 200
As you can see, Access-Control-Allow-Origin header is set, but error persists.
Tried lots of workarounds, like removing crossorigin = "anonymous", or making it camelCase - crossOrigin, changing hashing to SHA256 or SHA384 but nothing works.
I believe, this particular situation should be quite common - lots of sites use reCaptcha... How to deal with situation like this? Should I just quit checking .js integrity?