javascript - Chrome 不会加载 jquery 或 soundcloud api

标签 javascript jquery google-chrome google-chrome-extension soundcloud

我正在尝试构建一个 chrome 扩展,但出于某种原因,我似乎无法向 SoundCloud 发出 API 请求或加载 Jquery。

我知道是因为这个:

我将这样加载 jquery:

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

在我的控制台中,我会收到

Failed to load resource: net::ERR_FAILED 
chrome-extension://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js

同样的事情发生在 soundcloud api 上:

chrome-extension://api.soundcloud.com/tracks?q=buskers&client_id=xxxxxxxxxx&format=json&_status_code_map[302]=2

为什么 chrome-extension// 一直出现在 url 前面,我该如何阻止它?

最佳答案

根据Content Script Policy (CSP),脚本资源只能从扩展程序包中加载。这将使扩展程序更加安全,并确保扩展程序只会执行您批准的代码。

解决方案 1:下载特定版本的 jQuery 文件,将其包含到您的包中,然后将其加载到文档中。

<script src="js/jquery.1.11.1.min.js"></script>

方案二:其实可以通过在manifest文件中定义资源来源白名单来放宽限制。可以引用this如果您出于某些原因需要加载外部 js 文件,请了解更多详细信息。

"content_security_policy": "script-src 'self' https://ajax.googleapis.com https://api.soundcloud.com/tracks?q=buskers&client_id=xxxxxxxxxx&format=json&_status_code_map[302]=2; object-src 'self'"

注意:

白名单资源只允许通过以下协议(protocol)加载:HTTPSchrome-extensionchrome-extension-resource。如果要采用白名单方案,请使用https加载外部库。

如果要在白名单中定义多个域,请使用空格将域彼此分隔开。

"content_security_policy": "script-src 'self' https://domain1.com https://domain2.com;"

关于javascript - Chrome 不会加载 jquery 或 soundcloud api,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24837069/

相关文章:

javascript - 如何将 mongo objectId 字段设置为 null 或为空甚至删除该字段?

javascript - 动态组件元素在 Vue.js 中不起作用

javascript - 强制启动选项卡处于事件状态

javascript - Mac 上网络浏览器中的控制键

css - 在 Chrome 上使用 CSS 过滤器进行断断续续的转换

javascript - 我有一个 GULP 任务文件,用于使用 babelify 编译带有 JSX 代码的 js 文件,但无法使用它

javascript - 使用 javascript 从下拉列表中获取事件元素时出现问题

jquery - Tinysort按多个属性排序(超过1个)

jquery - 以固定大小比例调整 div 的大小

google-chrome - 如何从 Xvfb 获取显示中的所有进程?