当浏览器重新加载页面时，如何从chrome扩展程序(无需单击)向flask发送POST请求? [英] How to send POST request from chrome extension (without clicking) to Flask when browser is reloading the page?

问题描述

我想合并以下代码段，以便在Chrome浏览器中的页面加载时，无需点击扩展程序图标就可以将chrome扩展程序中的发布请求(包含URL)发送到烧瓶.这可能吗?此外，我希望仅在我声明的特定页面上显示弹出窗口(我相信manifest.json中有一种方法(匹配项")，但是，我不知道该如何实现.)

I want to merge the snippets below to be able to send post request (containing URL) from chrome extension to flask whenever the page in Chrome is loading without clicking the extension' icon. Is this possible? Moreover I would like the popup to be shown only on specific pages that I declare (I believe there is a way ('matches') for this in manifest.json however, I don't know how to implement this.)

chrome.tabs.query({
active: true,
lastFocusedWindow: true
}, function(tabs) {
var tab=tabs[0];
    console.log(tab.url);
var xhr = new XMLHttpRequest();
    xhr.addEventListener("readystatechange", function () {
    if (xhr.readyState == 4) {
        console.log(xhr.responseText);
        alert(xhr.responseText)
  }
});
    xhr.open("POST", "http://localhost:5000/",true);
    xhr.send(tab.url); 
});

此脚本允许我在点击时发送发帖请求，但是我需要这样做，而无需点击.我还发现了这样一个脚本，它可以在右下角显示有关浏览器内容更改的所有信息:

This script allows me to send post request on click, however I need to do this without clicking. I found also such a script that displays all information about change in browser content in down-right corner:

 chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
 alert(changeInfo.url);
 console.log(changeInfo.url);

我试图将两者合并，但没有结果.我是JS和Chrome扩展程序的新手，因此非常感谢您的帮助.

I tried to merge these two, but with no result. I'm kind of newbie to JS and Chrome Extensions, so I would be duty grateful for your help.

到达这一点后，我希望能够有条件地显示弹出窗口，这仅是在特定页面将被加载时，因此，我感谢您的进一步提示.

After reaching this point I would like to be able to show popup conditionally, this is only when the specific page will be loaded, so I would appreciate your further hints.

推荐答案

您可以使用 chrome.webNavigation.onCommitted ，并指定要监控的网址列表.
以下代码使用console.log，因此输出显示在后台控制台中.

You can use chrome.webNavigation.onCommitted and specify a list of URLs to monitor.
The code below uses console.log so the output is shown in the background console.

manifest.json:

manifest.json:

{
  "name": "test",
  "version": "0.0.1",
  "manifest_version": 2,
  "background": {
    "scripts": [
      "background.js"
    ],
    "persistent": false
  },
  "permissions": [
    "webNavigation",
    "http://localhost/"
  ]
}

background.js:

background.js:

chrome.webNavigation.onCommitted.addListener(onCommitted, {
  url: [
    {hostEquals: 'www.example.org'},
    {urlPrefix: 'https://example.org/'},
    {urlMatches: '^https://(www\\.)?example.org/.*$'},
  ],
});

function onCommitted(info) {
  const xhr = new XMLHttpRequest();
  xhr.onload = () => {
    console.log('%d:%d', info.tabId, info.frameId, info.url, xhr.responseText);
  };
  xhr.open('POST', 'http://localhost:5000/');
  xhr.send(info.url);
}

这篇关于当浏览器重新加载页面时，如何从chrome扩展程序(无需单击)向flask发送POST请求?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！