如果将一个网站直接打包成一个桌面应用,有很多应用解决方案。比如:electron nwjs(node-webkit) 包括c# delphi等嵌入一个web插件。
但是我们知道要是考虑到h5和css3的支持,还是需要些友好的浏览器内核。而 electron和nwjs都是基于chormium的。
比如我们要将一个SAAS系统打包成一个桌面端软件。系统入口:http://bech.cc/saas/pms
这里介绍nwjs的解决方案。虽然很多人都说electron好, 但是我看到目前国内CocosCreator 、微信开发者工具都是用的nwjs,还有其它很多的软件用它做代理,比如一些数字货币交易所的桌面端软件(win\mac\linux)。
1. 下载nwjs
2. 新建项目文件夹 saas ,在根目录下创建 package.json{
"name": "saastest",
"version": "0.1.0",
"description": "BechTech",
"main": "http://bech.cc/saas/pms/",
"window": {
"width": 1280,
"height": 800,
"position" : "center",
"icon": "./icon.png"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dist": "build --tasks win-x64 --mirror https://npm.taobao.org/mirrors/nwjs/ .",
"start": "run --x64 --mirror https://npm.taobao.org/mirrors/nwjs/ ."
},
"build": {
"nwVersion": "0.46.3",
"win":{
"productName": "BechTech",
"copyright": "Copyright © 2009-2020 BechTech",
"icon": "./favicon.ico"
}
},
"dependencies": {},
"devDependencies": {
"nwjs-builder-phoenix": "^1.15.0"
}
}
3. 将nw.exe的目录放到环境PATH下。切换到目录下
nw saas //启动查看本地窗口
这里启动后就相当于封装完了软件
4. 打包与发布
这里用官方推荐的 nwjs-builder-phoenix (推荐) 具体方法去git上查看
打包执行命令 npm run dist
后续会生成 dist\saas-0.1.0-win-x64 文件夹
这里要多重复实验才能成功,如果你英文阅读文档功底可以一次就够了。
我们再看另外一种情况,如果你的系统必须局域网内或者vpc访问
其实,这种情况我们经常会碰到,比如为了数据安全 或者考虑到无网环境运行。总之,你需要一个本地服务器。
我们一般的解决方案是配置一个本地的php开发环境。如果集成的会更快如 appserv xmpp phpstudy等等。
但是我们更希望要一个完全的可发布的一体化解决交付方式。
这里我们可以利用php5.5的命令快速实现一个解决方案。然后再用nwjs打包。每一个项目都是一个完美的桌面端软件且运行在本地的localhost.
下载php5.5 win-x86
1. 复制 php.exe php.ini-production ext\ extras\
2. 新建一个www文件夹。这里放的是网站程序 路由入口 index.php( 支持大部分框架 如 TP3)
3. 回到 nwjs 项目根目录下 写一个批处理程序 runserv.bat
@echo off
path = %path%;.\php\;
php.exe -S localhost:8080 -t php\www
4. 写一个main.js 用nodejs 的child_process模块执行批处理脚本
5. package.json 的main 加载 localhost:8080
6. 用nwjs打包
这样一个基于php本地架构的服务方案就完成了。