You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
AutoConnect/mkdocs/gettingstarted.md

76 lines
4.5 KiB

6 years ago
## Let's do the most simple sketch
Open the Arduino IDE, write the following sketch and upload it. The feature of this sketch is that the SSID and Password are not coded.
```cpp
6 years ago
#include <ESP8266WiFi.h> // Replace with WiFi.h for ESP32
#include <ESP8266WebServer.h> // Replace with WebServer.h for ESP32
6 years ago
#include <AutoConnect.h>
6 years ago
ESP8266WebServer Server; // Replace with WebServer for ESP32
6 years ago
AutoConnect Portal(Server);
void rootPage() {
char content[] = "Hello, world";
Server.send(200, "text/plain", content);
}
void setup() {
delay(1000);
Serial.begin(115200);
Serial.println();
Server.on("/", rootPage);
if (Portal.begin()) {
Serial.println("WiFi connected: " + WiFi.localIP().toString());
}
}
void loop() {
Portal.handleClient();
}
```
6 years ago
!!! note ""
6 years ago
The above code can be applied to ESP8266. To apply to ESP32, replace ```ESP8266WebServer``` class with ```WebServer``` and include ```WiFi.h``` and ```WebServer.h``` of arduino-esp32 appropriately.
6 years ago
6 years ago
### <i class="fa fa-play-circle"></i> Run at first
6 years ago
After about 30 seconds, if the ESP8266 cannot connect to nearby Wi-Fi spot, you pull out your smartphone and open *Wi-Fi settings* from the *Settings* Apps. You can see the **esp8266ap** [^1] in the list of *"CHOOSE A NETWORK..."*. Then tap the esp8266ap and enter password **12345678**, a something screen pops up automatically as shown below.
6 years ago
[^1]:When applied to ESP32, SSID will appear as **esp32ap**.
6 years ago
<span style="display:inline-block;width:282px;height:501px;border:1px solid lightgrey;"><img data-gifffer="images/login_ani.gif" data-gifffer-width="280" style="width:280px;" /></span><img src="images/arrow_right.svg" style="vertical-align:top;padding-top:120px;width:48px;margin-left:30px;margin-right:30px;" /><img src="images/stat.png" style="border:1px solid lightgrey;width:280px;" /></span>
6 years ago
This is the AutoConnect statistics screen. This screen displays the current status of the established connection, WiFi mode, IP address, free memory size, and etc. Also, the **hamburger icon** is the control menu of AutoConnect seems at the upper right. By tap the hamburger icon, the control menu appears as the below.
### <i class="fa fa-cog"></i> Join to the new access point
Here, tap *"Configure new AP"* to connect the new access point then the SSID configuration screen would be shown. Enter the **SSID** and **Passphrase** and tap **apply** to start connecting the access point.
<img src="images/menu_login.png" style="border:1px solid lightgrey;width:280px;" /><img src="images/arrow_right.svg" style="vertical-align:top;padding-top:120px;width:48px;margin-left:30px;margin-right:30px;" /><img src="images/config_ssid.png" style="border:1px solid lightgrey;width:280px;" />
6 years ago
!!! info "Can be configured with static IP"
Since v1.1.0, [**Configure new AP**](menu.md#configure-new-ap) menu can configure for WIFI_STA with static IP.
6 years ago
### <i class="fa fa-rss"></i> Connection establishment
After connection established, the current status screen will appear. It is already connected to WLAN with WiFi mode as WIFI\_AP\_STA and the IP connection status is displayed there including the SSID. Then at this screen, you have two options for the next step.
4 years ago
For one, continues execution of the Sketch while keeping this connection. You can access ESP8266 via browser through the established IP address after cancel to "**Log in**" by upper right on the screen.
6 years ago
Or, "**RESET**" can be selected. The ESP8266 resets and reboots. After that, immediately before the connection will be restored automatically with WIFI\_STA mode.
<img src="images/established.png" style="border:1px solid lightgrey;width:280px;" /><img src="images/arrow_right.svg" style="vertical-align:top;padding-top:120px;width:48px;margin-left:30px;margin-right:30px;" /><img src="images/reset.png" style="border:1px solid lightgrey;width:280px;" />
6 years ago
### <i class="fa fa-play-circle"></i> Run for usually
4 years ago
The IP address of ESP8266 would be displayed on the serial monitor after connection restored. Please access its address from the browser. The "Hello, world" page will respond. It's the page that was handled by in the Sketch with "**on**" function of *ESP8266WebServer*.
6 years ago
<img src="images/serial.png" style="vertical-align:top;" /><img src="images/arrow_right.svg" style="vertical-align:top;padding-top:60px;width:48px;margin-left:45px;margin-right:30px;" /><img src="images/hello_world.png" style="border:1px solid lightgrey;width:280px;" />
6 years ago
<script>
window.onload = function() {
Gifffer();
};
</script>