Question

我正在尝试制作一个Chrome扩展程序，该扩展程序获取当前页面的网址，并使用它来创建并显示使用以下Google API链接到该网址的二维码。

这是我的popup.js

chrome.tabs.getSelected(null,function(tab) {
var tablink = tab.url;
});

document.write('https://chart.googleapis.com/chart?chs=100x100&cht=qr&chl=' + tablink);

这是我的manifest.json

{
  "name": "Qrit",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Instantly creates a QR Code that links to the current page.",
  "browser_action": {
    "default_icon": "icon.png",
     "default_popup": "popup.html"
  },
  "permissions": [
    "tabs"
  ]
}

问题是弹出窗口只是空白。我几乎不了解Javascript，也不了解Json。

Answer 1

首先你写“manifest_version”：2，它不允许内联脚本。其次，你的弹出代码应该像这样写

chrome.tabs.getSelected(null,function(tab) {
var tablink = tab.url;
document.write('https://chart.googleapis.com/chart?chs=100x100&cht=qr&chl=' + tablink);
});

Answer 2

正如汤姆所说，使用清单版本2，您无法使用内联脚本。此外，chrome.tabs.getSelected被斩首，您应该使用chrome.tabs.query 这是让你入门的东西......

manifest.json

{
  "name": "Qrit",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Instantly creates a QR Code that links to the current page.",
  "browser_action": {
    "default_icon": "icon.png",
     "default_popup": "popup.html"
  },
  "permissions": [
    "tabs"
  ]
}

popup.html

<!DOCTYPE html>
<html>
    <head>
        <script src='popup.js'></script>
    </head>
    <body>
        <div id='message'>Getting Image....</div>
    </body>
</html>

popup.js

function onImageLoad() {
  var message = document.querySelector('#message');
  message.parentNode.removeChild(message);
}

function onImageError(e) {
  var message = document.querySelector('#message');
  message.innerText = 'Error getting image';
  e.srcElement.parentNode.removeChild(e.srcElement);
}

function onWindowLoad() {
  chrome.tabs.query({
    'active': true,
    'windowId': chrome.windows.WINDOW_ID_CURRENT
  }, function(tab) {
    var image = document.createElement('IMG');
    image.src = 'https://chart.googleapis.com/chart?chs=100x100&cht=qr&chl=' + tab[0].url;
    document.body.appendChild(image);
    image.onload = onImageLoad;
    image.onerror = onImageError;
  });
}

window.onload = onWindowLoad;

如何在分机的弹出窗口中显示网址的内容？

2 个答案: