内容脚本不适用于Chrome扩展 [英] Content Script is not working in chrome extension

问题描述

我在内容脚本中使用 XMLHttpRequest 。只要新选项卡打开，代码就会工作，但只要更新了选项卡，代码就会停止工作。 tabupdation API只能在后台运行。

清单：

  {
manifest_version：2，
 
name：extension，
version：1.0，
description：，
图标：{
48：48X48.png，
128：icon1.png
}，
 
背景：{
scripts：[background.js]，
persistent：true 
}，
content_scripts：[{
matches ：[< all_urls>]，
js：[content.js]，
all_frames：true 
}] 
} 
  

内容脚本使用 XMLHttpRequest 。

var string =网页上的字符串;

  xmlhttp = new XMLHttpRequest（） ; 
 
 
 xmlhttp.onreadystatechange = function（）
 {
 if（xmlhttp.readyState == 4&& xmlhttp.status == 200）
 {
 
 alert（xmlhttp.responseText）; 
 
 
 xmlhttp.open（GET，url / folderName / file.php？q = string，true，userName，password）; 
 
 xmlhttp.send（）; 
  

字符串实际上是我从网页中检索并以xHR发送的值，但当标签url更改之前值会显示而不是新的。
当我在当前选项卡中打开网址时，此代码不起作用就像我们在YouTube上所做的那样，打开侧面提示的视频，但是如果我们在新标签页中打开任何视频，则内容脚本将工作/如果我们重新加载该标签，则内容脚本工作。 您可能误解了 chrome.tabs.onUpdated 事件。当标签网页的内容更新时，它不会触发，但当 已更新（例如，当您重新加载标签时， url 当前网页（例如通过AJAX）的链接，然后点击 不会触发 onUpdated


如果您想要监听网页本身的变化，您应该查看 一个href =https://developer.mozilla.org/en-US/search?q=MutationObserver =nofollow noreferrer> MutationObserver 。

对于某些关于使用 MutationObserver ，你可以看看 here 和 。


I use XMLHttpRequest in content script. The code works whenever a new tab opens, but it stops working whenever a tab is updated. tabupdation API only works in background.

Manifest:

{
    "manifest_version": 2,

    "name": "extension",
    "version": "1.0",
    "description": "",
    "icons" : {
        "48" : "48X48.png",
        "128": "icon1.png"
    },

    "background": {
        "scripts":    ["background.js"],
        "persistent": true    
    },    
    "content_scripts": [{
        "matches":    ["<all_urls>"],
        "js":         ["content.js"],
        "all_frames": true
    }]
}

The content script uses XMLHttpRequest.

var string="string on web page ";

 xmlhttp=new XMLHttpRequest();


xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {

alert(xmlhttp.responseText);
}
}
 xmlhttp.open("GET","url/folderName/file.php?q=string",true,"userName","password");

 xmlhttp.send();

string is actually the value which i retrieved from web page and send in xHR but when tab url changes previous values are displayed instead of new one. This code does not work whenever i open url in current tab e.g. as we do in youtube, open video suggested on side but if we open any video in new tab then content script work/if we reload that tab then content script worked.

解决方案

You have probably misunderstood the concept of the chrome.tabs.onUpdated event. It does not fire when the content of a tab's web-page is updated, but when the tab's properties are updated (e.g. when you reload the tab, the url property is updated).

Clicking on a link that loads a different video into the current web-page (e.g. through AJAX) does not trigger an onUpdated event.

If you want to listen for changes in the web-page itself, you should look into MutationObserver.
For some examples on using a MutationObserver within a Chrome Extension you can take a look here and there.

这篇关于内容脚本不适用于Chrome扩展的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！