Chrome扩展程序从脚本中提取文本 | Chrome扩展程序从脚本中提取文本

本文介绍了Chrome扩展程序从脚本中提取文本的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试使用JS为Chrome扩展程序从脚本标记中提取webId％22：％22var字符串。我正在使用的示例允许我提取页面标题。

I'm attempting to pull "webId%22:%22" var string from a script tag using JS for a Chrome extension. The example I'm currently working with allows me to pull the page title.

// payload.js
chrome.runtime.sendMessage(document.title);


// popup.js
window.addEventListener('load', function (evt) {
    chrome.extension.getBackgroundPage().chrome.tabs.executeScript(null, {
        file: 'payload.js'
    });;
});

// Listen to messages from the payload.js script and write to popout.html
chrome.runtime.onMessage.addListener(function (message) {
    document.getElementById('pagetitle').innerHTML = message;


});


//HTML popup
<!doctype html>
<html>

<head>
    <title>WebID</title>
    <script src="popup.js"></script>
    <script src="testButton.js"></script>
</head>

<body>

    <button onclick="myFunction()">Try it</button>
    <p id="body"></p>

    <h3>It's working</h1>
    <p id='pagetitle'>This is where the webID would be if I could get this stupid thing to work.</p>




</body>
</html>

我想要提取的是下面的webID：

What I am trying to pull is the webID from below:

    <script if="inlineJs">;(function() { window.hydra = {}; hydra.state =
JSON.parse(decodeURI("%7B%22cache%22:%7B%22Co.context.configCtx%22:%7B%22webId%22:%22gmps-salvadore%22,%22locale%22:%22en_US%22,%22version%22:%22LIVE%22,%22page%22:%22HomePage%22,%22secureSiteId%22:%22b382ca78958d10048eda00145edef68b%22%7D,%22features%22:%7B%22directivePerfSwitch%22:true,%22enable.directive.localisation%22:true,%22enable.directive.thumbnailGallery%22:true,%22enable.new.newstaticmap%22:false,%22disable.forms.webId%22:false,%22use.hydra.popup.title.override.via.url%22:true,%22enable.directive.geoloc.enableHighAccuracy%22:true,%22use.hydra.theme.service%22:true,%22disable.ajax.options.contentType%22:false,%22dealerLocator.map.use.markerClustering%22:true,%22hydra.open.login.popup.on.cs.click%22:false,%22hydra.consumerlogin.use.secure.cookie%22:true,%22use.hydra.directive.vertical.thumbnailGallery.onpopup%22:true,%22hydra.encrypt.data.to.login.service%22:true,%22disable.dealerlocator.fix.loading%22:false,%22use.hydra.date.formatting%22:true,%22use.hydra.optimized.style.directive.updates%22:false,%22hydra.click.pmp.button.on.myaccount.page%22:true,%22use.hydra.fix.invalid.combination.of.filters%22:true,%22disable.vsr.view.from.preference%22:false%7D%7D,%22store%22:%7B%22properties%22:%7B%22routePrefix%22:%22/hydra-graph%22%7D%7D%7D")); }());</script>

推荐答案

你在 onclick 属性中使用内联代码无效，请参阅。

您可以在devtools控制台中看到弹出窗口中的错误消息：右键单击它，然后检查。

最简单的解决方案是附加点击popup.js文件中的监听器。

You have inline code in onclick attribute which won't work, see this answer.
You can see an error message in devtools console for the popup: right-click it, then "Inspect".
The simplest solution is to attach a click listener in your popup.js file.

弹出窗口是一个扩展页面，因此可以访问chrome.tabs。直接执行executeScript而不使用chrome.extension.getBackgroundPage（），只是不要忘记在manifest.json中添加必要的权限，最好是。

The popup is an extension page and thus it can access chrome.tabs.executeScript directly without chrome.extension.getBackgroundPage(), just don't forget to add the necessary permissions in manifest.json, preferably "activeTab".

对于这样一个简单的数据提取，你甚至不需要单独的内容脚本文件或消息，只需在executeScript中提供代码字符串。

For such a simple data extraction you don't even need a separate content script file or messaging, just provide code string in executeScript.

chrome.tabs.executeScript({
  code: '(' + (() => {
    for (const el of document.querySelectorAll('script[if="inlineJs"]')) {
      const m = el.textContent.match(/"([^"]*%22webId%22[^"]*)"/);
      if (m) return m[1];
    }
  }) + ')()',
}, results => {
  if (!chrome.runtime.lastError && results) {
    document.querySelector('p').textContent = decodeURI(results[0]);
  }
});

这篇关于Chrome扩展程序从脚本中提取文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！