Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

preload.js with a webview within renderer process

See original GitHub issue

Hi,

I’m attempting to run a variable number of <webview /> tags within the renderer process (eg. BrowserWindow). Basically attempting to use IPCRenderer to pass commands to webview pages and receive the asynchronous result.

To set the communication up between the renderer to the <webview />, you need to add a preload attribute like so.

In App.vue: <webview src="xxxxxxxx" preload="file://./enableIPC.js" nodeintegration />.

I’ve done this with Electron as standard, however when using Vue CLI Plugin Electron Builder, I can’t get it to see and load up the enableIPC.js file.

I’ve placed the file in the public/ folder.

I’ve tried with and without file://, attempting to include in it within the electronBuilder preload key, with no luck. Had anybody tried this successfully and can point me to a repo?

Thanks in advance.

Note: I’m using electron version 10.1.1

Issue Analytics

State:
Created 3 years ago
Reactions:1
Comments:6 (3 by maintainers)

Top GitHub Comments

1reaction

tukutelacommented, Sep 6, 2020

Didn’t think of that! Gave it a go and got…

0reactions

nklaymancommented, Sep 8, 2020

Glad that you figured it out!

Top Results From Across the Web

ElectronJS: How to communicate between Main Process ...

To communicate between Renderer and injected Webview, in the Webview site, use sendToHost() to send a message on channel listened by webview.

Electron: Sending Message from a webview to the host on ...

Code that worked in preload // preload.js ipcRenderer.sendToHost('ipc-message', 'test message'); // renderer.js tab.webview.

Kick start your Electron development with BrowserView - ITNEXT

In preload.js , you can access window or document object before renderer process runs. To define a special property to window object ...

Anatomy of an Electron 4 application - TypeScript TV

Overview of main concepts in Electron 4 applications. ... Webview Preload Script ... Each web page in Electron runs in a separate renderer...

Using Preload Scripts - Electron

Add a new preload.js script that exposes selected properties of Electron's process.versions object to the renderer process in a versions global variable.