I make a browser with ELECTRO and need run webpage with flash. Above my code man.js
How can config this code for run flash player? I put .dll flash player beside the code out the folder
const {app, BrowserWindow, webContents, session, Tray} = require('electron')
let mainWindow, secundaryWindow, tray
function createTray(){
tray = new Tray('trayTemplate#2x.png')
tray.setToolTip('Referente ao browser')
tray.on('click', e =>{
if(e.shiftKey){ //Se usar o botão shift ele fecha o tray
app.quit()
}else{
mainWindow.isVisible() ? mainWindow.hide() : mainWindow.show()
}
})
}
const {ipcMain} = require('electron');
function createWindow () {
createTray()
let ses = session.defaultSession
mainWindow = new BrowserWindow({
width: 1600, height: 800,
minWidth: 800, minHeight: 600,
icon: 'trayTemplate#2x.ico',
webPreferences: {
'plugins': true,
contextIsolation: false,
nodeIntegration: true
}
})
mainWindow.setMenu(null)
app.commandLine.appendSwitch('ppapi-flash-path', 'pepflashplayer.dll')
app.commandLine.appendSwitch('ppapi-flash-version', '29.0 r0')
mainWindow.loadURL('http://www.ardisialabs.com/demo/')
mainWindow.on('closed', () => {
mainWindow = null
})
let wc = mainWindow.webContents
wc.on('new-window', (e, url) => {
console.log('criando nova janela para ${url}')
})
...
You cant except old Electron version.
Related
main.js
//...
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
preload: path.join(__dirname, './preload/preload.js')
}
});
//...
preload.js
const { contextBridge, ipcRenderer } = require('electron');
const qrcode = require('qrcode');
contextBridge.exposeInMainWorld('electronAPI', {
qrc: qrcode
})
the error
Unable to load preload script: F:\project\bluetools\preload\preload.js
Error: module not found: qrcode
Although direct exposure is not a good behavior, but I need to do it; and the example in the official documentation can be exposed directly, although it is not recommended; but why I require any third-party package in preloadjs shows "module not found: xxx"
Just add nodeIntegration: true to webPreferences. Like that.
//...
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true,
preload: path.join(__dirname, './preload/preload.js')
}
});
//...
I refer to here, I have got a solution, but it seems to be more troublesome, but what is this compared to security and normative?
ipc.js
module.exports = {
xxx_req: (argements) => {
const { ipcMain, winb: win } = argements;
ipcMain.on('xxx_req', (event, response) => {
win.webContents.send("xxx", "hello");
});
}
}
main.js
const ipcm = require('./ipc.js');
const createWindow = () => {
const win = new BrowserWindow({...});
ipcm.xxx_req({ ipcMain, winb: win })
}
preload.js
const { contextBridge, ipcRenderer } = require('electron');
contextBridge.exposeInMainWorld('electronAPI', {
xxx_req: (response) => ipcRenderer.send('xxx_req',response),
xxx: (callback) => ipcRenderer.on('xxx',callback),
})
index.js(render process)
window.electronAPI.xxx_req("hello");
window.electronAPI.qrcode((event, detail) => {
console.log(detail)
});
If you still don't understand why I did this, please refer to here.
I am looking to try to redirect users from "home.html" to "dashboard.html". I've searched far and wide, yet I haven't found an answer.
When creating your window with the BrowserWindow module, you would have used the method win.loadFile(filePath[, options]) to load your html file.
Once the logic to change pages is successful, all you need to do is execute the win.loadFile(filePath[, options]) line of code again with the path to your new file.
As win.loadFile(filePath[, options]) returns a promise, let's add a .then() statement as well (though not requried).
main.js (main thread)
const electronApp = require('electron').app;
const electronBrowserWindow = require('electron').BrowserWindow;
const nodePath = require("path");
let window;
function createWindow() {
const window = new electronBrowserWindow({
x: 0,
y: 0,
width: 800,
height: 600,
show: false,
webPreferences: {
nodeIntegration: false,
contextIsolation: true,
preload: nodePath.join(__dirname, 'preload.js')
}
});
window.loadFile('home.html')
.then(() => { window.show(); });
return window;
}
electronApp.on('ready', () => {
window = createWindow();
});
// Run when logic to change to dashboard is successful.
function showDashboard() {
window.loadFile('dashboard.html')
.then(() => { window.show(); })
}
I have googled it and it seems like a recurrent task , but I did not find a good solution , Here is my code .
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello World!</title>
</head>
<body>
<h1 style="color: red">Todos</h1>
<button type="button">Todos panel</button>
<script>
const btn = document.querySelector('button');
button.addEventListener('click', () => {
newtaskwindow();
});
function newtaskwindow() {
const remote = require('electron').remote;
const BrowserWindow = remote.BrowserWindow;
const win = new BrowserWindow({
height: 600,
width: 800
});
win.loadFile('todos.html');
}
</script>
</body>
</html>
This does not work .. I want to click the button to open a new child window.
const { app, BrowserWindow, Menu } = require('electron');
function createWindow() {
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true
}
});
win.loadFile('index.html');
}
const todoWin = () => {
const win = new BrowserWindow({
width: 500,
height: 400,
modal: true,
parent: ''
});
win.loadFile('todos.html');
};
// Menu
const isMac = process.platform === 'darwin';
const template = [
...(isMac
? [
{
label: 'Demo',
submenu: [{ role: 'about' }]
}
]
: []),
{
label: 'File',
submenu: [isMac ? { role: 'close' } : { role: 'quit' }]
}
];
const menu = Menu.buildFromTemplate(template);
Menu.setApplicationMenu(menu);
app.whenReady().then(() => {
createWindow();
});
app.on('window-all-closed', function () {
if (process.platform !== 'darwin') app.quit();
});
I see two things...
In main.js add enableRemoteModule and contextIsolation
function createWindow() {
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true,
enableRemoteModule: true,
contextIsolation:false
}
});
win.loadFile('index.html');
}
in index.html you use button.addEventListener instead of btn.addEventListener. Change it.
<script>
const btn = document.querySelector('button');
btn.addEventListener('click', () => {
newtaskwindow();
});
function newtaskwindow() {
const remote = require('electron').remote;
const BrowserWindow = remote.BrowserWindow;
const win = new BrowserWindow({
height: 600,
width: 800
});
win.loadFile('todos.html');
}
</script>
That way should work.
WARNING
As stated in Electron's documentation remote module is deprecated. You are encouraged to use IPC in order to execute code on main on request of renderer.
document.querySelector('form').addEventListener('submit', (e) => {
e.preventDefault();
const { ipcRenderer } = require('electron');
const value = document.querySelector('input').value;
ipcRenderer.send('todo:save', value);
window.close();
});
I did it through ipcRenderer
I use BrowserView as window devtoolswebcontents. It’s work fine. but there no context menu popup if i right click at like <div></div>dom element in elements tab. Can i get context menu like chrome devtools ?
test code:
const {
app,
BrowserWindow,
BrowserView
} = require('electron')
function createWindow() {
const win = new BrowserWindow({
width: 800,
height: 600
})
win.loadFile('index.html')
/**
* commend out this code , It will popup context menu
* else devtools dont popup context menu
* ========== start **/
const serviceViewDevTools = new BrowserView();
win.setBrowserView(serviceViewDevTools);
serviceViewDevTools.setBounds({
x: 400,
y: 30,
width: 400,
height: 600
});
serviceViewDevTools.setAutoResize({
width: true,
height: true
});
// =============== end
win.on("ready-to-show", () => {
const contents = win.webContents
// and commend out this line , It will popup context menu
contents.setDevToolsWebContents(serviceViewDevTools.webContents);
contents.openDevTools({
mode: 'detach'
})
})
}
app.whenReady().then(() => {
createWindow()
app.on('activate', function () {
if (BrowserWindow.getAllWindows().length === 0) createWindow()
})
})
app.on('window-all-closed', function () {
if (process.platform !== 'darwin') app.quit()
})
I'm currently trying to implement a new Window on my Electron App.
So I want to include a button, and when you click on this Button, a new Window should be opened.
I didn't find anything in the Electron documentation, maybe one of you can help me.
Perhaps something like this:
const button = document.getElementById('<your_button_id>');
button.addEventListener('click', () => {
createBrowserWindow();
});
function createBrowserWindow() {
const remote = require('electron').remote;
const BrowserWindow = remote.BrowserWindow;
const win = new BrowserWindow({
height: 600,
width: 800
});
win.loadURL('<url>');
}
I believe the answer that has been taken as correct is outdated.
I have managed to do it with the ipc module and with the solution given by Nishkal.
Please, read the ipc module, I'm new to electron and not very experienced with programming. I'm sure you can come with better solutions.
Code I added in order for it to work:
my main.js
const {app, BrowserWindow} = require('electron');
const path = require('path');
//ipc
const { ipcMain } = require('electron')
ipcMain.on('asynchronous-message', (event, arg) => {
createWindow();
})
const createWindow = () => {
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
preload: path.join(__dirname, 'preload.js'),
},
});
win.loadFile('index.html');
}
app.whenReady().then(() => {
createWindow();
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) createWindow();
})
})
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') app.quit();
})
my preload.js
window.addEventListener('DOMContentLoaded', () => {
const { ipcRenderer } = require('electron')
ipcRenderer.on('asynchronous-reply', (event, arg) => {
console.log(arg) // prints "pong"
})
//button and its event listener
const b1 = document.getElementById('b1');
b1.addEventListener('click', () => {
ipcRenderer.send('asynchronous-message', 'ping')
})
})
To open a window from the renderer:
window.open("https://github.com", "_blank", "top=500,left=200,frame=false,nodeIntegration=no");
https://www.electronjs.org/docs/latest/api/window-open