Wiki: /* 概要 */

2021-01-16T12:43:23Z

概要

← 古い版		2021年1月16日 (土) 21:43時点における版
1行目:		1行目:
	== 概要 ==		== 概要 ==
			RendererプロセスでElectronのモジュールを使用する手順を記載する。<br>
			<br>
	XSS対策のため、nodeIntegrationで無効にすることで、RendererプロセスからNode.jsの機能へのアクセスを制限することができる。<br>		XSS対策のため、nodeIntegrationで無効にすることで、RendererプロセスからNode.jsの機能へのアクセスを制限することができる。<br>
	そのため、Rendererプロセスでrequire関数が呼ぶことができず、以下のようなエラーが出力される。<br>		そのため、Rendererプロセスでrequire関数が呼ぶことができず、以下のようなエラーが出力される。<br>

Wiki: ページの作成:「== 概要 == XSS対策のため、nodeIntegrationで無効にすることで、RendererプロセスからNode.jsの機能へのアクセスを制限することができ…」

2021-01-16T12:42:17Z

ページの作成:「== 概要 == XSS対策のため、nodeIntegrationで無効にすることで、RendererプロセスからNode.jsの機能へのアクセスを制限することができ…」

新規ページ

== 概要 ==
XSS対策のため、nodeIntegrationで無効にすることで、RendererプロセスからNode.jsの機能へのアクセスを制限することができる。 
そのため、Rendererプロセスでrequire関数が呼ぶことができず、以下のようなエラーが出力される。 
Uncaught ReferenceError: require is not defined
 
詳細においては、以下に示すElectronの公式Webサイトを参照すること。 
[https://electronjs.org/docs/tutorial/security#2-do-not-enable-nodejs-integration-for-remote-content Do not enable Node.js Integration for Remote Content] 
 

== 方法 ==
以下に示す通り、対応策は2つある。 
* ノードインテグレーションを有効にする。
* preloadを使用する。
 
==== ノードインテグレーションを有効にする ====
main.jsファイルのBrowserWindowにおいて、webPreferencesのnodeIntegrationオプションをtrueにする。 
<syntaxhighlight lang="javascript">
// main.jsファイル

// ...
mainWindow = new BrowserWindow(
{
width: 1000,
height: 800,
webPreferences: {nodeIntegration: true}, // 追記
});
// ...
</syntaxhighlight>
 
ただし、ElectronでXSS攻撃を受ける場合、PCのデータも操作される危険性もあるため、falseが安全である。 
ローカルで完結するようなElectronソフトウェアの場合、trueにしても良いが、 
DBからユーザが入力したテキストを表示する等、リモートコンテンツを表示する機能がある場合、falseのままが良い。 
 
==== preloadを使用する ====
ノードインテグレーションを有効にしない場合、preloadを使用する。 
 
preloadとは、他のスクリプトが実行される前にロードするスクリプトを指定するオプションであり、 
指定したスクリプト内では、Node.jsのAPIにアクセスできる。 
 
そのため、以下のように、windowオブジェクト等に使用するモジュールをセットできる。 
<syntaxhighlight lang="javascript">
// main.jsファイル

new BrowserWindow(
{
width: 1200,
height: 800,
webPreferences: {nodeIntegration: false, preload: `${__dirname}/<JavaScriptファイル名>.js`} // 読み込むjsファイルのパス
});
</syntaxhighlight>
 
<syntaxhighlight lang="javascript">
// <JavaScriptファイル名>.jsファイル

window.ipcRenderer = require('electron').ipcRenderer;
window.remote = require('electron').remote;
</syntaxhighlight>
 
このように記述した後、Rendererプロセスでwindow.ipcRendererを呼び出す。 
 

__FORCETOC__
[[カテゴリ:Electron]]

設定 - nodeIntegration - 版の履歴

Wiki: /* 概要 */

Wiki: ページの作成:「== 概要 == XSS対策のため、nodeIntegrationで無効にすることで、RendererプロセスからNode.jsの機能へのアクセスを制限することができ…」