1

我有一个有效的 Google Chrome 扩展程序，我正在尝试使用附加功能对其进行扩展。

我已经修改了“popup.html”以包含对 jQuery 的外部引用，它们是：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

我在 CodeIgniter 中编写了相应的控制器模型方法来处理 jQuery 请求，这些请求在应用程序的其他地方使用，并且正在工作：

$(document).ready($(function(){
    $('#link').autocomplete({
        source: "http://domain.com/topics/jq_get_topics_by_search_as_object/",
        appendTo: ".link-results",
        open: function(event, ui) {
        $('ul.ui-autocomplete#link')
                .removeAttr('style')
                .hide()
                .appendTo('.link-results')
                .show();
        },
        select: function(event, ui) {
            $('.link-results')
                .append('<div class="topic-link-box" id="topic-link-box-' + ui.item.topic_id + '"><input type="checkbox" id="topic-link-item-' + ui.item.topic_id + '" name="topic-links-add[]" value="' + ui.item.topic_id + '" checked="checked"><a href="' + 'http://macbookpro.local/development/theundercloud/topics/edit/' + ui.item.topic_id + '" title="Edit ' + ui.item.name + '">' + ui.item.name + '</a> [<a href="' + 'http://macbookpro.local/development/theundercloud/topics/view/' + ui.item.topic_id + '">View</a>] [<a href="' + 'http://macbookpro.local/development/theundercloud/topics/visit/' + ui.item.topic_id + '" target="_blank">Link</a>]</div>');
        }
    }).data("autocomplete")._renderItem = function(ul, item) {
        return $('<li></li>')
            .data("item.autocomplete", item)
            .append('<a>' + item.name + '</a>')
            .appendTo(ul);
    };
}));

此外，我将它包装在 $(document).ready() 方法中，这是对我在应用程序本身中所做工作的唯一重大更改。

除了“popup.html”中的 jQuery 引用之外，我还有：

<form>
    <fieldset>
        <legend>Topics</legend>
        <dl>
            <dt><label for="link">Link</label></dt>
            <dd><input type="text" id="link" /></dd>
        </dl>
    </fieldset>
</form>

它在处理实际数据提交的主表单之外，在其中我有：

<div class="link-results"></div>

不用说，这种安排——据我所知并能够测试——与应用程序本身的工作版本相同。但是，它不适用于 Google Chrome 扩展程序。

更新

从那以后，我发现内容安全策略存在错误：

Refused to load the script 'https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js' because it violates the following Content Security Policy directive: "script-src 'self' https://www.google.com".
Refused to load the script 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js' because it violates the following Content Security Policy directive: "script-src 'self' https://www.google.com".
Uncaught ReferenceError: $ is not defined

我已将“manifest.json”更改为：

"permissions": [
    "tabs",
    "http://*/",
    "https://*/",
    "file:///*/*",
    "https://*.google.com/"
],
"content_security_policy": "script-src 'self' https://www.google.com; object-src 'self'",

我已经将使用 Google 对 jQuery 的脚本引用更改为“https”，但这并不是固定的事情。

有任何想法吗？

固定的

我将“manifest.json”中的 URL 更改为与脚本引用中相同的 URL。

4

2 回答 2

0

正如 Rob 不久前指出的那样，我将“manifest.json”中的 URL 更改为与脚本引用中相同的 URL。

于 2013-05-10T11:46:51.763 回答
0

我对 Web 浏览器安全模型的理解会阻止您从不安全的来源（例如动态插件）加载 javascirpt 页面。此外，根据某些扩展插件文档，所有 JS 文件都存在于扩展https://developer.chrome.com/extensions/overview.html#relative-urls中。

如此简单的答案是下载一个JQuery版本并将其包含在您的项目中。测试并为我工作。

于 2013-06-27T07:37:59.807 回答