前提・実現したいこと
現在、Arduino上でWebserberを立ち上げ、ESP32を用いてLEDの点滅をさせています。その際、立ち上げたWebserver上にスタイダーを表示して、LEDの点滅間隔を変更するというプログラムを書いてあります。
これをiOSアプリケーション上で操作できるようにしたいため、スライダーを表示し、スライダーの値をESP32上に送信し、点滅間隔を変える方法に切り替えたいと思っています。
WebServerはあくまでもArduino上で起動させたまま(起動し続けたまま)、Swiftからは起動状態のWebServerに対してHTTP通信を行うという設計を考えており、SwiftからHTTP通信を行う際のSwift上で作成されたスライダーでの値を送信する方法を教えていただきたいです。
該当のソースコード
Arduinoのコードは現在このようになっています。
Aeduino
1#include <WiFi.h> 2 3// 使用するWi-Fiとそのパスワードに書き換え 4const char* ssid = "*****"; 5const char* password = "*****"; 6 7// ポート80番を使用 8WiFiServer server(80); 9 10// HTTPリクエストを格納する変数 11String header; 12 13// 値の設定に使用する変数 14String valueString = String(5); 15int pos1 = 0; 16int pos2 = 0; 17 18//ledpin 19const int ledR = 13; 20 21 22void setup() { 23 //ledc setting 24 //R 25 ledcSetup(0, 2, 13); 26 ledcAttachPin(ledR, 0); 27 28 29 Serial.begin(115200); 30 31 // Wi-Fiに接続 32 Serial.print("Connecting to "); 33 Serial.println(ssid); 34 WiFi.begin(ssid, password); 35 while (WiFi.status() != WL_CONNECTED) { 36 delay(500); 37 Serial.print("."); 38 } 39 40 Serial.println(""); 41 Serial.println("WiFi connected."); 42 Serial.println("IP address: "); 43 Serial.println(WiFi.localIP()); 44 server.begin(); 45} 46 47void loop(){ 48 WiFiClient client = server.available(); // Listen for incoming clients 49 50 if (client) { // If a new client connects, 51 Serial.println("New Client."); // print a message out in the serial port 52 String currentLine = ""; // make a String to hold incoming data from the client 53 while (client.connected()) { // loop while the client's connected 54 if (client.available()) { // if there's bytes to read from the client, 55 char c = client.read(); // read a byte, then 56 Serial.write(c); // print it out the serial monitor 57 header += c; 58 if (c == '\n') { // if the byte is a newline character 59 // if the current line is blank, you got two newline characters in a row. 60 // that's the end of the client HTTP request, so send a response: 61 if (currentLine.length() == 0) { 62 // HTTP headers always start with a response code (e.g. HTTP/1.1 200 OK) 63 // and a content-type so the client knows what's coming, then a blank line: 64 client.println("HTTP/1.1 200 OK"); 65 client.println("Content-type:text/html"); 66 client.println("Connection: close"); 67 client.println(); 68 69 // Display the HTML web page 70 client.println("<!DOCTYPE html><html>"); 71 client.println("<head><meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"><title>ESP32 RGB LED controller</title>"); 72 client.println("<link rel=\"icon\" href=\"data:,\">"); 73 // CSS to style the on/off buttons 74 // Feel free to change the background-color and font-size attributes to fit your preferences 75 client.println("<style>body { text-align: center; font-family: \"Trebuchet MS\", Arial; margin-left:auto; margin-right:auto;}"); 76 client.println("#servoPosR{color: red;}"); 77 client.println(".slider { width: 300px; }</style>"); 78 client.println("<script src=\"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js\"></script>"); 79 80 // Web Page 81 client.println("</head><body><h1>ESP32 with RGB LED</h1>"); 82 //R slide bar 83 client.println("<p>Brightness of R: <span id=\"servoPosR\"></span></p>"); 84 client.println("<input type=\"range\" min=\"0\" max=\"100\" class=\"slider\" id=\"servoSliderR\" onchange=\"servo(this.value,'R')\" value=\""+valueString+"\"/>"); 85 86 client.println("<script>"); 87 //send R value 88 client.println("var sliderR = document.getElementById(\"servoSliderR\");"); 89 client.println("var servoPR = document.getElementById(\"servoPosR\"); servoPR.innerHTML = sliderR.value;"); 90 client.println("sliderR.oninput = function() { sliderR.value = this.value; servoPR.innerHTML = this.value; }"); 91 92 93 //HTTP getのための関数 94 client.println("$.ajaxSetup({timeout:1000}); function servo(pos,color) { "); 95 client.println("$.get(\"/?value\" + color + \"=\" + pos + \"&\"); {Connection: close};}</script>"); 96 97 client.println("</body></html>"); 98 99 //HTTPリクエストの処理部分 100 //GET /?value=180& HTTP/1.1 101 //Rの値をledの出力に変換 102 if(header.indexOf("GET /?valueR=")>=0) { 103 pos1 = header.indexOf('='); 104 pos2 = header.indexOf('&'); 105 valueString = header.substring(pos1+1, pos2); 106 107 //LEDをvalueStringの値で点灯 108 ledcWrite(0, 8192*valueString.toInt()/100); 109 110 Serial.println(valueString); 111 } 112 113 114 // HTTPレスポンスの終了 115 client.println(); 116 // Break out of the while loop 117 break; 118 } else { 119 currentLine = ""; 120 } 121 } else if (c != '\r') { 122 currentLine += c; 123 } 124 } 125 } 126 // Clear the header variable 127 header = ""; 128 // 接続を切断 129 client.stop(); 130 Serial.println("Client disconnected."); 131 Serial.println(""); 132 } 133}
試したこと
先ほども述べたように、Arduino上でWebserverを立ち上げ、スライダーを表示させて、その値をESP32に送信するというプログラムを全て書いてしまっています。スライダー表示、スライダーの値をHTTP送信するという部分のプログラムをSwiftで組みたいのですが、Swiftが使いこなせていないので教えていただきたいです。
補足情報(FW/ツールのバージョンなど)
iOS13.7
Swift5.2.4
あなたの回答
tips
プレビュー