javascript - 从 Chrome 远程调试协议(protocol)访问 JavaScript 变量

Question

我通过 Remote Debugging Protocol 连接到 Chrome (34.0.1847.132) ，并且我已成功启用运行时和控制台调试。我可以发送 Chrome 消息并会收到回复。

现在，我想检查当前页面中某个 JavaScript 变量的属性。因此，在我的 HTML 页面中，脚本标记中包含以下语句:

window.foo = {
  'bar' : 'baz'
}

我可以在 Chrome 本身的控制台中使用 window.foo.bar 查询该属性，但我无法通过远程调试来执行此操作，因为我收到错误消息。

为了获取该属性，我将此 JSON 消息发送到 WebSocket:

{
  :method => "Runtime.getProperties", 
  :params => {
    :objectId => "window.foo.bar"
  }, 
  "id"=>2
}

我得到了回应:

{
    "error" => {
           "code" => -32000,
        "message" => "Inspected frame has gone"
    },
       "id" => 2
}

同样，如果我尝试Runtime.evaluate 表达式window.foo.bar，我得到:

{
    "result" => {
           "result" => {
                   "type" => "object",
               "objectId" => "{\"injectedScriptId\":1,\"id\":1}",
              "className" => "TypeError",
            "description" => "TypeError: Cannot read property 'bar' of undefined"
        },
        "wasThrown" => true
    },
        "id" => 2
}

什么会导致“检查框架”消失？那是什么，甚至？或者 objectId 是完全不同的东西吗？

我如何访问 JavaScript 变量的属性？

Answer 1

重要的是要知道Runtime.evaluate accesses at the level of window ，所以如果你想访问 window.document，你需要 document 作为表达式。

这样做最终奏效了:

window.document.foo = "bar"

在请求中:

{
  :method => "Runtime.evaluate", 
  :params => {
    :expression => "document.foo"
  },
  "id" => 1
}

如果您想访问对象属性等，您可能需要将参数中的 returnByValue 设置为 true。