Electron为网页注入js预加载

准备工作

首先我下载了一个 electron-quick-start 并安装 node.js
找到一个网页，我选择的是一个快速制作插画的网站 Picrew

main.js

1. 在main.js里可以修改弹窗的各种属性，我们需要的是

function createWindow () {
   
const mainWindow = new BrowserWindow({
   
    webPreferences: {
   
      preload: path.join(__dirname, 'preload.js'),
    }
  })

webPreferences里的preload属性，path引入的__dirname就是根目录，preload.js就是文件名，改别的名字这里也得对应着改。

2. 下面就加载我需要的网页

mainWindow.loadURL('https://picrew.me/image_maker/37328')
}

preload.js

1. 加入自己想要的功能，我这里添了几个按钮

window.onload = function () {
   
  let image_maker = document.querySelector('#image-maker');
  let clearcanvas = document.createElement("div");
  clearcanvas.innerText = "清空画板";
  clearcanvas.style = "box-sizing:border-box;line-height:40px;position:absolute;top:60px;left:10px;width:100px;height:40px;border-radius:20px;background-color:#abf;text-align:center;cursor: pointer;font-weight: 700;-webkit-user-select: none;";
  image_maker.appendChild(clearcanvas);
  // .....