New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Pass objects from browser to renderer-side at window creation, as argument of "new BrowserWindow()" or ".loadUrl()", to avoid pollution of the global scope #1095

Closed
cronvel opened this Issue Feb 4, 2015 · 9 comments

Comments

Projects
None yet
9 participants
@cronvel

cronvel commented Feb 4, 2015

The remote module is really handy, however I don't like to pollute the global scope of the browser-side just to provide some objects to the renderer's remote module, using remote.getGlobal(name).

It would be nice if we can pass some objects from browser-side to renderer-side, either at the BrowserWindow creation or when using .loadUrl().

Implementation example, browser-side:

var somethingIWantToShare = {
  myFunction: function() {
    // some code
  } ,
  ...
  // some properties and methods here
} ;

mainWindow.loadUrl( 'file://' + __dirname + '/html/main.html' , {
  rendererSideName: somethingIWantToShare ,
  anotherRendererSideName: ... // another object to share
} ) ;

Renderer-side:

remote.rendererSideName.myFunction() ;
remote.anotherRendererSideName.myOtherFunction() ;
@zcbenz

This comment has been minimized.

Contributor

zcbenz commented Feb 4, 2015

You can do it in this way:

browser side:

mainWindow.rendererSideName = somethingIWantToShare;

renderer side:

remote.getCurrentWindow().rendererSideName.myFunction();
@jprichardson

This comment has been minimized.

Member

jprichardson commented May 22, 2015

@cronvel I wrote https://github.com/jprichardson/electron-window for this purpose. It uses the same method as atom. It also keeps track of global window refs so that you don't have to worry about it.

@cronvel

This comment has been minimized.

cronvel commented May 23, 2015

@jprichardson Thanks a lot, I will look into it!

@Programming4life

This comment has been minimized.

Programming4life commented Jan 26, 2016

@zcbenz I tried that in v0.36.4 and it doesent work. I basically need to pass an object between two windows.

@meghadev

This comment has been minimized.

meghadev commented Jan 11, 2017

The approach mentioned here didn't work for me. Any possible reason?

@denu5

This comment has been minimized.

denu5 commented May 11, 2017

@meghadev I think some things changed have since 2015 but I can tell you a solution that works for me in Electron 1.6

In the main process:

e.g. index.ts

// typed to 'any', because we add a custom property later
 let myWindow: any = new BrowserWindow({ 
        height: 500, 
        width: 700,
        frame: false,
        resizable: false
    });
.....

 myWindow.custom = {
        'whatever': 'youwant'
    };

Then on the renderer side it's accessible like this:

e.g. index.html

<script>
var electron = require('electron');
var currentWindow = electron.remote.getCurrentWindow();
 
console.log(currentWindow.custom);

I'm not happy that it breaks the typing of the BrowserWindow and having said that, I'm pretty sure that this isn't best practice.

To use it in JS just remove :any

@IndieRobert

This comment has been minimized.

IndieRobert commented Apr 17, 2018

can we get a 'opened' event to send data please.

@trusktr

This comment has been minimized.

trusktr commented Jun 15, 2018

@denu5 How can we do this reference passing if we're using a <webview> element and not a BrowserWindow? For example, between a BrowserWindow and <webview> that resides inside of it?

@JeevanJain

This comment has been minimized.

JeevanJain commented Jul 27, 2018

+1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment