it-roy-ru.com

Расширение отказывается загружать скрипт из-за директивы Content Security Policy

Ниже приведен мой код HTML

Сценарии:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="background.js"></script>

HTML:

      <button name="btnlogin" id="btnlogin">Login</button><br/><br/>

и следующие JS

$(document).ready(function(){
document.getElementById("#btnlogin").click(function(){
   alert("s");
 });
});

файл манифеста:

{
"manifest_version": 2,
"name": "One-click Kittens",
"description": "This extension demonstrates a 'browser action' with kittens.",
 "version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
}

Я обнаружил, что когда я запускаю этот код просто в браузере, предупреждение отображается правильно, но когда я запускаю его как расширение chrome, оно выдает мне следующие ошибки).

Uncaught ReferenceError: $ не определено

а также

Отказался загружать скрипт ' http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js ' потому что он нарушает следующую директиву политики безопасности содержимого: "script-src 'self' chrome-extension-resource:".

Я не понимаю, что это за ошибки. Пожалуйста, помогите мне понять расширение ..

Спасибо

49
Maharshi

В Chrome внешние источники сценариев должны быть явно разрешены расширением политика безопасности содержимого (CSP) в вашем манифесте:

Если у вас есть потребность в каких-либо внешних ресурсах JavaScript или объектах, вы можете ограничить политику до некоторой степени, занеся в белый список безопасные источники, из которых следует принимать сценарии ...

Упрощенное определение политики, позволяющее загружать ресурсы скрипта с сайта example.com по HTTPS, может выглядеть следующим образом:

"content_security_policy":"script-src 'self' https://example.com; object-src 'self'"

Скрипты могут быть загружены только в расширение через HTTPS, поэтому вы должны загрузить ресурс jQuery CDN через HTTPS:

<script src="https://ajax.googleapis.com/..."></script>

И добавьте модифицированный CSP в свой манифест, чтобы разрешить ресурс HTTPS:

{
    "manifest_version": 2,
    "name": "One-click Kittens",
    "description": "This extension demonstrates a 'browser action' with kittens.",
    "version": "1.0",
    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html"
    },
    "content_security_policy": "script-src 'self' https://ajax.googleapis.com; object-src 'self'"
}

И даже лучшим решением для вашего конкретного случая будет включение jQuery в ваше расширение локально, а не загрузка из Интернета (например, ваше расширение в настоящее время не будет работать в автономном режиме). Просто включите копию jQuery в папку расширений и назовите ее относительным путем в теге скрипта. Предполагая, что ваша библиотека jQuery и всплывающий HTML-файл находятся в одном и том же подкаталоге, просто выполните:

<script src="jquery-x.y.z.min.js"></script>
61
apsillers