以ESP32-CAM設計一網路IP監視器

1. Arduino整合開發軟體(IDE)下載與安裝

2. ESP32-CAM開發環境設定

3. ESP32-CAM模組板硬體連接

4. 程式設計與分析

5. 實機測試

ESP32-CAM是ESP32的衍生性應用模組，等於是把一塊ESP32模組再加上一顆WebCam鏡頭，由於價格便宜，很適合用在一些只需要中低階畫面的無線監控系統上，在本文中將以大家最熟悉的Arduino IDE開發軟體來設計一網路IP監視器。

如下面的【圖一、系統架構】所示，本系統最大的特色，就是可以在本地區域的無線WiFi分享器範圍內使用(路徑1)，也可以在遠端透過網際網路(internet)連線使用(路徑2)，而且不需要透過任何中介的伺服器，只要直接打開手機或電腦的瀏覽器，並輸入對應的IP位址就可以看到ESP32-CAM的畫面了！除此之外，WiFi分享器所連接的網際網路本身也不一定要有固定IP位址，只要可以連上網際網路就可以了。不過唯一的要求，就是所使用的WiFi分享器(Router)必須具有所謂埠轉發(Port Forwarding)，或是虛擬伺服器(Virtual Server)的功能，這一點會在後面實機測試部分再詳細說明。

圖一、統架構圖

一、Arduino整合開發軟體(IDE)下載與安裝

俗語說”工欲善其事，必先利其器”，如果徒有性能強大的硬體裝置，卻缺少良好的軟體配合也是惘然，本製作是以目前最普遍被使用的Arduino IDE做為發工具，以目前筆者撰寫此文時Arduino IDE的版本已到1.8.13版，如果還沒安裝的讀者請先到下面的筆者的部落格連接網址去閱覽一下，文中有詳細的介紹如何下載與安裝Arduino IDE這個開發軟體，及如何設定使用ESP32系列模組。

“ESP32/Arduino整合開發軟體(IDE)安裝與設定”

二、ESP32-CAM開發環境設定

在完成上述的Arduino IDE開發軟體下載與安裝動作之後，接下來就是選擇要使用的ESP32-CAM模組板。在Arduino IDE中標準的開發過程是要先選擇所使用的開發板，在啟動Arduino IDE開發軟體之後，如下面的【圖二•1】所示，先用滑鼠左鍵點擊上方主能表標記１的【工具(Tools)】選項，等下拉功能表出現後，再將滑鼠移到標記２的【開發板(Board)】選項上，此時系統會自動彈出右方標記３處的『開發板管理員(Boards Manager)』視窗，接著使用者只要上下移動滑鼠便可找到所要使用的開發板型號。由於現在Arduino IDE支援的開發模組板種類眾多，所以我們必須先將滑鼠游標移到標記4的「ESP32 Arduino」這裡，系統會再帶出右方的ESP32系列相關開發模組板彈選擇出視窗，其中標記5便是我們所使用的「AI Thinker ESP32-CAM」開發板的選擇點。

圖二•1  ESP32-CAM開發模組板選擇

接著就是選擇這塊ESP32-CAM開發板所連接的串列通訊埠，如下面的【圖二•2】所示，同樣的先用滑鼠左鍵點擊上方主能表標記１的【工具(Tools)】選項，等下拉功能表出現後，再將滑鼠移到標記２的【通訊埠(Port)】選項上，此時系統會自動彈出右方標記３處的『串列埠(Serial Ports)』視窗，接著使用者只要上下移動滑鼠選擇這塊ESP32-CAM開發板連接的通訊埠號碼。如果一切都正確則Arduino IDE開發軟體右下方，也就是標記4那裏會顯示我們所選擇的結果。

圖二•2  ESP32-CAM開發模組板通訊埠(COM)選擇

三、ESP32-CAM模組板硬體連接

　　下面的【圖三．1】是本文所使用的ESP32-CAM開發板硬體接腳外觀圖，由於這塊ESP32-CAM開發板不具備USB🡪RS232的轉接電路，因此必須使用外部的轉接板；接著的【圖三．2】是使用一般常見的FTDI /USB🡪RS232轉接板與ESP32-CAM開發板的接線圖，而【圖三．3】則是兩者之間接腳名稱的對應表。要注意到FTDI /USB🡪RS232轉接板的TXO腳是接到ESP32-CAM開發板的GPIO 3，也就是U0RXD，而RXI則是接到GPIO 1/U0TXD；此外在燒錄程式時還必須先把ESP32-CAM開發板GPIO 0接到地(GND)，否則會無法進入燒錄模式。

圖三．1  ESP32-CAM開發模組板接腳圖

圖三．2  ESP32-CAM開發模組板與FTDI燒錄轉接板連接圖

圖三．3  ESP32-CAM開發模組板與FTDI燒錄轉接板連接腳對應表

在Arduino IDE中寫好的程式要先經過編譯才能載入／燒錄到模組板的單晶片內，在Arduino IDE左上的『』按鈕符號稱為「Verify」，直接翻譯為『驗證』，其實也就是一般程式開發中所謂『編譯』(Compiling)的意思；而旁邊另一個『』按鈕符號稱為「Upload」，直譯為『上傳』，按下它便會連續執行『編譯』與『載入』(即燒錄) 兩個動作。在Arduino IDE中要燒錄程式到ESP32-CAM開發板時，先按下板子上的「RST」按鈕，然後再點擊『』這個稱為「Upload」的按鈕符號，就可以在rduino IDE下方的訊息視窗中看到燒錄過程的提示訊息。

如果上傳燒錄程式成功，記得要先把ESP32-CAM開發板上接在GPIO 0/GND之間的短接導線先拆開，然後再次按下板子上的「RST」按鈕，程式便會重新開始執行。

四、程式設計與分析

大部分第一次拿到ESP32-CAM這塊開發板的人，應該都會先使用內建在Arduino IDE中官方原來所提供的範例程式「CameraWebServer.ino」去測試這塊板子，而本範例程式就是把這個範例程式稍作修改而成的。在原來的範例程式中還提供了一個網頁型態的測試與調整介面，讓使用者可以更加了解這塊ESP32-CAM開發板的性能。由於我們實際在使用時只需要網路攝影機也就是Web IP Camera部分的功能，所以便把其中不需要的網頁程式去掉，只留下攝影機功能的部分。

圖四．1  開啟ESP32-CAM範例程式「CameraWebServer.ino」流程

上面的【圖四．1】是「CameraWebServer.ino」這個範例程式所在的位置，在開啟這個程式之後，如下面的【圖四．2】所示是這個範例程式的外觀；在原來的程式中原設計者把程式分割成4個部分•除了主程式「CameraWebServer」之外，在內部還分成了3個子程式分，別是「app_httpd.cpp」、「 camera_index.h 」和「camera_pins.h」。為了方便程式的撰寫與閱覽，在我們的範例程式中除了會把網路攝影機(Web IP Camera)部分保留之外，其他不需要的部分都會刪去，而且會將其餘的部分合併成一個頁面的主程式。

圖四．2  ESP32-CAM範例程式外觀

下面便是這個網路IP攝影機的完整程式列表，在這個範例程式中我們主要是實現兩個功能：

一、 將ESP32-CAM開發板設計為網路攝影機也就是Web IP Camera的功能

二、 將ESP32-CAM開發板以固定IP的方式連接到所使用的WiFi分享器

上述兩個功能中的第一項，在原始的官方範例程式「CameraWebServer.ino」中已經完成了，在此就不多說明，後面就只針對如何以固定IP的方式去連接WiFi分享器的部分來解說。

1. #include "esp_camera.h"
2. #include <WiFi.h>
3. #include "esp_timer.h"
4. #include "img_converters.h"
5. #include "Arduino.h"
6. #include "fb_gfx.h"
7. #include "soc/soc.h" //disable brownout problems
8. #include "soc/rtc_cntl_reg.h"  //disable brownout problems
9. #include "esp_http_server.h"
10.  
11. //用你自己的WiFi分享器資料取代下面的兩個變數:
12. const char* ssid = "你的WiFi分享器SSID";
13. const char* password = "你的WiFi分享器密碼";
14.  
15. IPAddress staticIP(192,168,0,166);    // 固定式本地IP位址
16. IPAddress gateway(192,168,0,1);
17. IPAddress subnet(255,255,255,0);
18.  
19. #define PART_BOUNDARY "123456789000000000000987654321"
20.  
21. // This project was tested with the AI Thinker Model, M5STACK PSRAM Model and M5STACK WITHOUT PSRAM
22. #define CAMERA_MODEL_AI_THINKER
23. //#define CAMERA_MODEL_M5STACK_PSRAM
24. //#define CAMERA_MODEL_M5STACK_WITHOUT_PSRAM
25.  
26. // Not tested with this model
27. //#define CAMERA_MODEL_WROVER_KIT
28.  
29. #if defined(CAMERA_MODEL_WROVER_KIT)
30.   #define PWDN_GPIO_NUM    -1
31.   #define RESET_GPIO_NUM   -1
32.   #define XCLK_GPIO_NUM    21
33.   #define SIOD_GPIO_NUM    26
34.   #define SIOC_GPIO_NUM    27
35.   
36.   #define Y9_GPIO_NUM      35
37.   #define Y8_GPIO_NUM      34
38.   #define Y7_GPIO_NUM      39
39.   #define Y6_GPIO_NUM      36
40.   #define Y5_GPIO_NUM      19
41.   #define Y4_GPIO_NUM      18
42.   #define Y3_GPIO_NUM       5
43.   #define Y2_GPIO_NUM       4
44.   #define VSYNC_GPIO_NUM   25
45.   #define HREF_GPIO_NUM    23
46.   #define PCLK_GPIO_NUM    22
47.  
48. #elif defined(CAMERA_MODEL_M5STACK_PSRAM)
49.   #define PWDN_GPIO_NUM     -1
50.   #define RESET_GPIO_NUM    15
51.   #define XCLK_GPIO_NUM     27
52.   #define SIOD_GPIO_NUM     25
53.   #define SIOC_GPIO_NUM     23
54.   
55.   #define Y9_GPIO_NUM       19
56.   #define Y8_GPIO_NUM       36
57.   #define Y7_GPIO_NUM       18
58.   #define Y6_GPIO_NUM       39
59.   #define Y5_GPIO_NUM        5
60.   #define Y4_GPIO_NUM       34
61.   #define Y3_GPIO_NUM       35
62.   #define Y2_GPIO_NUM       32
63.   #define VSYNC_GPIO_NUM    22
64.   #define HREF_GPIO_NUM     26
65.   #define PCLK_GPIO_NUM     21
66.  
67. #elif defined(CAMERA_MODEL_M5STACK_WITHOUT_PSRAM)
68.   #define PWDN_GPIO_NUM     -1
69.   #define RESET_GPIO_NUM    15
70.   #define XCLK_GPIO_NUM     27
71.   #define SIOD_GPIO_NUM     25
72.   #define SIOC_GPIO_NUM     23
73.   
74.   #define Y9_GPIO_NUM       19
75.   #define Y8_GPIO_NUM       36
76.   #define Y7_GPIO_NUM       18
77.   #define Y6_GPIO_NUM       39
78.   #define Y5_GPIO_NUM        5
79.   #define Y4_GPIO_NUM       34
80.   #define Y3_GPIO_NUM       35
81.   #define Y2_GPIO_NUM       17
82.   #define VSYNC_GPIO_NUM    22
83.   #define HREF_GPIO_NUM     26
84.   #define PCLK_GPIO_NUM     21
85.  
86. #elif defined(CAMERA_MODEL_AI_THINKER)
87.   #define PWDN_GPIO_NUM     32
88.   #define RESET_GPIO_NUM    -1
89.   #define XCLK_GPIO_NUM      0
90.   #define SIOD_GPIO_NUM     26
91.   #define SIOC_GPIO_NUM     27
92.   
93.   #define Y9_GPIO_NUM       35
94.   #define Y8_GPIO_NUM       34
95.   #define Y7_GPIO_NUM       39
96.   #define Y6_GPIO_NUM       36
97.   #define Y5_GPIO_NUM       21
98.   #define Y4_GPIO_NUM       19
99.   #define Y3_GPIO_NUM       18
100.   #define Y2_GPIO_NUM        5
101.   #define VSYNC_GPIO_NUM    25
102.   #define HREF_GPIO_NUM     23
103.   #define PCLK_GPIO_NUM     22
104. #else
105.   #error "Camera model not selected"
106. #endif
107.  
108. static const char* _STREAM_CONTENT_TYPE = "multipart/x-mixed-replace;boundary=" PART_BOUNDARY;
109. static const char* _STREAM_BOUNDARY = "\r\n--" PART_BOUNDARY "\r\n";
110. static const char* _STREAM_PART = "Content-Type: image/jpeg\r\nContent-Length: %u\r\n\r\n";
111.  
112. httpd_handle_t stream_httpd = NULL;
113.  
114. static esp_err_t stream_handler(httpd_req_t *req){
115.   camera_fb_t * fb = NULL;
116.   esp_err_t res = ESP_OK;
117.   size_t _jpg_buf_len = 0;
118.   uint8_t * _jpg_buf = NULL;
119.   char * part_buf[64];
120.  
121.   res = httpd_resp_set_type(req, _STREAM_CONTENT_TYPE);
122.   if(res != ESP_OK){
123.     return res;
124.   }
125.  
126.   while(true){
127.     fb = esp_camera_fb_get();
128.     if (!fb) {
129.       Serial.println("Camera capture failed");
130.       res = ESP_FAIL;
131.     } else {
132.       if(fb->width > 400){
133.         if(fb->format != PIXFORMAT_JPEG){
134.           bool jpeg_converted = frame2jpg(fb, 80, &_jpg_buf, &_jpg_buf_len);
135.           esp_camera_fb_return(fb);
136.           fb = NULL;
137.           if(!jpeg_converted){
138.             Serial.println("JPEG compression failed");
139.             res = ESP_FAIL;
140.           }
141.         } else {
142.           _jpg_buf_len = fb->len;
143.           _jpg_buf = fb->buf;
144.         }
145.       }
146.     }
147.     if(res == ESP_OK){
148.       size_t hlen = snprintf((char *)part_buf, 64, _STREAM_PART, _jpg_buf_len);
149.       res = httpd_resp_send_chunk(req, (const char *)part_buf, hlen);
150.     }
151.     if(res == ESP_OK){
152.       res = httpd_resp_send_chunk(req, (const char *)_jpg_buf, _jpg_buf_len);
153.     }
154.     if(res == ESP_OK){
155.       res = httpd_resp_send_chunk(req, _STREAM_BOUNDARY, strlen(_STREAM_BOUNDARY));
156.     }
157.     if(fb){
158.       esp_camera_fb_return(fb);
159.       fb = NULL;
160.       _jpg_buf = NULL;
161.     } else if(_jpg_buf){
162.       free(_jpg_buf);
163.       _jpg_buf = NULL;
164.     }
165.     if(res != ESP_OK){
166.       break;
167.     }
168.     //Serial.printf("MJPG: %uB\n",(uint32_t)(_jpg_buf_len));
169.   }
170.   return res;
171. }
172.  
173. void startCameraServer(){
174.   httpd_config_t config = HTTPD_DEFAULT_CONFIG();
175.   config.server_port = 80;
176.  
177.   httpd_uri_t index_uri = {
178.     .uri       = "/",
179.     .method    = HTTP_GET,
180.     .handler   = stream_handler,
181.     .user_ctx  = NULL
182.   };
183.   
184.   //Serial.printf("Starting web server on port: '%d'\n", config.server_port);
185.   if (httpd_start(&stream_httpd, &config) == ESP_OK) {
186.     httpd_register_uri_handler(stream_httpd, &index_uri);
187.   }
188. }
189.  
190. void setup() {
191.   WRITE_PERI_REG(RTC_CNTL_BROWN_OUT_REG, 0); //disable brownout detector
192.  
193.   Serial.begin(115200);
194.   Serial.setDebugOutput(false);
195.   
196.   camera_config_t config;
197.   config.ledc_channel = LEDC_CHANNEL_0;
198.   config.ledc_timer = LEDC_TIMER_0;
199.   config.pin_d0 = Y2_GPIO_NUM;
200.   config.pin_d1 = Y3_GPIO_NUM;
201.   config.pin_d2 = Y4_GPIO_NUM;
202.   config.pin_d3 = Y5_GPIO_NUM;
203.   config.pin_d4 = Y6_GPIO_NUM;
204.   config.pin_d5 = Y7_GPIO_NUM;
205.   config.pin_d6 = Y8_GPIO_NUM;
206.   config.pin_d7 = Y9_GPIO_NUM;
207.   config.pin_xclk = XCLK_GPIO_NUM;
208.   config.pin_pclk = PCLK_GPIO_NUM;
209.   config.pin_vsync = VSYNC_GPIO_NUM;
210.   config.pin_href = HREF_GPIO_NUM;
211.   config.pin_sscb_sda = SIOD_GPIO_NUM;
212.   config.pin_sscb_scl = SIOC_GPIO_NUM;
213.   config.pin_pwdn = PWDN_GPIO_NUM;
214.   config.pin_reset = RESET_GPIO_NUM;
215.   config.xclk_freq_hz = 20000000;
216.   config.pixel_format = PIXFORMAT_JPEG; 
217.   
218.   if(psramFound()){
219.     config.frame_size = FRAMESIZE_UXGA;
220.     config.jpeg_quality = 10;
221.     config.fb_count = 2;
222.   } else {
223.     config.frame_size = FRAMESIZE_SVGA;
224.     config.jpeg_quality = 12;
225.     config.fb_count = 1;
226.   }
227.   
228.   // Camera init
229.   esp_err_t err = esp_camera_init(&config);
230.   if (err != ESP_OK) {
231.     Serial.printf("Camera init failed with error 0x%x", err);
232.     return;
233.   }
234.   // Wi-Fi connection
235.   Serial.print("連接到SSID : ");
236.   Serial.println(ssid);
237.     WiFi.config(staticIP,gateway,subnet);
238.     delay(10);
239.   WiFi.begin(ssid, password);
240.   while (WiFi.status() != WL_CONNECTED) {
241.     delay(500);
242.     Serial.print(".");
243.   }
244.   Serial.println("");
245.   Serial.println("WiFi connected");
246.   
247.   Serial.print("Camera Stream Ready! Local IP: ");
248.   Serial.println(WiFi.localIP());
249.    
250.   // Start streaming web server
251.   startCameraServer();
252. }
253.  
254. void loop() {
255.   delay(1);
256. }

如果要使用固定的IP連接WiFi分享器，首先要定義三個屬性為「IPAddress」的變數，也就是下面15~17行的”staticIP”、”gateway”及”subnet”，尤其是第一個”staticIP”，他將會決定我們所使用的內部IP位址，在此為「192.168.0.166」；不過要注意的是這個位址並不是可以任意訂定的，你必須先確定所要求的位址在你所使用的WiFi分享器上可以正常工作，而且沒有跟其他裝置衝突！在本範例中我們所使用的WiFi分享器為目前市面上常見的tp-link廠型號為[AC1200]的機種，上面設定的位址可正常使用為無誤，其他的廠牌及型號就要自己去測試了。

12. const char* ssid = "你的WiFi分享器SSID";

13. const char* password = "你的WiFi分享器密碼";

14.

15. IPAddress staticIP(192,168,0,166);    // 固定式本地IP位址

16. IPAddress gateway(192,168,0,1);

17. IPAddress subnet(255,255,255,0);

在定義好這三個變數之後，接下來就要在連接WiFi分享器(237~243行)之前，先呼叫『WiFi.config(staticIP,gateway,subnet)』這個指令(237行)，這樣一來WiFi分享器就會照我們的要求，把「192.168.0.166」這個內部IP位址分配給連線的ESP32-CAM開發板了。

237.     WiFi.config(staticIP,gateway,subnet);

238.     delay(10);

239.  WiFi.begin(ssid, password);

240.   while (WiFi.status() != WL_CONNECTED) {

241.     delay(500);

242.     Serial.print(".");

243.   }

五、實機測試

在前面說過，本系統最大的特色，就是除了可以在本地的無線WiFi分享器範圍內使用，也可以在遠端透過網際網路(internet)連線觀測，不需要透過任何中介的伺服器，只要直接打開手機或電腦的瀏覽器，並輸入對應的IP位址就可以看到ESP32-CAM的畫面了！除此之外，WiFi分享器(Router)所連接的網際網路本身也不一定要有固定IP位址，只要可以連上網際網路就可以了。不過唯一的要求，就是所使用的WiFi分享器必須具有所謂埠轉發(Port Forwarding)，或是虛擬伺服器(Virtual Server)的功能，接下來我們就對這部分加以說明。

在處理好ESP32-CAM的部分之後，就要處理WiFi分享器(Router)所謂埠轉發(Port Forwarding)或是虛擬伺服器(Virtual Server)的功能，這其實是一種擴充網路IP的方法，尤其是針對內部區域網路。在電腦網路上不管是大到一台超級電腦或是小至一個簡單開關，如果要讓其他人或裝置能找的你，那你就必須擁有一個獨一無二的位址，這也就是所謂的網路裝置的IP。由於網路IP是一種珍貴的資源，因此一般的家庭除非有特別的需要，否則在租用網路時大多只會租用一個網路IP位址，而且還是所謂的動態IP，如果要申請固定式的IP都必須另外加錢。由於一般的家庭中可能不只一個使用者，或者說會有許多的裝置需連接到網際網路上，因此為了經濟上的考量，就會使用所謂的網路集線器(Hub)，或是無線式的WiFi分享器(Router)，好讓家裡面不同的裝置都能獨立且順利地上網。

圖五．1 基本電腦網際網路/本地區域網路架構圖

不過就算你使用的是固定IP，可是在經過這些網路IP分享裝置之後，整個世界就變了，以上面的【圖五．1】來說，雖然由網路供應商(ISP)所提供給這個區域網路的外界公共IP位址為『82.10.250.19』，但是連上中間這個WiFi Router的所有裝置所配到的內部IP都是以「192.168.0.」開始的位址，這是因為在網路IPv4地址協議中預留了3個IP位址段，作為私有地址，其中供組織機構內部使用的C類地址為：

 

192.168.0.0 -- 192.168.255.255

 

而這類以「192.168.」開始的位址，在公共網路上（即Internet）是看不到這些IP的，使用這些IP一定是你在公司、家庭或學校內網中，這些私有地址在公司（組織）內網中，可重複出現在不同公司組織內部都不會有衝突的問題。有興趣多了解有關這種內網問題的讀者，可到下列網站去瀏覽一下，應該會有更清楚的觀念。

https://kknews.cc/news/5b9jx5k.html

雖然如此，但許多市售的WiFi分享器(Router)會提供前面提到的埠轉發(Port Forwarding)或是虛擬伺服器(Virtual Server)的功能，以便讓使用者可以解決內外網IP不通的問題。下面的幾個網站對於前述的兩種功能與做法有詳細的介紹，請自行到這些網站查閱一下。

“什麼是埠轉發？什麼是埠映射？如何設置埠映射？”
原文網址：https://kknews.cc/code/oegpaqq.html

“【教學】Port Forwarding 介紹”

當我們要連線到網路上的伺服器電腦時，所傳送出去的資料其實不只有IP位址而已，還有要指明所需的服務類別，而這些類別則是由IP位址後面附加的通訊埠號碼來決定；這個通訊埠是由兩個位元組(byte)所構成，也就是說這個埠的號碼範圍由0~65535，例如20/21和FTP有關，25為SMTP，80則是我們所熟悉的HTTP網頁。假如我們想用瀏覽器開啟位在『82.10.250.19』這個IP位址的網頁，瀏覽器實際送出的網路通訊協定內容為『82.10.250.19:80』，也就是說瀏覽器會自動幫我們加上最後面的”80”埠號。因此當我們啟動WiFi分享器(Router)的埠轉發(Port Forwarding)功能時，便可以利用提出需求的客戶端(Client)所送來的埠號轉而去對應到內部IP位址，甚至於所希望的服務種類也就是內部的埠號都一並處理好。

以【圖五．1】來說，如果我們想把分配到的「192.168.0.166」這個內部IP的ESP32-CAM設計成網路伺服器的腳色，好讓使用者可以連上它之後觀看攝影鏡頭所拍到的畫面，為了容易記憶及避開一些已經被使用到的埠號，我們選用了”166”這個埠號碼(不是內部IP位址)；由於前面程式的175行設定這個ESP32-CAM 影像IP伺服器的服務埠為80，這時候提出需求的客戶端(Client)瀏覽器的URL網址欄位要輸入的網址為『82.10.250.19:166』，這樣就可以對應到ESP32-CAM 在WiFi分享器(Router) 內部所分配到的IP位址及埠號「192.168.0.166:80」了。

175.  config.server_port = 80;

接下來我們就以目前市面上很常見的TP-Link公司型號為AC1200的WiFi路由(Rruter)分享器，來舉例如何設定埠轉發(Port Forwarding)或是虛擬伺服器(Virtual Server)的功能；首先記得把你電腦的網路線插在AC1200後方的內部網路插座上，接著啟動你電腦的瀏覽器，並在網址欄輸入「192.168.0.1」這個IP位址，就可以進入這個WiFi分享器(Router)的登入頁面；當輸入的使用者名稱與密碼正確無誤後，就可以看到下面【圖五．2】的主頁面了。這時點選標記1【通訊埠導向】下的[虛擬伺服器]選項，在點選【新增】按鈕之後，就可以進入右邊[虛擬伺服器]的設定畫面。

圖五．2  TP-Link AC1200WiFi路由(Rruter)器虛擬伺服器設定畫面

因為前面已經說過要使用”166”這個外部選擇埠號作為我們的轉發埠號碼，所以在標記2的地方，最上面『通訊服務埠：』這一欄就要填上”166”這個數字；至於『IP位址：』則是我們想要ESP32-CAM對應到的內部「192.168.0.166」這個IP位址，而『內部通訊埠：』是前面175行程式所指定的「80」這個內部通訊埠號碼，接著的『通訊協定：』指的是要用TCP或是DUP這兩種網路傳輸協定中那一種﹖在此選擇的是[全部]，也就是兩種都可使用。在做完前面的設定之後，不要忘了『狀態：』這一欄要選擇[啟用]，否則還是不會動作。最後就是按下標記3的【儲存】按鈕，把所有的設定值儲存起來，這樣就可以開始使用這台WiFi分享器的埠轉發(Port Forwarding)/虛擬伺服器(Virtual Server)功能了！

在本文一開始的時候就說過，我們這個ESP32-CAM網路監視器系統最大的特色，就是可以在本地區域的無線WiFi分享器範圍內使用，也可以在遠端透過網際網路(internet)連線使用，而且網路WiFi分享器所連接的網際網路本身也不一定要有固定IP位址，只要可以連上網際網路就可以了。不過唯一的要求，就是所使用的WiFi分享器(Router)必須具有所謂埠轉發(Port Forwarding)，或是虛擬伺服器(Virtual Server)的功能。

當我們想要在遠端不管是用電腦還是用手機等裝置透過網際網路(Internet)來連線觀看這個ESP32-CAM的畫面時，總是要知道它在網際網路(Internet)上的IP位址才行，但是如果家裡申請的是動態IP那不就麻煩了﹖在這裡介紹一種方法可以很簡單得知你家的網際網路IP位址為何。首先要確定你的電腦或是手機等裝置已經連上你家的WiFi分享器(Router)，然後啟動裝置中的瀏覽器(例如IE或Chrome)，接著如下面【圖五．3】所示，在標記1網址輸入欄輸入【myip.com.tw】這個網址，只要連線上就馬上可以在標記2的地方看到你這台裝置所分配到的網際網路(Internet)IP位址,而也就是你的WiFi分享器(Router)從你的網路供應商(ISP)所得到的網際網路(Internet)IP位址！

圖五．3 查詢WiFi分享器(Router)之網際網路(Internet)IP位址

如果我們得到的網際網路(Internet)IP如上面的標記2所示，這時我們只要在電腦或手機的瀏覽器網址欄內輸入『132.241.144.108:166』這個IP網址及埠號，便可以連線到你的ESP32-CAM並看到鏡頭所拍到的畫面了！依照實際測試的結果，ESP32-CAM會以XVGA的模式每秒送一張畫面，影像的畫質看起來還很不錯，有興趣的讀者不妨試做看看。由於我們是以HTTP的協定方式傳送影像畫面，所以一次只能有一個使用者連線觀看，如果是當成一般家用的網路監視器來使用，這個限制應該不是問題。

即使你家裡申請的是動態IP，但只要WiFi分享器(Router)啟動並獲得一個網際網路(Internet)IP之後，除非把WiFi分享器(Router)的電源關閉，或是把網路連接纜線拔除，否則你的WiFi分享器(Router)所擁有的網際網路(Internet)IP是不會再改變的，這其實也等同在這段時間你會擁有一個固定的網際網路(Internet)IP，由於一般我們家裡的WiFi分享器(Router)一開始插電使用之後，大概就不會去關機了，所以除非你特意去關機或是遇上停電，否則測試過一次實際分配到的網際網路(Internet)IP之後，就可以一直用下去了。

下面的圖片是實際抓到的拍攝畫面，大家可以參考一下畫質如何。

圖五．4  ESP32-CAM實際拍攝畫面