勉強しないとな~blog

ちゃんと勉強せねば…な電気設計エンジニアです。

M5Stampでcaptive portal

今回はM5Stampの続き。
まだExampleを試してみる。

Captive Portal Example

今回やってみるのは、protocol > http_server > captive_portalのところ。

説明を見ると、「すべてのDNS IP questionsをsoftAPのポイントにリダイレクトして、すべてのHTTPリクエストをcaptive portalのルートページにリダイレクトする」という感じのことが書かれている。

AndroidiOSWindowsだと、captive portal がポップアップする、と書かれている。

M5Stamp側がWi-Fiのアクセスポイントになる動作のよう。

captive portalとは

下記参考サイトによると、

HTTPクライアントがインターネットを利用する前に、ネットワーク上の特定のWEBの参照(通常は認証目的で)を強制する技術

らしい。

Captive Portalとは | OSSのデージーネット

"captive"は"捕虜"の意味で、入ってきたアクセスを全部決まったところにリダイレクトする、というところの意味合いから来てるのか。

プロジェクト作成、ビルド、実行

手順は前の記事と同様。

nokixa.hatenablog.com

SDK Configuration editorでの設定項目は、

  • SoftAP SSID
  • SoftAP Password
  • Maximal STA connections

の3つ。

実行結果

こんな感じのログが出てくる。

...
I (524) wifi:mode : softAP (68:67:25:b2:53:45)
I (524) wifi:Total power save buffer number: 16
I (524) wifi:Init max length of beacon: 752/752
I (524) wifi:Init max length of beacon: 752/752
I (534) esp_netif_lwip: DHCP server started on interface WIFI_AP_DEF with IP: 192.168.4.1
I (544) example: Set up softAP with IP: 192.168.4.1
I (544) example: wifi_init_softap finished. SSID:'esp32_ssid' password:'esp32_pwd'
I (554) example: Starting server on port: '80'
I (564) example: Registering URI handlers
I (564) example_dns_redirect_server: Socket created
I (574) example_dns_redirect_server: Socket bound, port 53
I (574) example_dns_redirect_server: Waiting for data
I (584) main_task: Returned from app_main()

Wi-FiがsoftAPモードで動作している、という表示になっている。

ここでiPhoneからWi-Fi設定を開いてみると、"esp32_ssid"というのが見える。

これに接続してみると、"ESP32 Captive Portal"という画面がすぐ出てきた。

ESP側のログも動いていた。
DNSリクエストのリダイレクトなどやっているよう。

I (203414) wifi:new:<1,0>, old:<1,1>, ap:<1,1>, sta:<255,255>, prof:1
I (203414) wifi:station: d6:7a:8a:f7:41:5c join, AID=1, bgn, 20
I (203444) example: station d6:7a:8a:f7:41:5c join, AID=1
I (203844) wifi:<ba-add>idx:2 (ifx:1, d6:7a:8a:f7:41:5c), tid:0, ssn:2, winSize:64
I (204884) esp_netif_lwip: DHCP server assigned IP to a client, IP is: 192.168.4.2
I (206644) example_dns_redirect_server: Received 36 bytes from 192.168.4.2 | DNS reply with len: 52
I (206644) example_dns_redirect_server: Waiting for data
I (206644) example_dns_redirect_server: Received 36 bytes from 192.168.4.2 | DNS reply with len: 52       
I (206654) example_dns_redirect_server: Waiting for data
I (206664) example_dns_redirect_server: Received 36 bytes from 192.168.4.2 | DNS reply with len: 52       
I (206674) example_dns_redirect_server: Waiting for data
I (206684) example_dns_redirect_server: Received 40 bytes from 192.168.4.2 | DNS reply with len: 56       
I (206694) example_dns_redirect_server: Waiting for data
I (206694) example_dns_redirect_server: Received 40 bytes from 192.168.4.2 | DNS reply with len: 56       
I (206704) example_dns_redirect_server: Waiting for data
I (206714) example_dns_redirect_server: Received 35 bytes from 192.168.4.2 | DNS reply with len: 51       
I (206724) example_dns_redirect_server: Waiting for data
I (206724) example_dns_redirect_server: Received 35 bytes from 192.168.4.2 | DNS reply with len: 51
I (206734) example_dns_redirect_server: Waiting for data
I (206744) example_dns_redirect_server: Received 36 bytes from 192.168.4.2 | DNS reply with len: 52       
I (206754) example_dns_redirect_server: Waiting for data
I (206764) example: Redirecting to root
I (207474) example: Redirecting to root
I (207484) example: Serve root
I (207504) example: Redirecting to root
I (207554) example: Redirecting to root
I (208984) example_dns_redirect_server: Received 43 bytes from 192.168.4.2 | DNS reply with len: 59
I (208984) example_dns_redirect_server: Waiting for data
I (208994) example_dns_redirect_server: Received 43 bytes from 192.168.4.2 | DNS reply with len: 59       
I (209004) example_dns_redirect_server: Waiting for data

プロジェクト中身

プロジェクトフォルダを見てみると、main.cなどのほかに、"root.html"というのが存在する。
これがcaptive portalのルートページになっているよう。

これをいじれば、好きなページを作れる。
ボタンとかのパーツを作れば、Lチカとかもできるか?

と思ってちょっと調べたが、htmlちゃんと勉強しないと難しそう。
おいおいやってみる。

とりあえず背景色だけ変えてみた。

以上

簡単なページを作って、iPhoneなどからアクセスして見てみる、というのはできそう。
どうにかhtmlを勉強してやってみたい。