2015年10月6日 星期二

Nw.js +Express packing replace file:// with http://




一、當我們利用Nw.js打包出可執行檔時可以發現運行方式都是透過file://這種格式,但是有時候當我們在進行第三方認證時,通常都會因為origin:file://而遭到拒絕,因此若希望運行在http協定之上,可以使用Express來架設http,加上Nw.js本身即支援Node.js,因此使用起來更為便利。


二、我們可以先到專案目錄下安裝Express


cd C:\Users\test\Desktop\nwjs-v0.12.3-win-ia32\rewardRecord
npm init//進行初始化設定,都預設即可,main的部分可以改為server.js
npm install Express//安裝Express

三、接著我們在該目錄下可建立server.js

   (function(){
     var express = require('express');
     var app = express();
     var path    = require("path");
     app.use(express.static(__dirname));//公開目錄
     var server = app.listen(3000);//監聽port 3000
})()

四、實際運行

 node server.js
 瀏覽器: http://localhost:3000/

五、以上驗證過後我們可以做點加工,建立初始頁面 nw-start.html,進行重新導向的動作

<!DOCTYPE html>
<html>
<head>
     <script>
          function bodyOnLoad(){
               require('./server.js');
               window.location.assign('http://localhost:3000/');
          }
     </script>
</head>
<body onload="bodyOnLoad()">
     <h1>
          Loading...
     </h1>    
</body>
</html>

六、接著在打包的package.json指定main為rewardRecord/nw-start.html,運行起來就會將網頁導向http://localhost:30000

{
  "name": "rewardRecord",
  "version": "0.0.1",
  "main": "rewardRecord/nw-start.html",
  "node-remote": "localhost",
  "window": { 
          "toolbar": false,
        "width": 800,
        "height": 500,
        "frame": true
    }
}

七、後續的打包動作可以參考:http://selfdesigning.blogspot.tw/2015/10/nwjswebapp.html

沒有留言:

張貼留言