热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

为什么chrome.tabs.query()在Chrome扩展程序中使用RequireJS调用时会返回标签的URL?

如何解决《为什么chrome.tabs.query()在Chrome扩展程序中使用RequireJS调用时会返回标签的URL?》经验,为你挑选了1个好方法。

我有一个简单的Chrome扩展程序,可添加浏览器操作.当扩展程序的弹出窗口打开时,它需要访问当前选项卡的URL.由于它不需要访问所有选项卡,我只是拥有activeTab清单中指定的权限:

{
    "manifest_version": 2,
    "name": "RequireJS Test",
    "version": "0.0.1",
    "description": "Test RequireJS and the activeTab permission.",
    "permissions": [
        "activeTab"
    ],
    "browser_action": {
        "default_popup": "popup.html"
    },
    "web_accessible_resources": [
        "js/*",
        "html/*",
        "css/*",
        "img/*"
    ]
}

理论上,这应该让弹出窗口访问活动选项卡的URL,但是当我从require()弹出窗口的main.js文件中的调用中查询选项卡时,不会返回URL :

require([], function() {
    chrome.tabs.query({"active": true, "lastFocusedWindow": true}, function (tabs) {
        var url = tabs[0].url;
        console.log("URL from main.js", url);
    });

    console.log("URL from global var accessed in main.js", tabURL);
});

控制台显示undefinedURL.但是,如果我从一个不使用的普通.js文件中进行相同的调用require(),它可以正常工作:

chrome.tabs.query({"active": true, "lastFocusedWindow": true}, function (tabs) {
    tabURL = tabs[0].url;
    console.log("URL from get-url.js", tabURL);
});

这显示了正确的URL,我可以tabURLrequire()通话中访问该全局.当我右键单击浏览器按钮并检查弹出窗口时,控制台输出如下所示:

URL from get-url.js http://stackoverflow.com/questions/ask
URL from global var accessed in main.js http://stackoverflow.com/questions/ask
URL from main.js undefined

更奇怪的是,我有时看到从该调用中的URL chrome.tabs.query()里面require()调用.但大多数情况下它不起作用.关于RequireJS如何加载脚本的一些内容似乎会混淆Chrome并删除加载脚本的URL访问权限.这是在Windows上的Chrome 40中.

显然,解决方法是在单独的脚本中获取URL并将其存储在变量中,但这感觉有些麻烦.我想看看是否有一种正确的方法可以使用RequireJS.

如果有人想在他们的机器上测试它,那么完整的插件源是:https://github.com/fwextensions/requirejs-url-test


编辑

正如Rob W.在下面解释的那样,这实际上与RequireJS无关.我get-url.js上面的文件中的代码返回正确的URL 的唯一原因是它恰好在devtools窗口打开之前运行.如果我将该文件更改为:

setTimeout(function() {
chrome.tabs.query({"active": true, "lastFocusedWindow": true}, function (tabs) {
    tabURL = tabs[0].url;
    console.log("URL from get-url.js", tabURL);
});
}, 5000);

然后它在devtools窗口打开后运行并且也失败.RequireJS不是罪魁祸首.



1> Rob W..:

您没有看到URL,因为您只设置了activeTab权限(而不是tabs)权限,最后一个关注窗口是开发人员工具(您无权activeTab访问)(并且自Chrome 41以来,devtools标签/窗口是扩展名不可见,因此tabs将是一个空数组).

好消息是,此问题特定于为扩展页面打开的devtools窗口,因此问题仅发生在开发期间,而不是在用户实际使用期间.

扩展弹出窗口与窗口关联,这样你就可以使用chrome.tabs.querycurrentWindow:true来得到正确的答案:

chrome.tabs.query({
    active: true,
    currentWindow: true
}, function(tabs) {
    var tabURL = tabs[0].url;
    console.log(tabURL);
});


谢谢你的回答.我尝试用`alert()`替换`console.log()`调用,甚至仍然查询`lastFocusedWindow`,每个警报显示正确的URL,这确认问题是通过检查弹出窗口打开devtools窗口.这也解释了为什么我偶尔会在`main.js`中看到正确的URL:代码必须在devtools打开之前完成运行,所以`lastFocusedWindow`仍然是网页.RequireJS与它无关.
我已提交错误报告:https://code.google.com/p/chromium/issues/detail?id = 462939
推荐阅读
  • 在寻找轻量级Ruby Web框架的过程中,您可能会遇到Sinatra和Ramaze。两者都以简洁、轻便著称,但它们之间存在一些关键区别。本文将探讨这些差异,并提供详细的分析,帮助您做出最佳选择。 ... [详细]
  • Python自动化测试入门:Selenium环境搭建
    本文详细介绍如何在Python环境中安装和配置Selenium,包括开发工具PyCharm的安装、Python环境的设置以及Selenium包的安装方法。此外,还提供了编写和运行第一个自动化测试脚本的步骤。 ... [详细]
  • Web App vs Native App:未来的移动应用趋势
    随着移动互联网的发展,Web App和Native App之间的竞争日益激烈。对于开发者而言,选择哪一种技术路径更为明智?本文将深入探讨两种应用模式的特点及未来趋势。 ... [详细]
  • Vue 开发与调试工具指南
    本文介绍了如何使用 Vue 调试工具,包括克隆仓库、安装依赖包、构建项目以及在 Chrome 浏览器中加载扩展的详细步骤。 ... [详细]
  • 2015款Chromebook Pixel评测:高端Chrome OS笔记本体验
    在笔记本电脑领域,Chromebook Pixel凭借其精致的铝合金外壳、细腻的显示屏和舒适的键盘,成为了外观设计的佼佼者。然而,尽管外观出众,它是否值得购买仍需考量。 ... [详细]
  • 利用CSS3和React实现数字滚动动画组件
    在前端开发中,数字滚动动画是一个常见的需求。本文将详细介绍如何使用CSS3和React构建一个数字滚动动画组件,包括组件的代码实现和样式设计。如果您对HTML版本感兴趣,欢迎留言获取。 ... [详细]
  • Vue项目中应用骨架屏实践
    在当前开发的项目中,由于登录过程涉及多次重定向,导致用户体验不佳。为了改善这一状况,本文介绍了如何使用vue-skeleton-webpack-plugin插件在Vue项目中实现骨架屏,以减少用户感受到的白屏时间。 ... [详细]
  • 从 Windows 转向 Mac 的开发者指南:必备技巧与工具
    本文旨在帮助从 Windows 转向 Mac 的开发者们,提供一系列实用的技巧和工具,确保过渡过程顺畅。 ... [详细]
  • 本文将详细介绍多个流行的 Android 视频处理开源框架,包括 ijkplayer、FFmpeg、Vitamio、ExoPlayer 等。每个框架都有其独特的优势和应用场景,帮助开发者更高效地进行视频处理和播放。 ... [详细]
  • 离线安装Grafana Cloudera Manager插件并监控CDH集群
    本文详细介绍如何离线安装Cloudera Manager (CM) 插件,并通过Grafana监控CDH集群的健康状况和资源使用情况。该插件利用CM提供的API接口进行数据获取和展示。 ... [详细]
  • HTML基础入门指南
    本文将深入浅出地介绍HTML的基础知识,包括其定义、开发工具、制定机构、特性、基本标签及更多实用内容。 ... [详细]
  • 精选多款高效实用软件及工具推荐
    本文介绍并推荐多款高效实用的软件和工具,涵盖系统优化、网络加速、多媒体处理等多个领域,并提供安全可靠的下载途径。 ... [详细]
  • 如何安装Google访问辅助插件
    在许多地区,直接访问Google可能受到限制。不过,通过使用特定的工具如Google访问辅助插件,可以绕过这些限制。本文将详细介绍如何安装这一实用的浏览器插件。 ... [详细]
  • 将基于Web的互动多媒体体验引入手机和平板电脑历来面临诸多挑战,如性能瓶颈、API兼容性和HTML5音频及视频播放限制等问题。本文探讨了如何克服这些障碍,为《霍比特人:史矛革之战》打造了一个移动优先的沉浸式网络体验。 ... [详细]
  • 本文介绍了如何使用Selenium库中的Keys模块来模拟键盘操作,包括常见的组合键和单个按键的使用方法。 ... [详细]
author-avatar
soseast9975
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有