I have inserted a google translate widget in the footer as follows:
<div id="google_translate_element"></div>
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'en'}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
This works fine when testing locally but gets blocked when I upload and try to test. My security header is as follows:
Cache-Control: no-cache, max-age=86400
Content-Security-Policy: default-src 'self' 'unsafe-inline' https://translate.google.com/ https://translate.googleapis.com/ :; frame-ancestors 'self'; script-src 'nonce-[%NONCE()%]' 'strict-dynamic' 'unsafe-eval';
Strict-Transport-Security: max-age=31536000; includeSubDomains
X-Content-Type-Options: nosniff
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block
Can someone help modify my custom security header so the google translate widget works?