Electron webContents executeJavaScript:无法在第二个 loadURL 上执行脚本

问题描述

我正在测试 Electron 并专门使用 executeJavaScript.我的项目使用 POST 请求登录网站，然后做一些工作并使用同一会话加载第二个 URL.在第二个 URL 中，我需要执行 JS，但我不确定我做错了什么.

I am testing out Electron and specifically working with executeJavaScript. My project uses a POST request to sign into a website, then does a bit of work and loads a second URL using the same session. In this second URL, I need to execute JS but I am not sure what I am doing wrong.

在此示例中，我创建了一个简化版本，模拟访问两个 URL 并在第二个 URL 上执行 JS.关于这里发生了什么的任何想法?

In this example I created a dumbed down version that simulates going to two URL's and executing JS on the second. Any ideas on what is going on here?

const {app, BrowserWindow} = require('electron');

let win;

function createWindow() {

  win = new BrowserWindow({width: 1000, height: 600})
  win.openDevTools();

  // First URL
  win.loadURL('https://www.google.com')

  // Once dom-ready
  win.webContents.once('dom-ready', () => {

    // THIS WORKS!!!
    win.webContents.executeJavaScript(`
      console.log("This loads no problem!");
    `)

    // Second URL
    win.loadURL('https://github.com/electron/electron');

    // Once did-navigate seems to function fine
    win.webContents.once('did-navigate', () => {

      // THIS WORKS!!! So did-navigate is working!
      console.log("Main view logs this no problem....");

      // NOT WORKING!!! Why?
      win.webContents.executeJavaScript(`

        console.log("I canot see this nor the affects of the code below...");

        const form = document.querySelectorAll('form.js-site-search-form')[0];

        const input = form.querySelectorAll('input.header-search-input')[0]

        input.value = 'docs';

        form.submit();

      `)

    })
  })
}

app.on('ready', createWindow );

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit();
  }
});

推荐答案

这是因为你试图在 dom-ready 事件之前运行 Javascript.

It is because you are trying to run the Javascript before the dom-ready event.

在此事件完成后尝试执行您的 javascript，如下所示

Try executing your javascript after this event is completed like below

const { app, BrowserWindow } = require('electron');

let win;

function createWindow() {

    win = new BrowserWindow({ width: 1000, height: 600 })
    win.openDevTools();

    // First URL
    win.loadURL('https://www.google.com')

    // Once dom-ready
    win.webContents.once('dom-ready', () => {

        // THIS WORKS!!!
        win.webContents.executeJavaScript(`
      console.log("This loads no problem!");
    `)

        // Second URL
        win.loadURL('https://github.com/electron/electron');

        // Once did-navigate seems to function fine
        win.webContents.once('did-navigate', () => {

            // THIS WORKS!!! So did-navigate is working!
            console.log("Main view logs this no problem....");
            win.webContents.once('dom-ready', () => {
                // NOT WORKING!!! Why?
                win.webContents.executeJavaScript(`

        console.log("I canot see this nor the affects of the code below...");

        const form = document.querySelectorAll('input.js-site-search-form')[0];

        const input = form.querySelectorAll('input.header-search-input')[0]

        input.value = 'docs';

        form.submit();

      `)

            })
        });
    })
    }

    app.on('ready', createWindow);

    app.on('window-all-closed', () => {
        if (process.platform !== 'darwin') {
            app.quit();
        }
    });

这篇关于Electron webContents executeJavaScript:无法在第二个 loadURL 上执行脚本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！