桌面應用嵌入H5（Node-Webkit或者Electron）

一、Node-Webkit

1、簡介:

可将網頁檔案嵌入到桌面應用程式中，例如暴雪的星際争霸，騰訊的微信、QQ桌面版，酷我音樂等都采用混合桌面應用。

2、使用方法

（1）下載下傳對應作業系統的Node-Webkit包；

（2）編寫網頁檔案及package.json檔案（Demo是桌面應用的Title,Demo.html是第一個展示的界面）；

 package.json基礎内容：

{“name”:”Demo”,

 “main”:”Demo.html”

}

（3）将編寫的檔案一起壓縮；

（4）将壓縮檔案example.zip放到Node-Webkit包的根目錄中，拖拽到nw.exe可執行；

（5）使用cmd進入Node-Webkit包目錄，執行copy /b nw.exe+example.zip example1.exe，可得到依賴Node-Webkit包的example1.exe，點選example1.exe也可以執行；

（6）利用Enigma Virtual Box将Node-Webkit包和example1.exe封裝成一個獨立exe，注意Enigma Virtual Box界面的input中選擇example1.exe後，将Node-Webkit包和example1.exe拖拽至界面中的Virtual Box Files，再執行封包。

三、Node.js（Node-webkit可結合webservice、node.js、php服務端使用）（webservice和node.js的詳細使用看我的其他部落格）

1、簡介

可讀寫檔案、讀寫資料庫，将js的功能擴充至服務端。

2、使用示例

var http= require('http');

http.createServer(function (req, res) {

  res.writeHead(200, {'Content-Type': 'text/plain'});

  res.end('Hello World\n');

}).listen(1337, "127.0.0.1");

console.log('Server running at http://127.0.0.1:1337/');
           

注意：報events.js:183或标準V8錯誤時關閉程序中的node.exe

3、配置node連接配接oracle的環境

（詳見https://www.cnblogs.com/xcxcxcxc/p/6344180.html）

（1）node-v6.9.1-x64.msi安裝；

（2）python-2.7.12.amd64.msi安裝；

（3）oracle instantclient（instantclient-basic-win-x86-64-11.2.0.1.0.zip  和  instantclient-sdk-win-x86-64-11.2.0.1.0.zip）解壓及配置環境變量；

（4）NET_Framework_4.6.exe安裝；

（5）Visual Studio 2015(6).visualcppbuildtools_full.exe安裝；

（6）npm（nodejsPackageManager）配置鏡像及oracledb安裝。

4、示例代碼

var oracledb = require('oracledb');

oracledb.getConnection(

  {

    user          : "hr",

    password      : "welcome",

    connectString : "localhost/XE"

  },

  function(err, connection)

  {

    if (err) {

      console.error(err.message);

      return;

    }

    connection.execute(

      "SELECT department_id, department_name "

    + "FROM departments "

    + "WHERE department_id = :did",

      [180],

      function(err, result)

      {

        if (err) {

          console.error(err.message);

          return;

        }

        console.log(result.rows);

      });

  });
           

二、Electron

VS Code是用Electron開發的。

https://zhuanlan.zhihu.com/p/266535551