electron作为跨平台，基于Chrome内核的开发平台，为B端转C段带了快速有效的应用。如何有效成为跨平台全栈平台,electron称为一个不错的桥梁工具。
electron简介
1.https://electronjs.org/docs 2.https://github.com/electron/electron-api-demos 3.https://www.w3cschool.cn/electronmanual/
需要开发的模块
1.增加按键，https://electronjs.org/docs/api/screen 2.及最大最小化 https://electronjs.org/docs/api/accelerator 2.缓存获取cookies https://electronjs.org/docs/api/cookies 实现记住密码http://blog.csdn.net/changhuzhao/article/details/78773279 session和cookie的使用方法、区别，和分别实现验证登录状态http://blog.csdn.net/kevin_cyj/article/details/51203769 3.js交互 https://electronjs.org/docs/api/web-contents 3.自动登陆 4.消息系统托盘 https://electronjs.org/docs/api/tray
#开发工具准备 1.webstorm 2.node & npm
5.
npm库
- “electron”: “~1.6.2”,
- “electron-packager”: “^8.6.0”,
- “electron-winstaller”: “^2.2.0”,
1.eslint js编码标准 2.yarn 快速安装 3.gulp
使用的例子
1.https://www.jianshu.com/p/57d910008612
环境调试
命令行调试:electron . –debug
webstorm set
1.新增 node.js 作为调试模块 2.设置 Node interpreter : 选择node_module/.bin/electron [windows：electron.cmd] 3.设置 Node parameters : . –debug [. 执行当前目录 –debug 做调试] 4.设置 Working directory : 当前目录 5.设置 Javascript file : main.js
vscode set
1.
目标制定
1.将现有网站进行包装，通过electron远程访问。 （1）屏蔽快捷方式，右键菜单。依照项目需求增加屏蔽快捷方式，右键菜单。 需要屏蔽调试模拟，右键源码。 （2）处理xp的消息弹出。 （3）处理远程调用网页。 （4）flash插件
flash调用（main-process）
1.获取各版本插件对应信息 2.下载各系统安装pdf版本 3. (1)windows Flash Player 插件安装好后，Windows系统可以在以下路径找到相应的dll文件 C:\Windows\System32\Macromed\Flash\pepflashplayer64_23_0_0_207.dl C:\Windows\SysWOW64\Macromed\Flash\pepflashplayer32_23_0_0_207.dll (2)mac Flash Player 插件安装好后，mac系统可以在一下路径找到相应的plugin文件 /Library/Internet Plug-Ins/PepperFlashPlayer/PepperFlashPlayer.plugin (3)linux
const {app, BrowserWindow} = require('electron')
const path = require('path')
// 指定 flash 路径，假定它与 main.js 放在同一目录中。
let pluginName
switch (process.platform) {
case 'win32':
pluginName = 'pepflashplayer.dll'
break
case 'darwin':
pluginName = 'PepperFlashPlayer.plugin'
break
case 'linux':
pluginName = 'libpepflashplayer.so'
break
}
app.commandLine.appendSwitch('ppapi-flash-path', path.join(__dirname, pluginName))
// 可选：指定 flash 的版本，例如 v17.0.0.169
app.commandLine.appendSwitch('ppapi-flash-version', '17.0.0.169')
app.on('ready', () => {
let win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
plugins: true
}
})
win.loadURL(`file://${__dirname}/index.html`)
// 一些别的什么
})
Notification（renderer-process）
var path = require('path');
var options = [
{
title: "Basic Notification",
body: "Short message part",
url: "http://www.baidu.com",
},
{
title: "Content-Image Notification",
body: "Short message plus a custom content image",
icon: path.join(__dirname, 'icon.png')
}
]
function doNotify(evt) {
let myNotification = null
if (evt.srcElement.id == "basic") {
myNotification = new Notification(options[0].title, options[0]);
myNotification.onclick = () => {
console.log('通知被点击basic')
window.location.href=options[0].url;
}
}
else if (evt.srcElement.id == "image") {
myNotification = new Notification(options[1].title, options[1]);
myNotification.onclick = () => {
console.log('通知被点击image')
}
}
}
document.addEventListener('DOMContentLoaded', function() {
document.getElementById("basic").addEventListener("click", doNotify);
document.getElementById("image").addEventListener("click", doNotify);
})