1

この種のことを達成する方法についてのガイドが必要です。

私がやりたいことは、page_action を使用して特定の URL のポップアップを表示することです。私が達成したいのは次のようなものです：

ユーザーがブラウザーで URL を読み込むと、AJAX 要求が私のサービスに送信され、URL をチェックします。私のサービスで URL が見つかった場合、それに対して何らかのテキストを返すとします。そのテキストがポップアップに表示されます。

そのためにchrome.tabs.onUpdated.addListener関数を使用しています。問題は、ユーザーが新しいタブを開くたびにこの関数が呼び出され、ポップアップ ページが更新され、以前に開いたタブのメッセージが削除されることです。

解決策はありますか？

更新:コードを貼り付けています。何が問題なのか確認していただけますか?

マニフェスト.json

{
    "manifest_version" : 2,

    "name" : "Know your cashback for a site!",
    "version" : "1.0",
    "description" : "Find out about the cashback of the visiting website right in your browser",

    "background" : { "scripts" : ["jquery.js","records.js"]},
    "permissions" : [ "http://*/*", "https://*/*", "tabs" ],    

    "page_action" : {
                    "default_icon"  : "images/icon.png"
                    }
}

records.js

var result;
function checkForValidUrl(tabId, changeInfo, tab) {
    if (tab.url !== undefined && changeInfo.status == "complete") {
            $.ajax({
            url: 'http://localhost/chrome_extension/index.php',
            data: "url=" + encodeURIComponent(tab.url),
            type:'GET',
            success: function(resp) {
                    if(resp=="not_found"||resp=="invalid_request") {
                        // do nothing
                    } else {
                        resp = JSON.parse(resp);
                        chrome.pageAction.show(tabId);
                        chrome.pageAction.setTitle({
                                                   tabId: tabId,
                                                   title: resp.cashback
                                                   });
                        chrome.pageAction.setPopup({
                                                   tabId: tabId,
                                                   popup: "popup.htm"
                                                   });
                        window.result = resp;
                        //alert('update successful');
                    }               
                }
            });
    }
};

// Listen for any changes to the URL of any tab.
chrome.tabs.onUpdated.addListener(checkForValidUrl);

popup.htm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>Untitled Document</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<span id="request"></span>
<a href="#" id="ref_link"></a>
</body>
</html>

popup.js

var BGPage = chrome.extension.getBackgroundPage();
if(typeof BGPage.result !== undefined) {
document.getElementById('request').innerHTML = BGPage.result.cashback;
document.getElementById('ref_link').href = BGPage.result.store;
}

$('a#ref_link').on('click', function(e) {
    var href = e.currentTarget.href;
    chrome.tabs.query({active:true}, function (tab){
        chrome.tabs.update(tab.id, {url: href});
    });
});
4

1 に答える 1

3

ポップアップに結果を表示するために単一の変数を使用していました。localStorage (各タブの tabIds およびその他の値を格納するため) を使用すると、問題が解決しました。

更新:新しいブラウザー ウィンドウに古いデータが読み込まれないようにするために、localStorage の代わりにウィンドウ オブジェクトを使用しています。

マニフェスト.json

{
    "manifest_version" : 2,

    "name" : "Know your cashback for a site!",
    "version" : "1.0",
    "description" : "Find out about the cashback of the visiting website right in your browser",

    "background" : { "scripts" : ["jquery.js","records.js"]},
    "permissions" : [ "http://*/*", "https://*/*", "tabs" ],    

    "page_action" : {
                    "default_icon"  : "images/icon.png"
                    }
}

records.js

function checkForValidUrl(tabId, changeInfo, tab) {
    if (tab.url !== undefined && changeInfo.status == "complete") {
            $.ajax({
            url: 'http://localhost/chrome_extension/index.php',
            data: "url=" + encodeURIComponent(tab.url),
            type:'GET',
            success: function(resp) {
                    if(resp=="not_found"||resp=="invalid_request") {
                        // do nothing                       
                    } else {
                        resp = JSON.parse(resp);
                        chrome.pageAction.show(tabId);
                        chrome.pageAction.setTitle({
                                                   tabId: tabId,
                                                   title: resp.cashback
                                                   });
                        chrome.pageAction.setPopup({
                                                   tabId: tabId,
                                                   popup: "popup.htm"
                                                   });
                    window.window["tab" + tabId] = resp.cashback;
                    window.window["store" + tabId] = resp.store;                
                    }               
                }
            });
    }
};

// Listen for any changes to the URL of any tab.
chrome.tabs.onUpdated.addListener(checkForValidUrl);

popup.htm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
<title>Untitled Document</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<span id="request"></span>
<a href="#" id="ref_link"></a>
</body>
</html>

popup.js

var BGPage = chrome.extension.getBackgroundPage();
chrome.tabs.getSelected(null, function(tab) {
    if(typeof BGPage.window["tab" + tab.id] != undefined) {
            document.getElementById('request').innerHTML = BGPage.window["tab" + tab.id];
            document.getElementById('ref_link').href = BGPage.window["store" + tab.id];     
    }
});

@RobWに感謝します

于 2013-05-06T15:16:52.173 に答える