Webサーバーその1

概要

GR-PEACHはWebサーバーとして動作できます。Webブラウザ(クライアント側)からGR-PEACHのLEDを操作する例をご紹介します。

peach-sp-webserver-ledslider

準備

GR-PEACH、USBケーブル(マイクロBタイプ)の他に有線LAN、マイクロSDを準備してください。

peach-sp-webserver-ledslider-prepare

LEDを遠隔操作サンプル

はじめにブラウザ表示用の「index.htm」,「mbedrpc.js」ファイルをマイクロSDに保存します。

以下のリンクを右クリックして「対象をファイルに保存」を行ってダウンロードしてください。

保存後、GR-PEACHの裏面にあるSDソケットにマイクロSDを差し込んで以下のスケッチをgr_sketch.cppにコピーしてビルドし、GR-PEACHに書き込んでください。


#include <Arduino.h>
#include "HTTPServer.h"
#include "mbed_rpc.h"
#include "SdUsbConnect.h"
//#define USE_WIFI
#ifdef USE_WIFI
#include "ESP32Interface.h"
ESP32Interface network;
#define WLAN_SSID            ("xxxxxxxx")
#define WLAN_PSK             ("xxxxxxxx")
#define WLAN_SECURITY        NSAPI_SECURITY_WPA_WPA2
#else
#include "EthernetInterface.h"
EthernetInterface network;
#endif
/** Network setting **/
#define USE_DHCP               (1)
#if (USE_DHCP == 0)
#define IP_ADDRESS           ("192.168.11.2")     /* IP address      */
#define SUBNET_MASK          ("255.255.255.0")    /* Subnet mask     */
#define DEFAULT_GATEWAY      ("192.168.11.3")     /* Default gateway */
#endif
SdUsbConnect storage("storage");
void AnalogRead(Arguments* arg, Reply* r);
int char_to_int(char* c, int len);
int char_to_int(char* c, int len){
    int r = 0;
    for (int i = 0; i < len; i++) {
        if (c[i] == 0) break;
        r = r * 10 + c[i] - '0';
    }
    return r;
}
 
void analogwrite(Arguments* arg, Reply* r) {
    if (arg != NULL) {
        /* command analysis and execute */
        analogWrite(char_to_int(arg->argv[0], 2), char_to_int(arg->argv[1], 3));
    }
}
void setup(void) {
  Serial.begin(9600);
  Serial.println("********* PROGRAM START ***********");
  // SD & USB
  Serial.print("Finding strage..");
  storage.wait_connect();
  Serial.println("done");
  RPCFunction rpc_analogwrite(&analogwrite, "analogWrite");
  Serial.print("Network Setting up...\r\n");
#if (USE_DHCP == 0)
  network.set_dhcp(false);
  if (network.set_network(IP_ADDRESS, SUBNET_MASK, DEFAULT_GATEWAY) != 0) { //for Static IP Address (IPAddress, NetMasks, Gateway)
    Serial.println("Error");
  }
#endif
#ifdef USE_WIFI
  network.set_credentials(WLAN_SSID, WLAN_PSK, WLAN_SECURITY);
#endif
  if (network.connect() != 0) {
    return;
  }
  Serial.print("MAC Address is ");
  Serial.println(network.get_mac_address());
  Serial.print("IP Address is ");
  Serial.println(network.get_ip_address());
  Serial.print("NetMask is ");
  Serial.println(network.get_netmask());
  Serial.print("Gateway Address is ");
  Serial.println(network.get_gateway());
  Serial.println("Network Setup OK\r\n");
  FSHandler::mount("/storage", "/");
  HTTPServerAddHandler<FSHandler>("/");
  HTTPServerAddHandler<RPCHandler>("/rpc");
  HTTPServerStart(&network, 80);
}
void loop() {
}

LEDを遠隔操作の動作を確認

GR-PEACHに書き込んだらTeratermなどのシリアルモニターを起動して、GR-PEACHのリセットボタンを押します。以下のようにDHCPにより取得したIPアドレスが表示されます。

peach-sp-ntsc-serialmonitor

表示されたIPアドレスをWebブラウザのURLに打ち込んでみましょう。以下の画面が表示されます。

R(赤)、G(緑)、B(青)のスライダーを操作することで、GR-PEACHのLEDが変化します。

peach-sp-webserver-ledsliderpeach-sp-webserver-ledslider-led