Google chrome extension 将JavaScript书签转换为Chrome浏览器操作扩展

我想创建一个Chrome扩展，浏览器操作

onClicked

，提供与以下书签相同的功能：

javascript:(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='http://page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

然而，我很难将书签的javascript代码正确地转换为Chrome扩展的逻辑。我认为最好是将书签的确切代码放入一个单独的脚本

create_feed\u url.js

，并在

background.js

中执行它。My

background.js

：

chrome.browserAction.onClicked.addListener(function(tab) {
    // Run the bookmark code
    chrome.tabs.executeScript(null, {file: "create_feed_url.js"});

    // Open a new tab for a valid url resulting from create_feed_url.js
    var feed_url = "http://page2rss.com/page?url=" + tab.url;
    chrome.tabs.create({"url": feed_url});

chrome.browserAction.onClicked.addListener(function(tab) {
    // Original bookmark JS code
    //(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='http://page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

    var create_feed_url = "http://page2rss.com/api/page?url=" + encodeURIComponent(tab.url); //+ "&callback=page2rss_bookmark_urlr" 
    var feed_url = "http://page2rss.com/page?url=" + tab.url;

    chrome.tabs.create({"url": create_feed_url, active: false}, function(tab) {
        chrome.browserAction.setBadgeText({text: 'wait'});
        setTimeout(function() { 
            chrome.tabs.remove(tab.id, function(tab) {
                chrome.browserAction.setBadgeText({text: ''});
            }); 

        }, 5000);
    });

    setTimeout(function() { 
        chrome.tabs.create({"url": feed_url, active: true}, function(tab) {
            chrome.tabs.onUpdated.addListener(function( tabId , info ) {
                if ( info.status == "complete" ) {
                    chrome.browserAction.setBadgeText({text: 'done', tabId: tabId});
                }
            });
        }); }
    , 1000);    
});

chrome.browserAction.onClicked.addListener(function(tab) {
    chrome.tabs.executeScript(null, {file: "content_script.js"});
});

var s = document.createElement('script');
s.src = chrome.extension.getURL("create_feed_url.js");
s.onload = function() {
    this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='//page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

然而，

create_feed_url.js

中的代码运行得并不成功。没有生成提要URL，导致

feed\u URL

的值不存在

我的问题是:

你能帮我找出为什么我不能把书签的代码放入

create\u feed\u url.js

并运行它吗

这种

executeScript

方法在我的例子中是值得推荐的，还是有更好的方法将书签转换为扩展

---

我通过调用URL解决了这个问题，URL在新选项卡中生成新提要，然后关闭它，最后跳转到带有最终RSS提要URL的选项卡。此解决方案不需要

create\u feed\u url.js

，但完全依赖

background.js

：

chrome.browserAction.onClicked.addListener(function(tab) {
    // Run the bookmark code
    chrome.tabs.executeScript(null, {file: "create_feed_url.js"});

    // Open a new tab for a valid url resulting from create_feed_url.js
    var feed_url = "http://page2rss.com/page?url=" + tab.url;
    chrome.tabs.create({"url": feed_url});

chrome.browserAction.onClicked.addListener(function(tab) {
    // Original bookmark JS code
    //(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='http://page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

    var create_feed_url = "http://page2rss.com/api/page?url=" + encodeURIComponent(tab.url); //+ "&callback=page2rss_bookmark_urlr" 
    var feed_url = "http://page2rss.com/page?url=" + tab.url;

    chrome.tabs.create({"url": create_feed_url, active: false}, function(tab) {
        chrome.browserAction.setBadgeText({text: 'wait'});
        setTimeout(function() { 
            chrome.tabs.remove(tab.id, function(tab) {
                chrome.browserAction.setBadgeText({text: ''});
            }); 

        }, 5000);
    });

    setTimeout(function() { 
        chrome.tabs.create({"url": feed_url, active: true}, function(tab) {
            chrome.tabs.onUpdated.addListener(function( tabId , info ) {
                if ( info.status == "complete" ) {
                    chrome.browserAction.setBadgeText({text: 'done', tabId: tabId});
                }
            });
        }); }
    , 1000);    
});

chrome.browserAction.onClicked.addListener(function(tab) {
    chrome.tabs.executeScript(null, {file: "content_script.js"});
});

var s = document.createElement('script');
s.src = chrome.extension.getURL("create_feed_url.js");
s.onload = function() {
    this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='//page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

---

根据Rob上面关于使用内容脚本方法的评论，我尝试实现它。但是，单击浏览器图标不会通过

content\u script.js

触发内容脚本

create\u feed\u url.js

。我试图调试代码，但无论是开发人员工具还是检查元素工具都没有显示任何错误

background.js

：

chrome.browserAction.onClicked.addListener(function(tab) {
    // Run the bookmark code
    chrome.tabs.executeScript(null, {file: "create_feed_url.js"});

    // Open a new tab for a valid url resulting from create_feed_url.js
    var feed_url = "http://page2rss.com/page?url=" + tab.url;
    chrome.tabs.create({"url": feed_url});

chrome.browserAction.onClicked.addListener(function(tab) {
    // Original bookmark JS code
    //(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='http://page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

    var create_feed_url = "http://page2rss.com/api/page?url=" + encodeURIComponent(tab.url); //+ "&callback=page2rss_bookmark_urlr" 
    var feed_url = "http://page2rss.com/page?url=" + tab.url;

    chrome.tabs.create({"url": create_feed_url, active: false}, function(tab) {
        chrome.browserAction.setBadgeText({text: 'wait'});
        setTimeout(function() { 
            chrome.tabs.remove(tab.id, function(tab) {
                chrome.browserAction.setBadgeText({text: ''});
            }); 

        }, 5000);
    });

    setTimeout(function() { 
        chrome.tabs.create({"url": feed_url, active: true}, function(tab) {
            chrome.tabs.onUpdated.addListener(function( tabId , info ) {
                if ( info.status == "complete" ) {
                    chrome.browserAction.setBadgeText({text: 'done', tabId: tabId});
                }
            });
        }); }
    , 1000);    
});

chrome.browserAction.onClicked.addListener(function(tab) {
    chrome.tabs.executeScript(null, {file: "content_script.js"});
});

var s = document.createElement('script');
s.src = chrome.extension.getURL("create_feed_url.js");
s.onload = function() {
    this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='//page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

content\u script.js

：

chrome.browserAction.onClicked.addListener(function(tab) {
    // Run the bookmark code
    chrome.tabs.executeScript(null, {file: "create_feed_url.js"});

    // Open a new tab for a valid url resulting from create_feed_url.js
    var feed_url = "http://page2rss.com/page?url=" + tab.url;
    chrome.tabs.create({"url": feed_url});

chrome.browserAction.onClicked.addListener(function(tab) {
    // Original bookmark JS code
    //(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='http://page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

    var create_feed_url = "http://page2rss.com/api/page?url=" + encodeURIComponent(tab.url); //+ "&callback=page2rss_bookmark_urlr" 
    var feed_url = "http://page2rss.com/page?url=" + tab.url;

    chrome.tabs.create({"url": create_feed_url, active: false}, function(tab) {
        chrome.browserAction.setBadgeText({text: 'wait'});
        setTimeout(function() { 
            chrome.tabs.remove(tab.id, function(tab) {
                chrome.browserAction.setBadgeText({text: ''});
            }); 

        }, 5000);
    });

    setTimeout(function() { 
        chrome.tabs.create({"url": feed_url, active: true}, function(tab) {
            chrome.tabs.onUpdated.addListener(function( tabId , info ) {
                if ( info.status == "complete" ) {
                    chrome.browserAction.setBadgeText({text: 'done', tabId: tabId});
                }
            });
        }); }
    , 1000);    
});

chrome.browserAction.onClicked.addListener(function(tab) {
    chrome.tabs.executeScript(null, {file: "content_script.js"});
});

var s = document.createElement('script');
s.src = chrome.extension.getURL("create_feed_url.js");
s.onload = function() {
    this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='//page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

create\u feed\u url.js

：

chrome.browserAction.onClicked.addListener(function(tab) {
    // Run the bookmark code
    chrome.tabs.executeScript(null, {file: "create_feed_url.js"});

    // Open a new tab for a valid url resulting from create_feed_url.js
    var feed_url = "http://page2rss.com/page?url=" + tab.url;
    chrome.tabs.create({"url": feed_url});

chrome.browserAction.onClicked.addListener(function(tab) {
    // Original bookmark JS code
    //(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='http://page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

    var create_feed_url = "http://page2rss.com/api/page?url=" + encodeURIComponent(tab.url); //+ "&callback=page2rss_bookmark_urlr" 
    var feed_url = "http://page2rss.com/page?url=" + tab.url;

    chrome.tabs.create({"url": create_feed_url, active: false}, function(tab) {
        chrome.browserAction.setBadgeText({text: 'wait'});
        setTimeout(function() { 
            chrome.tabs.remove(tab.id, function(tab) {
                chrome.browserAction.setBadgeText({text: ''});
            }); 

        }, 5000);
    });

    setTimeout(function() { 
        chrome.tabs.create({"url": feed_url, active: true}, function(tab) {
            chrome.tabs.onUpdated.addListener(function( tabId , info ) {
                if ( info.status == "complete" ) {
                    chrome.browserAction.setBadgeText({text: 'done', tabId: tabId});
                }
            });
        }); }
    , 1000);    
});

chrome.browserAction.onClicked.addListener(function(tab) {
    chrome.tabs.executeScript(null, {file: "content_script.js"});
});

var s = document.createElement('script');
s.src = chrome.extension.getURL("create_feed_url.js");
s.onload = function() {
    this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

(function(){if(!window.page2rss_bookmark_urlr)window.page2rss_bookmark_urlr=function(ur){if(ur.error)alert(ur.error);if(ur.page&&ur.page.page)location.href=ur.page.page};var r=document.getElementById('urlFormRequest');if(r)r.parentNode.removeChild(r);r=document.createElement('script');r.id='urlFormRequest';r.type='text/javascript';r.src='//page2rss.com/api/page?url='+encodeURIComponent(location.href)+'&callback=page2rss_bookmark_urlr';document.body.appendChild(r);})();

manifest.json

：

{
  "permissions": [
    "tabs", "http://*/*", "https://*/*"
  ],
  "background" : {
    "scripts": ["background.js"],
    "persistent": false
  },
  "web_accessible_resources": ["create_feed_url.js"],
  "browser_action" :
  {
    "default_icon" : "rss-19.png",
    "default_title" : "Create RSS feed for this page"
  },
  "manifest_version": 2
}

---

您知道内容脚本不会在页面上下文中运行吗？看，谢谢你，罗伯。我没有意识到这一点。那么我将所有代码逻辑放在

background.js

中的解决方案可能还不错。您当前的解决方案是次优的，因为即使在未使用的情况下，后台页面也会消耗内存。通常，所有bookmarklet都可以轻松转换为内容脚本。请参见更改

document.createElement（'create_feed_url'）

到

document.createElement（'script'）

，并从清单文件中删除

“content\u scripts”

条目（否则，即使未单击按钮，bookmarklet也始终处于激活状态。感谢Rob。这对http站点很有效，但对https端无效。它们会阻止bookmarklet代码的执行。例如：

[已阻止]页面位于https://bbs.archlinux.de/viewtopic.php?id=24576 从中运行不安全的内容http://page2rss.com/api/page?url=https%3A%2F%2Fbbs.archlinux.de%2Fviewtopic.php%3Fid%3D24576&callback=page2rss_bookmark_urlr.

我通过将bookmarklet的URL从

https://

更改为

//

来解决这个问题。