Question

我想制作一个chrome扩展程序，它将连接到localhost服务器，以接收使用Grooveshark Javascript API在Grooveshark中播放歌曲的说明。（http://grooveshark.com/GroovesharkAPI.html）

例如，如果我在javascript控制台中输入window.Grooveshark.addSongsByID([13963],true)，它会添加歌曲并开始播放，因为我需要能够从扩展程序中执行此操作。首先，我只是想用后台页面进行扩展，只需要这个脚本来执行命令：

background.html

<!doctype html>
<html>
    <head>
        <script src="background.js"></script>
    </head>
    <body>
    </body>
</html>

background.js

chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.executeScript(
    null, {code:"window.Grooveshark.addSongsByID([13963],true)"});
});

的manifest.json

{
  "name": "Play song in Grooveshark",
  "version": "0.1.0",
  "background_page": "background.html",
  "permissions": [
    "tabs", "http://*/*"
  ],
  "browser_action": {
    "name": "Play song",
    "default_icon": "icon.png"
  }
}

有谁可以告诉我它为什么不起作用？

非常感谢!!

Answer 1

内容脚本无法访问父页面的window对象。您需要使用代码将<script>标记注入页面。

//bg page
chrome.tabs.executeScript(null, {
    code: "injectJs('window.Grooveshark.addSongsByID([13963],true)')"
});

//content script
function injectJs(code) {
        var scr = document.createElement("script");
        scr.type = "text/javascript";
        scr.text = code;
        (document.head || document.body || document.documentElement).appendChild(scr);
}

您可以通过清单向所有页面注入injectJs功能，然后在需要时调用它。

Answer 2

我写了一个包装器，使其几乎透明。脚本注入解决方案也不允许您从函数中获取任何返回值，而此代理也可以。

在您的内容脚本中包含此内容，并在GroovesharkProxy上调用方法而不是window.Grooveshark。

https://github.com/msfeldstein/Grooveshark-Chrome-Extension-Proxy

http://www.macromeez.com/use-groovesharks-js-api-from-a-chrome-extension/

Chrome扩展程序可以在Grooveshark中播放歌曲

2 个答案: