Node.js中如何在page.evaluate的箭头函数内使用外部变量

问题原因 #

page.evaluate的执行上下文和你的Node.js脚本上下文完全隔离：

• page.evaluate内部的函数是在浏览器页面环境中运行，你声明的thing变量是在Node.js环境的作用域下，两个环境完全不互通，自然无法直接跨环境访问变量。
• 你尝试传参仍得到undefined，属于传参方式不符合规范，没有把外部变量作为page.evaluate的后续参数传入。

解决方法 #

把需要传递的外部变量作为page.evaluate的第二个及之后的参数传入，同时在evaluate的回调函数中声明对应形参接收即可，修改后的代码如下：

var thing = events[i]["Address"];

// 回调内声明形参接收外部传入的值，将变量作为evaluate的第二个参数传入
await page.evaluate( (targetVal) => {
  document.querySelector('[class="form-control tt-input"]').value = targetVal
}, thing)

补充说明 #

• 所有可序列化的类型（字符串、数字、普通JSON对象等）都可以用该方式传递，不可序列化的内容（比如函数、Symbol、DOM节点）无法直接跨环境传递。
• 如需传递多个变量，依次在page.evaluate的参数列表往后追加即可，回调形参位置对应接收就行：

await page.evaluate( (val1, val2, val3) => {
  // 浏览器侧执行逻辑
}, var1, var2, var3)

内容的提问来源于stack exchange，提问作者UnreadyDog