Question

我正在尝试设置firefox，chrome，safari和Internet Explorer的扩展程序，我正在使用crossrider。

基本上我想在点击时显示一个浏览器动作，显示一个弹出窗口，其中包含一个带有当前页面URL的输入文本和一个按钮，该按钮将打开一个新标签到另一个URL，并将url作为参数传递。

以下是我根据文档中的内容所做的工作;

extension.js：

appAPI.ready(function($) {
    appAPI.message.addListener(function(msg) {
        if (msg.request === 'getUrl'){
            appAPI.message.toPopup({url:location.href});
        }
    });
});

background.js：

var activeTabUrl;

appAPI.ready(function($) {
    appAPI.browserAction.setResourceIcon('logo-19.jpg');
    appAPI.browserAction.setBadgeText('extn', [255,0,0,125]);
    appAPI.browserAction.setTitle('Add Url to Site');

    appAPI.browserAction.setPopup({resourcePath:'pin.html', height: 300, width: 300});

});

pin.html：

<!DOCTYPE html>
<html>
    <head>
        <title>
        </title>

        <script type="text/javascript">
        function crossriderMain($) {
            activeTabUrl = null;

            appAPI.message.addListener(function(msg) {
                if (msg.url) {
                    activeTabUrl = msg.url;

                    $('#url').val(activeTabUrl);

                    if(activeTabUrl){
                        $('#addurl').prop('disabled', false);
                    }
                }
            });

            appAPI.message.toActiveTab({request:'getUrl'});


            $('#addurl').click(function(){
                var fullUrl = 'http://my.site.com/addurl?url=' + activeTabUrl;
                appAPI.openURL(fullUrl, "tab"); 
            });

        }
        </script>
    </head>
    <body>
        <input id="url" name="url" readonly="true" type="text"/>
        <input id="addurl" type="submit" value="Add Url" disabled/ >

    </body>
</html>

有时，包含网址的字段未填充，在特定网页上不会发生，对于同一网页，有时会显示，有时则不会。我无法确定具体原因。

我做错了吗？

Answer 1

代码看起来不错，只是在 pin.html 代码中声明 activeTabUrl 而不是 background.js 代码的一小部分因为它们的范围不同。

根据经验，我唯一能想到的可能导致问题的是有时浏览器会在消息监听器初始化之前返回消息响应。为了缓解这种情况，在 pin.html 代码中，添加延迟以发送请求URL的消息，如下所示：

setTimeout(funtion() {
  appAPI.message.toActiveTab({request:'getUrl'});
}, 0);

[披露]我是Crossrider员工

使用crossrider

1 个答案: