web實現串列埠除錯助手

最近受朋友之託試圖用web前端實現串列埠除錯助手，一開始覺得不太有可行性，以前用過的串列埠除錯助手都是客戶端程式。覺得瀏覽器怎麼會有呼叫電腦上的串列埠的功能呢。後來朋友找了幾個資料給我，說網上有人實現，他看不懂。我看了之後恍然大悟，原來是用node。如此萬能。

node 實現操作串列埠的模組是一個 serialport 的模組，網上一搜有很多好文，此處記錄一下實現過程中遇到的一些問題以及解決方法。

一開始被忽略的問題，我把 node 服務搭在自己的伺服器上，後來返回的串列埠陣列全是一堆令我懵逼的資料。後來想起那是 node 讀取了我的
Linux 伺服器的串列埠，而不是使用者使用的 pc。

由此引出的兩個問題。第一，node 服務必須搭建在使用者使用的 pc 上，因此使用者使用的電腦必須有 node 環境。第二，使用者 pc 一般是 windows 系統， node 的模組很多在 Linux 上很容易安裝成功，在 Windows 上安裝比較困難。

首先解決的是第二個問題：在Windows上安裝serialport失敗
解決方法：npm install --global --production windows-build-tools
參考連結1：https://stackoverflow.com/questions/33142357/unable-to-install-node-js-serialport-npm-package-on-windows
參考連結2：https://github.com/nodejs/node-gyp#installation

It looks like you need windows build tools installed because this likely has a native code component that must be built for windows. This is, sadly, a place where installing/building on Linux is much, much easier because those tools come with the distribution, but those tools have to be installed and properly configured on windows and that is actually kind of a pain to get right. There are free tools that will work on Windows, but finding instructions you can follow and then making it work is often a pain.

安裝好之後就可以安裝 serialport 模組了。

解決第一個問題：使用者電腦的 node 環境
解決方法：electron ——使用 JavaScript, HTML 和 CSS 構建跨平臺的桌面應用（官網連結：https://electronjs.org/）（w3c：https://www.w3cschool.cn/electronmanual/wcx31ql6.html）
使用 electron 搭建的桌面應用可以像平常我們使用的 exe 應用程式一樣直接執行，不需要搭建環境。

1. electron 安裝問題：

npm install -g electron-prebuilt //提示electron-prebuilt已經更名為electron
npm install -g electron //安裝失敗
使用淘寶映象安裝問題解決：cnpm install -g electron
參考連結：http://blog.csdn.net/upc_xbt/article/details/53342129

2. 編寫程式碼，可參考我的碼雲專案（連結：https://gitee.com/qiapi/webChuanKouZhuShou）

3. 執行 electron .的時候遇到的electron對原生模組（serialport）的支援問題：

解決方法：npm install -g electron-rebuild
以後每次重新執行 electron . 的時候再執行一次 ``./node_modules/.bin/electron-rebuild` 對原生模組進行rebuild
參考連結：https://www.w3cschool.cn/electronmanual/eqsc1qko.html

4. electron 應用打包工具

參考連結：http://m.blog.csdn.net/u014563989/article/details/75045052
cnpm install -g electron-packager //安裝打包工具
electron-packager . 可執行檔案的檔名 --win --out 打包成的資料夾名 --arch=x64位還是32位 --version版本號 --overwrite --ignore=node_modules

5. electron-packager 打包後找不到依賴包問題:

因為打包的時候執行的命令帶有 --ignore=node_modules, 即不將 node_modules 裡面的依賴包打包，所以在打包後的新檔案中，進入resource 目錄會發現 node_modules 是一個空資料夾，所以自然找不到依賴包。如果去掉打包時的命令引數--ignore=node_modules,則需要非常長的打包時間。我的解決方法是將原來 node_modules 資料夾中的相關的依賴包檔案複製進打包後的 node_modules 中，雖然是一個比較無腦的方法，每次打包都要拖動相關檔案進去，不過我備份了一個 node_modules 資料夾，下一次打包後就把備份的 node_modules 直接複製進去。

其他收穫：

node 模組 ccap: 用於生成驗證碼圖片，可以在 express 後臺
res.send(圖片)，前端的 img 的 src設定為請求這個介面。
ccap的用法可以參考連結：https://cnodejs.org/topic/50f90d8edf9e9fcc58a5ee0b