Category: 工作雜記隨筆

第 11 屆 iT 邦幫忙鐵人賽參賽系列文章，IT邦文章連結如下：
自我挑戰組 – 工作雜記隨筆

Posted on by

使用Charles抓取手機網路使用

使用Charles抓取手機網路使用資訊

  1. 將電腦和手機連上同一個WIFI網路
  2. 輸入ifconfig（MAC電腦）取得電腦的內網IP，如下圖可得知內網IP為192.168.1.104
  3. 設置Charles上的Proxy settings

  4. 設置手機上的WIFI的PROXY
  5. 此時即可在電腦上看到手機的網路使用狀況
Posted on by

好用的API測試工具 – POSTMAN

軟體介紹


官方下載點 : https://www.getpostman.com/
Chrome 擴充功能版 : 下載連結

Postman 是一個可以模擬 HTTP Request 的工具，其中包含常見的 HTTP 的請求方式，例如： GET 、POST、PUT、DELETE，而它的主要功能就是能夠快速的測試你的 API 是否能夠正常的請求資料，並得到正確的請求結果。

使用帳號

使用帳號去同步設定，可以選擇新創一個帳號或者使用google帳號去同步在不同電腦裡的POSTMAN設定

這樣在不同電腦裡面，使用紀錄或者儲存的Collection等都可以被同步。

發送Request教學

在登入帳號後，按下左上方的＋New按鈕，會可以看到一個創建Request的畫面

有些API的網址會有變數，這時可以使用https://api.library.com/:entity/並且藉由下面這樣的設定來取代變數entity

在發送Request時，正確的header資訊非常重要，可在下面這個頁籤做設定

也可以選擇發送的模式是要使用POST或GET

更多詳細的教學請見：官方教學

Pre-request scripts

如果我們希望每一次打出的某個變數能夠不一樣，這時可以撰寫pre-request scripts來達到這個目的，如下圖：

這時可以在傳送的參數裡用{{timestampHeader}}來存取timestampHeader這個變數

把儲存的測試API資料變成文件

在POSTMAN測試的資料可以轉換成精美的HTML API文件

更多資料請見官網

使用Postman API去自動化呼叫API測試

在下面的畫面裡按下『Get API Key』的按鈕可以取得呼叫API測試的密鑰

參考資料

Posted on by

使用VSCode繪製UML文件

PlantUML介紹

PlantUML是一個VSCode的插件，可以透過直觀的文字描述產生對應 UML 的模型生成工具，官方網站已經提供了詳細的範例以及說明，相關語法其實不用一開始就先死背，需要時至網站查詢即可，上手難度不大，目前提供下列 UML 模型：

  • 循序圖
  • 用例圖
  • 類圖
  • 活動圖
  • 組件圖
  • 狀態圖
  • 對像圖
  • 部署圖
  • 定時圖

安裝方式,.

  1. 按下插件ICON
  2. 在搜尋名稱打入： PlantUML
  3. 按下install

參考資料

  1. 用筆記也可以管理專案(二)：Markdown Preview Enhanced
  2. [TIL] 在 vscode 上面安裝並且使用 PlantUML
  3. PlantUML in a nutshell

Posted on by

好用的Markdown線上共筆工具 – HackMD

HackMD介紹

HackMD網站位置：https://hackmd.io/recent

HackMD 是個跨平台的 Markdown 即時協作筆記，可以在電腦、平板甚至是手機與其他人做筆記！
同時也可以透過 Facebook、Twitter、GitHub、Dropbox 登入。
和StackEdit相比，HackMD增加了上傳圖片的功能，將圖片上傳至imgur，我們可以不用煩惱MD文章的圖片要如何處理，並且它非常適合用來做為大型研討會的線上共筆，Agile Summit及JSDC等大型研討會都是使用這個網站來做為線上共筆平台。

功能介紹

官方功能介紹：功能介紹
線上協作時可以設定不同使用者有不同的讀寫權限：

也支援讓所編輯出的文件以投影片的方式做展示：
slide-example
按下右上角的分享裡的簡報模式，便可以以投影片方式展示

語法介紹

這邊有HackMD支援的語法介紹，按下編輯可以看到成果與語法的比較圖
HackMD支援的語法介紹
同樣支援MathJax數學符號功能，UML 圖表，還支援五線譜語法，功能非常強大

更多關於 循序圖 語法 在這裡.
更多關於 流程圖 語法 在這裡.
更多關於 graphviz 語法 在這裡
更多關於 mermaid 語法 在這裡
更多關於 abc 語法 在這裡

Posted on by

好用的Markdown線上編輯工具- StackEdit

StackEdit

網址：https://stackedit.io/

StackEdit是一個可以在線上編輯跟預覽 Markdown 文件的工具。除了基本的 Markdown 與
GitHub Flavored Markdown 格式外，還額外支援 LaTeX 數學表達符號與 UML 圖表支援。登入Google 帳號還能自動跟雲端硬碟同步文件，是一套相當不錯的線上筆記工具！

Markdown 語法

一打開StackEdit，會有一個預設的歡迎頁
歡迎頁裡面使用的所有較常被使用到的Markdown語法展示

標準常用的格式如下：

  1. 斜體：在兩邊加上 *星號* 或是 _底線_
  2. 粗體：在兩邊加上 **兩個星號** 或是 __兩個底線__，也可以用 **星號 與 _底線_**
  3. 刪除線：在兩邊加上 ~~兩個波浪~~
  4. 引言(註解)： > 引言內容
  5. 標題：# H1；## H2；### H3；#### H4；##### H5；###### H6
  6. 超連結：[連結標題](http://網址)
  7. 圖片：![圖片說明](http://圖片網址)

歡迎頁會有打字區與最後效果的對比呈現

中間那條可以選擇變更現在的編輯版面顯示樣式

其他特殊語法

  1. 數學表達式:請參考KaTeX 
$\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$

會有這樣的呈現

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

會變這樣

2. UML diagrams
要畫UML流程圖時，可以直接用文字來畫出圖片，相關語法請參考：Mermaid

```mermaid
sequenceDiagram
Alice ->> Bob: Hello Bob, how are you?
Bob-->>John: How about you John?
Bob--x Alice: I am good thanks!
Bob-x John: I am good thanks!
Note right of John: Bob thinks a long
long time, so long
that the text does
not fit on a row.

Bob-->Alice: Checking with John...
Alice->John: Yes... John, how are you?
```

會顯示右邊的圖

同步編輯的檔案或匯出成PDF/HTML

按下右上角的Icon，右側會跳出一個選單

我們可以在這邊將檔案同步至Google雲端或者匯出成HTML/PDF檔案

點選左上角的資料夾，則可以開啟許多不同的文件

Posted on by

ELK介紹

架構簡介

ELK是三個開源項目的首字母縮寫，這三個項目分別是：Elasticsearch、Logstash和Kibana。

  1. Elasticsearch是一個搜索和分析引擎。
  2. Logstash是服務器端數據處理管道，能夠同時從多個來源採集數據，轉換數據，然後將數據發送到諸如Elasticsearch等存儲庫中。
  3. Kibana則可以讓用戶在Elasticsearch中使用圖形和圖表對數據進行可視化。

enter image description here

ELK安裝

請參考此篇文章，非常的詳細
ELK 教學 – 從無到有安裝 ELK (CentOS/Red Hat)

大致簡述一下:

  1. 安裝VirtualBox
  2. 安裝Java
  3. 安裝Elasticsearch
  4. 安裝Beats

Config設定

請參考下面這些文章

  1. Config Of Logstash
  2. Config Of ElasticSearch
  3. Config Of Kibana
  4. Plugin Install Of All Module

Logstash的filter設定

使用grok教學

  1. https://www.elastic.co/guide/en/logstash/7.3/plugins-filters-grok.html
  2. https://medium.com/@hungtaohsieh/3%E7%A8%AE%E5%B8%B8%E7%94%A8logstash-filter-493e94a391b7

使用mutate教學
https://blog.csdn.net/cromma/article/details/52919742

grok測試工具
http://grokdebug.herokuapp.com/

Posted on by

Linux 檢查硬碟使用量

檢查硬碟使用量 – df

輸入df指令
df

後面的mounted on指的是這個空間是掛載在那一個分割區

查詢某個分割區的硬碟使用狀況

df /dev
上面是查詢dev這個分割區的使用狀況

改變顯示的空間單位

預設的 df 輸出會以 KB 為單位顯示磁碟用量，但是現在的硬碟容量都很大，這樣的輸出較不好閱讀。
這時可以加上-h，來用適合閱讀的方式顯示資訊

僅顯示本機磁碟

使用
df -l

Posted on by

nginx 基礎設定教學

安裝 nginx

使用以下指令安裝nginx

brew install nginx


完成之後就可使用 nginx

# 啟動 nginx
nginx
# 加上 -s option 來下指令
# 停止 nginx
nginx -s stop
# 重新讀取設定檔
nginx -s reload

若要設定為可以開機自動啟動，則把 nginx 啟動的 bash 檔放到 /etc/init.d/

設定nginx的設定檔

nginx 的設定檔名為 ngix.conf，設定檔所在的路徑可以透過 nginx -t來獲得

nginx的主要功能

  • 反向代理，實現簡單的負載均衡： 如果有多台服務器或者一台服務器多個端口，可以考慮用nginx。
  • 靜態資源緩存：把一些靜態資源（如靜態頁面，js等資源文件）放到nginx裡，可以極大的提高服務的性能。

反向代理

伺服器根據用戶端的請求，從其關聯的一組或多組後端伺服器（如Web伺服器）上取得資源，然後再將這些資源返回給用戶端，用戶端只會得知反向代理的IP位址，而不知道在代理伺服器後面的伺服器叢集的存在。

Posted on by

使用pm2管理伺服器

pm2的操作

1. 安裝PM2
npm install pm2 -g
2. 啟動服務
pm2 start app.js
3. 啟動N個名為SERVICE_NAME的服務的進程
pm2 start app.js -i N --name SERVICE_NAME
4. 重啟服務
npm restart SERVICE_NAME
5. 設定記憶體使用超過多少後自動重啟伺服器
pm2 start app.js --max_memory_restart 1024M
6. 監控服務
pm2 monit

查看服務進程數

1. 查看物理CPU个数
cat /proc/cpuinfo| grep "physical id" | sort| uniq | wc -l

2. 查看每個物理CPU中的核數
cat /proc/cpuinfo| grep "cpu cores"| uniq

3. 查看邏輯CPU的個數
cat /proc/cpuinfo| grep "processor"| wc -l

確認是否使用nginx

nginx的主要功能如下

  • 反向代理，實現簡單的負載均衡： 如果有多台服務器或者一台服務器多個端口，可以考慮用nginx。
  • 靜態資源緩存：把一些靜態資源（如靜態頁面，js等資源文件）放到nginx裡，可以極大的提高服務的性能。

日誌問題

日誌系統對於任意應用而言，通常都是必不可少的一個輔助功能。pm2的相關文件默認存放於$HOME/.pm2/目錄下，其日誌主要有兩類：

  • pm2自身的日誌，存放於$HOME/.pm2/pm2.log；
  • pm2所管理的應用的日誌，存放於$HOME/.pm2/logs/目錄下，標準誰出日誌存放於${APP_NAME}_out.log，標準錯誤日誌存放於${APP_NAME}_error.log；

pm2支持配置文件啟動

pm2 ecosystem：生成配置文件ecosystem.json
pm2 startOrRestart /file/path/ecosystem.json :通過配置文件啟動服務

如下是開發時ecosystem.json的內容：

{ 
    apps : [
        { 
            name : "nova", 
            max_memory_restart: "300M", 
            script : "/root/nova/app.js", 
            out_file : "/logs/nova_out.log", 
            error_file : "/logs/nova_error.log", 
            instances : 4, 
            exec_mode : "cluster", 
            env: {
                NODE_ENV: "production"
            }
        }
    ]
}


採用cluster模式啟動了4個服務進程；如果服務佔用的內存超過300M，會自動進行重啟。


更多相關知識請見官網：ecosystem-file

支援自動化部署

一個簡單的process.json範例

{
   "apps" : [{
      "name" : "HTTP-API",
      "script" : "http.js"
   }],
   "deploy" : {
     // "production" is the environment name
     "production" : {
       "user" : "ubuntu",
       "host" : ["192.168.0.13"],
       "ref"  : "origin/master",
       "repo" : "git@github.com:Username/repository.git",
       "path" : "/var/www/my-repository",
       "post-deploy" : "npm install; grunt dist"
      },
   }
}


/bin/bash:

# Setup deployment at remote location
$ pm2 deploy production setup

# Update remote version
$ pm2 deploy production update

# Revert to -1 deployment
$ pm2 deploy production revert 1

# execute command on remote machines
$ pm2 deploy production exec "pm2 reload all"


更多介紹請見官網：simple-deploy

Posted on by

查看某個Linux裡服務的狀態

程序管理指令ps

ps指令可以將某個時間點的程序運作情況擷取下來

僅觀察自己的 bash 相關程序： ps -l

觀察系統所有程序： ps aux

若覺得這個列表太長，可以使用grep來獲取想要知道的服務，例如
[root@study ~]# ps aux | egrep '(cron|rsyslog)'

使用service命令

下面指令可以查詢單個服務的運行狀態
[root@localhost ~]# service sshd status

使用服務管理工具

請參考這篇文章：linux管理Service的指令

參考資料