|
| 1 | +#include <WiFi.h> |
| 2 | +#include <WiFiClient.h> |
| 3 | +#include <WebServer.h> |
| 4 | +#include <ESPmDNS.h> |
| 5 | +#include <Update.h> |
| 6 | + |
| 7 | +const char* host = "ESP32"; |
| 8 | +const char* ssid = "xxx"; |
| 9 | +const char* password = "xxxx"; |
| 10 | + |
| 11 | +WebServer server(80); |
| 12 | + |
| 13 | +const char* loginIndex = "<form name='loginForm'>" |
| 14 | + "<table width='20%' bgcolor='A09F9F' align='center'>" |
| 15 | + "<tr>" |
| 16 | + "<td colspan=2><center><font size=4><b>ESP32 Login Page</b></font></center>" |
| 17 | + "<br>" |
| 18 | + |
| 19 | + "</td>" |
| 20 | + "<br>" |
| 21 | + "<br>" |
| 22 | + "</tr>" |
| 23 | + "<td>Username:</td>" |
| 24 | + "<td><input type='text' size=25 name='userid'><br></td>" |
| 25 | + "</tr>" |
| 26 | + "<br>" |
| 27 | + "<br>" |
| 28 | + "<tr>" |
| 29 | + "<td>Password:</td>" |
| 30 | + "<td><input type='Password' size=25 name='pwd'><br></td>" |
| 31 | + "<br>" |
| 32 | + "<br>" |
| 33 | + "</tr>" |
| 34 | + |
| 35 | + "<tr>" |
| 36 | + "<td><input type='submit' onclick='check(this.form)' value='Login'></td>" |
| 37 | + "</tr>" |
| 38 | + "</table>" |
| 39 | + "</form>" |
| 40 | + "<script>" |
| 41 | + "function check(form)" |
| 42 | + "{" |
| 43 | + "if(form.userid.value=='admin' && form.pwd.value=='admin')" |
| 44 | + "{" |
| 45 | + "window.open('/serverIndex')" |
| 46 | + "}" |
| 47 | + "else" |
| 48 | + "{" |
| 49 | + " alert('Error Password or Username')/*displays error message*/" |
| 50 | + |
| 51 | + "}" |
| 52 | + "}" |
| 53 | + "</script>"; |
| 54 | + |
| 55 | + |
| 56 | + |
| 57 | + |
| 58 | + |
| 59 | +const char* serverIndex = "<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>" |
| 60 | + "<form method='POST' action='#' enctype='multipart/form-data' id='upload_form'>" |
| 61 | + "<input type='file' name='update'>" |
| 62 | + "<input type='submit' value='Update'>" |
| 63 | + "</form>" |
| 64 | + "<div id='prg'>progress: 0%</div>" |
| 65 | + "<script>" |
| 66 | + "$('form').submit(function(e){" |
| 67 | + "e.preventDefault();" |
| 68 | + "var form = $('#upload_form')[0];" |
| 69 | + "var data = new FormData(form);" |
| 70 | + " $.ajax({" |
| 71 | + "url: '/update'," |
| 72 | + "type: 'POST'," |
| 73 | + "data: data," |
| 74 | + "contentType: false," |
| 75 | + "processData:false," |
| 76 | + "xhr: function() {" |
| 77 | + "var xhr = new window.XMLHttpRequest();" |
| 78 | + "xhr.upload.addEventListener('progress', function(evt) {" |
| 79 | + "if (evt.lengthComputable) {" |
| 80 | + "var per = evt.loaded / evt.total;" |
| 81 | + "$('#prg').html('progress: ' + Math.round(per*100) + '%');" |
| 82 | + "}" |
| 83 | + "}, false);" |
| 84 | + "return xhr;" |
| 85 | + "}," |
| 86 | + "success:function(d, s) {" |
| 87 | + "console.log('success!')" |
| 88 | + "}," |
| 89 | + "error: function (a, b, c) {" |
| 90 | + "}" |
| 91 | + "});" |
| 92 | + "});" |
| 93 | + "</script>"; |
| 94 | +void setup(void) { |
| 95 | + Serial.begin(115200); |
| 96 | + |
| 97 | + // Connect to WiFi network |
| 98 | + WiFi.begin(ssid, password); |
| 99 | + Serial.println(""); |
| 100 | + |
| 101 | + // Wait for connection |
| 102 | + while (WiFi.status() != WL_CONNECTED) { |
| 103 | + delay(500); |
| 104 | + Serial.print("."); |
| 105 | + } |
| 106 | + Serial.println(""); |
| 107 | + Serial.print("Connected to "); |
| 108 | + Serial.println(ssid); |
| 109 | + Serial.print("IP address: "); |
| 110 | + Serial.println(WiFi.localIP()); |
| 111 | + |
| 112 | + /*use mdns for host name resolution*/ |
| 113 | + if (!MDNS.begin(host)) { //http://esp32.local |
| 114 | + Serial.println("Error setting up MDNS responder!"); |
| 115 | + while (1) { |
| 116 | + delay(1000); |
| 117 | + } |
| 118 | + } |
| 119 | + Serial.println("mDNS responder started"); |
| 120 | + /*return index page which is stored in serverIndex */ |
| 121 | + server.on("/", HTTP_GET, []() { |
| 122 | + server.sendHeader("Connection", "close"); |
| 123 | + server.send(200, "text/html", loginIndex); |
| 124 | + }); |
| 125 | + server.on("/serverIndex", HTTP_GET, []() { |
| 126 | + server.sendHeader("Connection", "close"); |
| 127 | + server.send(200, "text/html", serverIndex); |
| 128 | + }); |
| 129 | + /*handling uploading firmware file */ |
| 130 | + server.on("/update", HTTP_POST, []() { |
| 131 | + server.sendHeader("Connection", "close"); |
| 132 | + server.send(200, "text/plain", (Update.hasError()) ? "FAIL" : "OK"); |
| 133 | + ESP.restart(); |
| 134 | + }, []() { |
| 135 | + HTTPUpload& upload = server.upload(); |
| 136 | + if (upload.status == UPLOAD_FILE_START) { |
| 137 | + Serial.printf("Update: %s\n", upload.filename.c_str()); |
| 138 | + if (!Update.begin(UPDATE_SIZE_UNKNOWN)) { //start with max available size |
| 139 | + Update.printError(Serial); |
| 140 | + } |
| 141 | + } else if (upload.status == UPLOAD_FILE_WRITE) { |
| 142 | + /* flashing firmware to ESP*/ |
| 143 | + if (Update.write(upload.buf, upload.currentSize) != upload.currentSize) { |
| 144 | + Update.printError(Serial); |
| 145 | + } |
| 146 | + } else if (upload.status == UPLOAD_FILE_END) { |
| 147 | + if (Update.end(true)) { //true to set the size to the current progress |
| 148 | + Serial.printf("Update Success: %u\nRebooting...\n", upload.totalSize); |
| 149 | + } else { |
| 150 | + Update.printError(Serial); |
| 151 | + } |
| 152 | + } |
| 153 | + }); |
| 154 | + server.begin(); |
| 155 | +} |
| 156 | + |
| 157 | +void loop(void) { |
| 158 | + server.handleClient(); |
| 159 | + delay(1); |
| 160 | +} |
0 commit comments