這是一則我工作上遇到的故事。
像我這種接案維生的工程師來說,面對各種不同體制與各種不同同事的生活不說是常規操作吧,只能說是家常便飯
而這次我進到的團隊是屬於後端API製作與前端的製作是分成兩個公司的團隊體制
在我經驗看來呢...這樣的體制不說是驚喜連連吧。更多的是無限踩雷(笑
由於後端公司往往缺乏對於前端的了解,而有時前端公司也會缺乏對於後端的認識。因此在會議結束後私底下雙方問候爹娘的事情那簡直是針對口腔肌肉的日常鍛煉
但畢竟大家都是文明人,用物理的方式表達意見的情況還是不會出現的啦XD
咳咳,扯遠了
總之我這次的工作吧,只能說後端公司果然不出意外的出意外了

沒錯,我他媽的人生第一次看到一個案子到一階段發布的前兩個月才定稿式樣書
然後倒數一個月才生出第一個API

...想當然爾,這個案子的時程也不出意外地延期了
好啦其實上半部都是在講廢話,跟今天要做的事情不能說毫無關聯吧...好歹也是聊勝於無
於是我們前端組在看到仕樣書之後,雖然沒有後端的支援但是我們還是得想辦法針對實際情況去做串接API的工作
再加上本次的案子是跟銀行系統相關,因此在串接API時不能使用http(無憑證),只能使用https(有憑證)來進行作業
也因此就誕生了今天的這篇文章。
因此你今天會在這篇文章學到的是:
1. 如何用Nodejs開設一個簡單的Server
2. 如何使他去讀取測試用的Json檔案
3. 如何製作SSL憑證
4. 如何套用憑證
OK,目標應該交代得很清楚了。那就開始吧!
1. 如何用Nodejs開設一個簡單的Server
針對如何安裝Nodejs的教程我就不提了,網路上一大堆
我個人的作業環境是Mac,然後Nodejs版本是

知曉這些即可
而啟動一個Server最基本的操作,首先先創建啟動Server的程式
const express = require("express")
const https = require('http');
var app = express();
app.get('/',function(req,res){
res.send('Hello World');
});
var server = https.createServer(app)
server.listen(8888,()=>{
console.log('http://127.0.0.1:8888');
});
這時候如果在terminal執行啟動指令node server.js 的話,就會報告這個錯誤

簡單來說就是沒有nodejs的相關套件啦XD
所以依樣在terminal執行
sudo npm install express
指令,看到資料夾多了套件包後就表示安裝完成囉

這時候再執行
node server.js
指令,即可成功開啟Server

2. 如何使他去讀取測試用的Json檔案
接著為了要能測試Android的API傳輸,我們在以上的基礎上再加上讀取JSON檔案的程式
在這邊我做了一個JSON檔案並寫了一個簡單的JSON格式範例

然後在剛才的server.js檔案加入以下程式
const express = require("express")
const https = require('http');
const fs = require('fs');
var app = express();
app.get('/',function(req,res){
res.send('Hello World');
});
app.get('/hello',function(req,res){
res.setHeader("Content-Type", "application/json");
fs.readFile("hello.json",function(err,data){
obj = JSON.parse(data);
res.send(JSON.stringify(obj));
})
})
var server = https.createServer(app)
server.listen(8888,()=>{
console.log('http://127.0.0.1:8888');
});
ㄧ樣執行
node server.js
然後就可以在http://127.0.0.1:8888/hello就可以看到畫面顯示出該檔案的內容囉!

btw,如果檔案內容不合JSON格式會報錯喔
3. 如何製作SSL憑證
好的,到這邊就是比較麻煩的部分了
關於如何製作SSL憑證的方式我上網找了好久,大多人寫的無非就是手動建立一個
然後說到手動建立就是要建立A檔案,然後輸入什麼...在建立B檔案然後輸入....等等等
不過後來我參考了這篇文章
如何在 windows 上建立 SSL 憑證
後,他提供了一個省事又完美的解決方式,我就直接截下來供大家參考
其實道理也很簡單啦,就是創立一個js檔來自動生成就是了(大笑
如下

const selfsigned = require('selfsigned');
const domain_names = 'localhost,noah.com.tw';
const attrs = [{name: 'commonName', value: domain_names}];
const pems = selfsigned.generate(attrs, {days: 365});
console.log(pems);
const fs = require('fs');
fs.writeFileSync('./key.pem', pems.private, 'utf8');
fs.writeFileSync('./cert.pem', pems.cert, 'utf8');
fs.writeFileSync('./.fingerprint', pems.fingerprint, 'utf8');
fs.writeFileSync('./.public.pub', pems.public, 'utf8');
然後因為有引入selfsigned包,因此使用用Termial執行
npm i -s selfsigned
指令,安裝好包之後執行
就可以看到資料夾多了這兩個檔案

而這兩個檔案就是憑證囉!
4. 如何套用憑證
最後是套用的部分
套用的方式不難,但需要注意一些小細節,如下
const express = require("express")
const https = require('https');
const fs = require('fs');
var app = express();
const options = {
cert: fs.readFileSync('cert.pem'),
key: fs.readFileSync('key.pem')
}
app.get('/',function(req,res){
res.send('Hello World');
});
app.get('/hello',function(req,res){
res.setHeader("Content-Type", "application/json");
fs.readFile("hello.json",function(err,data){
obj = JSON.parse(data);
res.send(JSON.stringify(obj));
})
})
var server = https.createServer(options,app)
server.listen(8888,()=>{
console.log('https://127.0.0.1:8888');
});
至此,這時候的網址已經變更為https才會有效了,依照google瀏覽器的安全方針畫面如下

雖然是顯示「不安全」的紅字
不過無所謂,反正目標只是讓前端可以做有憑證時的開發而已,沒問題的XD
OK寫到這邊相信應該是有解決憑證問題了
雖然可能寫得很粗淺,不過因為我本身是寫前端的,這些東西我本來就是求一個堪用就好,並非真的拿給後端做使用
總之希望文章是有幫助到你的喔!
最後..
