用node-webkit把web应用打包成桌面应用
node-webkit是一个Chromium和node.js上的结合体,通过它我们可以把建立在chrome浏览器和node.js上的web应用打包成桌面应用,而且还可以跨平台的哦。很显然比起传统的桌面应用,在某些特定领域用html5+css3+js开发的web应用更加简单和高效,而且还可以使用node.js的功能,所以node-webkit还是很有用处的。
下面我通过一个简单的demo来介绍怎么样把一个web应用打包成一个可执行文件(这里只介绍windows环境)
首先新建一个index.html文件,作为我们这个demo的入口页面,我们暂且就把这个页面当成一个完整的web应用吧。内容随便写点什么,比如:
然后创建配置文件 package.json,内容如下:
其中的main属性就是用来指定入口文件的,这个属性的值可以是本地文件,也可以是远程网址,这样就相当于可以把一个远程的web应用直接变为一个桌面应用了。
除了name与main这两个属性外,还有很多其他有用的属性可以配置,比如指定应用的图标,显不显示浏览器的工具栏,指定浏览器的初始大小等等,具体的配置参数文档可看这里https://github.com/rogerwang/node-webkit/wiki/Manifest-format
现在我们有了两个文件了。
然后将index.html和package.json这两个文件压缩到一个zip压缩包里,命名为app.zip
现在app.zip这个压缩包里的内容应该是这样的:
然后把app.zip这个文件的扩展名改为nw,变为 app.nw
然后下载一个windows版本的node-webkit,解压后得到一个文件夹:
之后我们之前得到的app.nw这个文件就可以用nw.exe来执行了,直接把app.nw拖到nw.exe上就可以了。运行结果如下:
跟在chrome中打开index.html这个页面的效果差不多,当然你可以通过配置package.json这个文件,来隐藏浏览器的工具栏或边框,来使它更像是一个桌面软件。
因为nw文件的运行需要node-webkit环境的支持,所以我们还需要把app.nw这个文件跟node-webkit的环境文件一起打包成一个可执行文件。
首先打开windows的cmd,然后输入如下命令:
copy /b nw.exe+app.nw app.exe
注意文件路径要根据你的实际情况进行变动,这里假设app.nw放在了node-webkit的主文件夹里,然后输出的app.exe也会在这个文件夹里。
执行命令后我们得到了 app.exe 这个可执行文件。
到了这步,我们已经得到了app.exe这个文件,但如果只有app.exe这个文件还是不够的,这个可执行文件的运行还需要几个dll文件的支持。
其中 nw.pak 与 icudt.dll 这个两个文件是必须要的。
ffmpegsumo.dll 文件是媒体支持文件,如果你的html页面中用到了<video>或<audio>或其它与媒体相关的东西,则必须带上这个文件。
libEGL.dll 和 libGLESv2.dll 这个两个文件则是使用webGL或GPU必须要的
最后我们得到的就是这样一个文件夹:
执行app.exe就可以运行我们的demo了。
但我们大多数人想的是给用户一个exe文件,用户就可以使用了,不用再附带一些其他文件。
嗯,所以我们还可以把app.exe跟其他的文件再打包一次,把上图中的所有文件变成一个可执行文件,用户只要得到这个文件,就能运行我们的应用了。
做这步我们需要一个软件叫Enigma Virtual Box,首先下载和安装这个软件,然后打开它。
然后在Enter Input File Name那里输入我们的app.exe的路径,在Enter Output File Name那里填写我们要把打包出来的可执行文件输出到哪里。最后是把除app.exe外的其它文件拖入到Files那里,遇到提示的话默认就可以了。
最后点击右下角的Process按钮,就大功告成了。
最后我们得到了一个 app_boxed.exe 的文件,只要把这个文件交给用户,用户就可以运行了。
node-webkit虽然方便,但有个很大的缺点是得到的可执行文件有点大,大家在可以在衡量利弊后决定使不使用。
用node-webkit把web应用打包成桌面应用的更多相关文章
- 2、node-webkit运行web应用,node-webkit把web应用打包成桌面应用
下面我通过一个简单的demo来介绍怎么样把一个web应用打包成一个可执行文件(这里只介绍windows环境) 首先新建一个index.html文件,作为我们这个demo的入口页面,我们暂且就把这个页面 ...
- 将java project打包成jar包,web project 打包成war包的几种演示 此博文包含图片
转: http://blog.csdn.net/christine_ruan/article/details/7491559 http://developer.51cto.com/art/200907 ...
- ant:如何用ant将web project打包成war包
说明:src中的文件将不会呈现出来,诸位可以自己写一个简单的web项目,然后依照我所提供的ant脚本配置来设置. 文件结构如图所示: 配置为下: build.xml < ...
- 将java project打包成jar包,web project 打包成war包的几种演示
将java项目打包成jar 第一种:MyEclipse将java项目打包成jar. 1,右击项目,选择export . 2,点击Java,选择JAR file . 3,在JAR file文本中浏览打包 ...
- 使用node-webkit(v0.35.5)和innosetup(3.6.1)打包将web程序打包为桌面客户端(安装包)
这边主要是有一个客户,需要在电视机上安装一个客户端,含有视频直播功能:刚开始我们采用的webapp打包成apk安装在电视机上,发现摄像头监控画面根本无法播放(apk在手机上可以正常播放视频):排除一些 ...
- Electron把网页打包成桌面应用并进行源码加密
前言 最近想把自己用html+css+js做的网页界面打包成桌面应用,网上一搜,发现Electron是一个不错的选择,试了试,发现效果真的不错.这里记录一下打包过程以作记录,便于自己以后查看学习. 一 ...
- nodejs打包成桌面程序(exe)的进阶之路
nodejs打包成桌面程序(exe)的进阶之路 node js bat 前端 计划任务 前言:最近的研究,请大佬们细品 第一篇 - 任务计划程序篇 说真的研究到将nodejs打包成可执行的exe文件是 ...
- electron将网站打包成桌面应用
需求同 NW.js将网站打包成桌面应用 1. 从github上克隆electron示例项目 git clone https://github.com/electron/electron-quick-s ...
- electron打包成桌面应用程序的详细介绍
1.前提条件 a. 安装了node b.安装了electron c.你知道自己写的东西(js,css,html等等)放在那个文件夹(假设这个文件夹命名为 app,下面会用到)中 2.安装electro ...
随机推荐
- WPF自定义控件与样式(11)-等待/忙/正在加载状态-控件实现
一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要有三种实现方式 ...
- PHP内核(一)内存管理
本文链接:http://www.orlion.ml/tag/php-internal/ 一.内存管理基础 用c语言开发时,开发者要手动进行内存管理.PHP经常作为web服务器的模块,内存管理与预防内存 ...
- poj 1905Expanding Rods
/* 二分 + 几何 弧长L, 圆半径R, 弧度 q, L=R*q; 二分: 弧度(0~PI) 或者 高度(L/2~L) */ #include<cstdio> #include<i ...
- Linux文件标示
平时在使用ls -l时可以看到 [root@myserv /]# ls -l total 28 drwxr-xr-x 3 root root 21 Sep 17 11:29 app lrwxrwxrw ...
- 帮助文档的制作javadoc
将自己写的工具类Tool的Tool.class文件发送给其他人,其他人只要将该文件设置到classpath路径下,就可以使用该工具类. 但是很遗憾,该类中到底定义了多少个方法,对方却不清楚,因为该类并 ...
- ibatis轻松入门
近日,由于公司项目应用开发的逻辑层使用的是iBatis.上网查了些资料,自己写了点demo入门.感觉良好.iBatis实在是比Hibernate很容易入门,贡献出来与各路菜鸟分享(后文附源码),希望得 ...
- SURF算子(1)
SURF算子,参考这篇文章的解释http://www.ipol.im/pub/art/2015/69/ SURF 是 Speeded Up Robust Features 加速鲁棒特征的含义. T ...
- Javascript编程风格
Douglas Crockford是Javascript权威,Json格式就是他的发明. 去年11月他有一个演讲(Youtube),谈到了好的Javascript编程风格是什么.我非常推荐这个演讲,它 ...
- HT for Web 3D游戏设计设计--汉诺塔(Towers of Hanoi)
在这里我们将构造一个基于HT for Web的HTML5+JavaScript来实现汉诺塔游戏. 汉诺塔的游戏规则及递归算法分析请参考http://en.wikipedia.org/wiki/Towe ...
- The conversion of a datetime2 data type to a datetime data type resulted in an out-of-range value. 错误的原因及解决方案
异常描述: 数据访问用EF,在数据库中用getdate()设置的默认值,程序中没有赋值. 出现异常. 此错误在百度上在我写此文之前没有多少解决方案,谷歌之等到以下两个有用的页: http://stac ...