mirrors/electron
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

docs: Improve the docs on sharing data

Browse source
This commit is contained in:
Cheng Zhao 2016-02-16 11:52:47 +08:00
parent b8e8e4c930
commit f58bab70c5
2 changed files with 28 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
docs/faq/electron-faq.md
View file

@ -18,40 +18,34 @@ New features of Node.js are usually brought by V8 upgrades, since Electron is
using the V8 shipped by Chrome browser, the shiny new JavaScript feature of a
new Node.js version is usually already in Electron.
## What are the different techniques to share objects between web pages?
## How to share data between web pages?
To share objects between web pages (that is on the renderer side) the simplest
and more natural technique is to use a web standard API already available in all
browsers. A good candidate is the
[Storage API](https://developer.mozilla.org/en-US/docs/Web/API/Storage),
through either the
[`window.localStorage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) property or the
[`window.sessionStorage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage) property.
Note that the Storage API allows only to store strings, so objects must be
serialized as JSON.
Another candidate is
[IndexedDB](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API).
To share data between web pages (the renderer processes) the simplest way is to
use HTML5 APIs which are already available in browsers. Good candidates are
[Storage API][storage], [`localStorage`][local-storage],
[`sessionStorage`][session-storage], and [IndexedDB][indexed-db].
Another technique, but this time specific to Electron, is to store objects in
the main process as a global variable and then to access them from the renderers
through the `remote` module:
Or you can use the IPC system, which are specific to Electron, to store objects
in the main process as a global variable, and then to access them from the
renderers through the `remote` module:
```javascript
// In main.js of browser process
global.sharedObject = {};
// In the main process.
global.sharedObject = {
someProperty: 'default value'
};
```
```javascript
// js in page-1.html
require('remote').getGlobal('sharedObject').someProperty = 'some value';
// In page 1.
require('remote').getGlobal('sharedObject').someProperty = 'new value';
```
```javascript
// js in page-2.html
// In page 2.
console.log(require('remote').getGlobal('sharedObject').someProperty);
```
## My app's window/tray disappeared after a few minutes.
This happens when the variable which is used to store the window/tray gets
@ -154,3 +148,7 @@ is only available in renderer processes.
[memory-management]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management
[variable-scope]: https://msdn.microsoft.com/library/bzt2dkta(v=vs.94).aspx
[electron-module]: https://www.npmjs.com/package/electron
[storage]: https://developer.mozilla.org/en-US/docs/Web/API/Storage
[local-storage]: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
[session-storage]: https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage
[indexed-db]: https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API

18
docs/tutorial/quick-start.md
View file

@ -34,8 +34,8 @@ The main process creates web pages by creating `BrowserWindow` instances. Each
is also terminated.
The main process manages all web pages and their corresponding renderer
processes. Each renderer process is isolated and only cares
about the web page running in it.
processes. Each renderer process is isolated and only cares about the web page
running in it.
In web pages, calling native GUI related APIs is not allowed because managing
native GUI resources in web pages is very dangerous and it is easy to leak
@ -43,13 +43,11 @@ resources. If you want to perform GUI operations in a web page, the renderer
process of the web page must communicate with the main process to request that
the main process perform those operations.
In Electron, we have provided the [ipc](../api/ipc-renderer.md) module for
communication between the main process and renderer process. There is also a
[remote](../api/remote.md) module for RPC style communication.
And finally there are different techniques [to share objects between web
pages](../faq/electron-faq.md#what-are-the-different-techniques-to-share-objects-between-web-pages)
of the same window or of different windows.
In Electron, we have several ways to communicate between the main process and
renderer processes. Like [`ipcRenderer`](../api/ipc-renderer.md) and
[`ipcMain`](../api/ipc-main.md) modules for sending messages, and the
[remote](../api/remote.md) module for RPC style communication. There is also
an FAQ entry on [how to share data between web pages][share-data].
## Write your First Electron App
@ -209,3 +207,5 @@ $ cd electron-quick-start
# Install dependencies and run the app
$ npm install && npm start
```
[share-data]: ../faq/electron-faq.md#how-to-share-data-between-web-pages