简体   繁体   English

获取从Chrome扩展程序打开的弹出窗口的URL

[英]Get URL of popup window opened from a Chrome Extension

I've got a Chrome extension that creates a popup window that the user needs to use for a login system. 我有一个Chrome扩展程序,该扩展程序创建了用户需要用于登录系统的弹出窗口。 You click on the extension icon and it opens up its application (AngularJS in my case). 您单击扩展图标,它将打开其应用程序(在我的情况下为AngularJS)。 The user then clicks on a button which calls chrome.windows.create() to open a popup. 然后,用户单击调用chrome.windows.create()的按钮以打开弹出窗口。

I would like the main extension app to monitor the URL of that popup for changes. 我希望主扩展程序应用程序监视该弹出窗口的URL进行更改。

I create the popup from the extension this way: 我通过这种方式从扩展名创建弹出窗口:

chrome.windows.create(
    {
      url: 'https://some.external.url.com/whatever',
      type: 'panel',
      width: 600,
      height: 600
    },
    function (windowReference) {
      console.log('My Window:', windowReference);
      // start monitoring URL of windowReference somehow
      // could be as simple as a setInterval() loop
    }
)

The problem is that the windowReference object passed to the callback doesn't have the current URL of the popup. 问题在于传递给回调的windowReference对象没有弹出窗口的当前URL。 Since the user can interact with the page in the popup (I'm pointing it at out OAuth2 system), the URL will change at times. 由于用户可以与弹出窗口中的页面进行交互(我将其指向OAuth2系统),因此URL有时会更改。 I want to see that - either actively as changes are made, or by simply querying the current URL periodically. 我想看看-是在进行更改时主动进行,还是只是通过定期查询当前URL来进行查看。

This is what the windowReference object contains: 这是windowReference对象包含的内容:

{
    alwaysOnTop:false,
    focused:false,
    height:600,
    id:1089,
    incognito:false,
    left:61,
    state:"normal",
    top:23,
    type:"popup",
    width:600
}

You can see that there is an ID there, and that, to me, suggest that I might be able to use it to call some other method to get the real URL information I'm after. 您可以看到那里有一个ID,对我来说,建议我也许可以使用它来调用其他方法来获取我想要的真实URL信息。

Any help would be appreciated. 任何帮助,将不胜感激。

So the answer turns out to be pretty simple. 因此答案很简单。 As Rob W mentioned in a comment, you use the chrome.tabs.query() method to do the search as you would for any other tab. 正如Rob W在评论中提到的那样,您可以使用chrome.tabs.query()方法进行搜索,就像搜索其他任何标签一样。

The missing part for me was that you can use the id from the window reference you get when the popup is created to get the desired results from the tabs query: 对我来说,缺少的部分是您可以使用创建弹出窗口时从窗口引用中获得的id来从选项卡查询中获得所需的结果:

chrome.tabs.query(
    { windowId: windowReference.id }, 
    function callback(tabs) {
        var popup = tabs[0];
        $log.debug("Popup URL:", popup.url);
    }
);

You can see that I passed the ID as the value of the windowId parameter in the search query object. 可以看到,我在搜索查询对象中将ID作为windowId参数的值传递了。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM