レンダラープロセスからElectron APIメソッドを呼び出すにはどうすればよいですか？

私はしばらくの間http://electron.atom.ioを試してきました。私はhttp://electron.atom.io/docs/tutorial/quick-start/に続き、比較的成功してBootstrapとJqueryを使って "app"を作りました。レンダラープロセスからElectron APIメソッドを呼び出すにはどうすればよいですか？

今はElectron APIメソッドを使用しようとしていますが、成功しません。

私はブラウザウィンドウを作成しました。そのウィンドウ内に新しいJSファイルを追加しました。そのファイルの中で、私はここprintToPDFメソッドを呼び出ししようとしています：http://electron.atom.io/docs/api/web-contents/#contentsprinttopdfoptions-callback

それがうまく動作しないと、コンソールには、以下を記録します。

キャッチされないにReferenceError：メインウィンドウは

定義されていません。コードはこのように書きます：

main.js

const electron = require('electron') 
const app = electron.app 
const BrowserWindow = electron.BrowserWindow 

let mainWindow 

function createWindow() { 
mainWindow = new BrowserWindow({width: 800, height: 600}) 
mainWindow.loadURL(`file://${__dirname}/index.html`) 
mainWindow.webContents.openDevTools() 

mainWindow.on('closed', function() { 
    mainWindow = null 
}) 
} 

app.on('ready', createWindow) 

app.on('window-all-closed', function() { 
if (process.platform !== 'darwin') { 
    app.quit() 
} 
}) 

app.on('activate', function() { 
if (mainWindow === null) { 
    createWindow() 
} 
})

I ndex.html

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Hello World!</title> 
<link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css"> 
</head> 
<body> 
</body> 

<script>window.$ = window.jQuery = require('jquery');</script> 
<script type="text/javascript" src="./js/bootstrap.min.js"></script> 
<script> 
require('./app.js'); 
</script> 
</html>

app.js

$(function() { 
mainWindow.webContents.printToPDF(); 
});

出典

2016-09-28 ricardolobo

あなたのhtml/jsのあなたがmain.js' 'で何かにアクセスすることはできませんを務めました。 'app.js'でイベントを発行する関数を作成し、' main.js'でそのイベントをリッスンし、イベントがトリガされたときに 'mainWindow.webContents.printToPDF（）; 'を呼び出すことができます。 –

は、IPCモジュール、ipcMainとipcRendererを見てみましょう。 ipcモジュールを使用すると、メインプロセスとレンダリングプロセスの間で同期メッセージと非同期メッセージを送受信できます。

ここでは、ELECTRON API DEMOSアプリからのPDFへの印刷例を示します。

レンダラプロセス

const ipc = require('electron').ipcRenderer 

const printPDFBtn = document.getElementById('print-pdf') 

printPDFBtn.addEventListener('click', function (event) { 
    ipc.send('print-to-pdf') 
}) 

ipc.on('wrote-pdf', function (event, path) { 
    const message = `Wrote PDF to: ${path}` 
    document.getElementById('pdf-path').innerHTML = message 
})

メイン処理で

const fs = require('fs') 
const os = require('os') 
const path = require('path') 
const electron = require('electron') 
const BrowserWindow = electron.BrowserWindow 
const ipc = electron.ipcMain 
const shell = electron.shell 

ipc.on('print-to-pdf', function (event) { 
    const pdfPath = path.join(os.tmpdir(), 'print.pdf') 
    const win = BrowserWindow.fromWebContents(event.sender) 
    // Use default printing options 
    win.webContents.printToPDF({}, function (error, data) { 
    if (error) throw error 
    fs.writeFile(pdfPath, data, function (error) { 
     if (error) { 
     throw error 
     } 
     shell.openExternal('file://' + pdfPath) 
     event.sender.send('wrote-pdf', pdfPath) 
    }) 
    }) 
})

出典

2016-09-28 11:58:34 DavidDomain

ありがとうございます。それはまさに私が望んでいたものです。私はまだこの「モジュール」パターンを理解しようとしています。 – ricardolobo

レンダラープロセスからElectron APIメソッドを呼び出すにはどうすればよいですか？

答えて

関連する問題