NW.js

Question

我想使用 NW.js 和 webview 控制外部网站，但每次尝试此操作时都会出现错误 - Angular 未定义。

我的来源：

index.html

html...head...body...
<webview id="webview" name="webview" src="https://google.com/" allownw></webview>
<script src="../js/script.js"></script>
...body...html

script.js

(function() {
var gui = require('nw.gui');
var win = gui.Window.get();
var webview = document.getElementById("webview");

var tray = new gui.Tray({
    icon : 'assets/icon.png'
});

var menu = new gui.Menu();

menu.append(new gui.MenuItem({
    type: 'normal',
    label: '▶️ Play',
    click: function() {
        webview.executeScript({code:"var player=angular.element(document.body).injector().get('player'); player.play();"});
    }
}));
tray.menu = menu;

}());

这段代码为我产生了错误：ReferenceError: angular is not defined

注意：网站 google.com 只是示例。

Answer 1

来自nw.js docs:

loading local files in webview

Add the following permission to the manifest:

  "webview": {
     "partitions": [
        {
          "name": "trusted",
          "accessible_resources": [ "<all_urls>" ]
        }
     ]
  }

and add 'partition="trusted"' attribute to the webview tag.

这是 <script 标签无法访问您的 ../js/script.js 文件的原因之一。我还建议使用本地文件示例的非相对路径：chrome-extension://yourdomain/js/script.js（并且它是相对于根而不是 'up' 目录）。

从 google 的 docs，您可以将 accessible_resources 设置为特定的模式或文件。

insertCss、setUserAgentOverride、permissionrequest 事件，尤其是 google 文档中的 executeScript，您可能会感兴趣。

注意：您可能不想让该 webview 访问您的 nwjs 上下文 (allownw)，因为它可以访问您的程序可以访问的 任何内容。对于外部 URL 和 http 尤其如此，其中 MITM 篡改或第三方更改可能会导致某人获得对您的应用程序运行所在的 PC 的更高访问权限。

对于您的示例，我会将 script.js 保留在 webview 之外，并让它通过脚本注入检测 webview。

NW.js - webview - Angular 未定义错误

NW.js - webview - Angular is not defined error

webview

angularjs