как исправить «Директиву о политике безопасности содержимого Chrome» в расширении Chrome

Question

Я делаю расширение для Chrome, которое обращается к API Википедии через вызов ajax с использованием JQuery.Я включил копию JQuery в локальную папку js моего расширения.во всплывающем окне у меня есть вход, и я беру это значение и делаю запрос get в popup.js, и я получаю «Отказ от загрузки скрипта, потому что он нарушает следующую директиву политики безопасности контента:« script-src 'self' blob: filesystem: chrome-extension-resource: ". Обратите внимание, что 'script-src-elem' не был задан явно, поэтому 'script-src' используется как запасной вариант."

У меня установлено WebRequest and <all_urls>в разрешениях в manifest.json файле.Вот как мои разрешения выглядят в манифесте: "permissions": [ "tabs", "webNavigation", "webRequest", "<all_urls>", "https://en.wikipedia.org/*" ], Я видел, что добавление "content_security_policy": "script-src-elem 'self' https://www.wikipedia.org/" облегчит его, но это не решило проблему.

$('#urlCopyButton').click(function search() {
    var searchWord = document.querySelector('#searchWord').value;
    console.log(searchWord);
    var results = [];


$.ajax({
          crossDomain: true,
          header: 'Access-Control-Allow-Origin',
          url:`https://en.wikipedia.org/w/api.php?action=opensearch&format=json&maxlag=5&search=${searchWord}&callback=?`,
          type: 'GET',
          dataType: 'json',
          beforeSend: function(xhr){xhr.setRequestHeader('https://en.wikipedia.org', 'https://en.wikipedia.org');},
          success: (data) => {
              $("#output").html("");
            var i =0;
            for (var i = 0; i < data[1].length; i++) {
              $("#output").append(`<li><a href= "${data[3][i]  } ">${data[1][i] + " " + data[2][i]}<a></li>`);
            }
            console.log(data);
          },
          error: (err) =>{
            console.log(err.responseJSON);
          }


      })

})

Я ожидаю, что это будет успешно, и данные будут отображаться в консоли, но это не выдает эту ошибку:

Отклоненозагрузить сценарий 'https://en.wikipedia.org/w/api.php?action=opensearch&format=json&maxlag=5&search=dfa&callback=jQuery33108394586597996985_1549655186216&_=1549655186217', поскольку он нарушает следующую директиву политики безопасности содержимого: "script-src' self 'blob: filesystem: chrome-extension-resource:".Обратите внимание, что «script-src-elem» не был задан явно, поэтому «script-src» используется в качестве запасного варианта.

send @ jquery.js: 2 "

Answer 1

Параметр callback=? из Википедии - древний хак для загрузки dataType: 'json' в виде скрипта, который по умолчанию запрещен CSP в расширениях.Хотя многие существующие ответы предлагают ослабить расширение CSP расширения по умолчанию, очевидно, это плохое решение, которое открывает расширение для различных удаленных атак (например, MitM).

Просто удалите параметр &callback=?, чтобы википедия вернула действительныйJSON по умолчанию.

Нет необходимости в связанных с CORS настройках, таких как заголовки или crossDomain: true, нет необходимости изменять CSP.

$.ajax({
  url: 'https://en.wikipedia.org/w/api.php?' +
       'action=opensearch&format=json&maxlag=5&search=' + encodeURIComponent(searchWord),
  success(data) {
    // ...............
    // data is an object/array, you can process it directly here
    // ...............
  },
});

manifest.json должен разрешать URL:

• "permissions": ["https://*.wikipedia.org/"]
• "permissions": ["<all_urls>"]