1

APIにアクセスできる別のRSSリーダーで使用するために、Chrome用のGoogleリーダーのようなブラウザアクション拡張機能を作成しようとしています。これにより、ブラウザー アクションで X 個のリンクが生成され、それぞれが API によって指定された URL で新しいタブを開く必要があります。

ただし、リンクがクリックされるたびに、次のエラー メッセージが表示され続けます。 "Refused to execute JavaScript URL because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension-resource:"."

主にインライン スクリプトに表示されるエラー メッセージを読んでいますが、明示的な onLoads やインライン スクリプト タグなどはありません。

マニフェスト.json:

{
"name": "A reader extension",
"version": "0.0.1",
"manifest_version": 2,
"description": "Desc",
"homepage_url": "homepage.com",
"icons": {
    "16": "icons/icon16.png",
    "48": "icons/icon48.png",
    "128": "icons/icon128.png"
},
"default_locale": "en",
"background": {
    "page": "src/bg/background.html",
    "persistent": true
},
"browser_action": {
    "default_icon": "icons/icon19.png",
    "default_title": "browser action",
    "default_popup": "src/browser_action/browser_action.html"
},

"permissions": [
    "cookies",
    "https://www.a-reader.com/api/1/*",
    "http://www.a-reader.com/go?*"
]}

background-action.js

   function list() {
    $.getJSON('https://www.a-reader.com/api/current/', function (data) {
        var items = [];

        $.each(data, function (key, val) {
            if (val.idx < val.max_idx) {
                var line = "<tr class='listEntry'>" +
                    "<td> " +
                    "<a class='listLink' id='ID' data-uri='URI' href='javascript:void(0)'>BANNER</a> " +
                    "</td> " +
                    "<td> [UNREAD_ENTRIES] </td>" +
                    "</tr>";
                items.push(line.replace("ID", val.slug).
                    replace("URI", "http://www.a-reader.com/boilerplate?=" + val.uri).
                    replace("NAME", val.name).
                    replace("BANNER", val.banner.
                    replace("UNREAD_ENTRIES", "" + val.unread;
            }
        });

        $('<table/>', {
            'class': 'entry-list',
            html: items.join('')

        }).appendTo('#mainPopup');

    });
}
function newTabForEntry(entryUrl) {
    chrome.tabs.create({'url': entryUrl});
}
document.addEventListener('DOMContentLoaded', function () {
    list();

    document.querySelectorAll('.entryLink', function (entryLinks) {
        for (var i = 0, len = entryLinks.length; i < len; i++) {
            document.getElementById(i.id).addEventListener('click', function (e) {
                console.info(e);
                newTabForEntry(e.target.dataset.uri);
            });
        }
    });
});

browser-action.html

<!doctype html>
<html>
<head>
    <style type="text/css">
        body {
            max-height: 450px;
            width: 200px;
            background-color: #F6F7F4;
            overflow: hidden;
        }

        a:link {
            color: #F6F7F4;
            text-decoration: none;
            font-weight: bold;
        }

        a:visited {
            color: #F6F7F4;
            text-decoration: none;
            font-weight: bold;
        }

        a:hover {
            color: #F6F7F4;
            text-decoration: none;
            font-weight: bold;
        }

        ::-webkit-scrollbar {
            display: none;
        }

        #mainPopup {
            font-family: Helvetica, Ubuntu, Arial, sans-serif;
        }

        .listEntry {
            color: #F6F7F4;
            background-color: #483F36;
        }

        #banner {
            background-color: #483F36;
        }
    </style>
    <script type="text/javascript" src="../../js/jquery/jquery-2.0.0.js"></script>
    <script type="text/javascript" src="../../js/browser-action.js"></script>

</head>
<body>
<div id="banner">
    <img src="../../icons/reader-logo.png" width="124" height="25"/>
</div>

<div id="mainPopup">
</div>

</body>
</html>

これはインラインスクリプトを暗黙的に作成しますか、それとも他の方法で台無しにしましたか?

4

1 に答える 1