React Native Client Application Fails Connection to ESP32 HTTPS Server

leoschofield
Posts: 1
Joined: Fri Dec 03, 2021 9:15 am

React Native Client Application Fails Connection to ESP32 HTTPS Server

Postby leoschofield » Fri Dec 03, 2021 10:14 am

My react native (Android) application is failing to connect to an esp32 https (self-signed) server, but my laptop can connect to it, and react native CAN connect to a http server on the esp32; see details below:

Does anyone know what is causing the connection failure (maybe Android doesn't like self signed certs?)

ESP32 HTTP
Laptop (chrome) Fetches http://192.168.4.1/hello Successfully
Mobile (react native) Fetches http://192.168.4.1/hello Successfully

ESP32 HTTPS
Laptop (chrome)Fetches https://192.168.4.1/hello Successfully

Mobile (react native) fails:

ESP32 Debug
E (342059) esp-tls-mbedtls: mbedtls_ssl_handshake returned -30592
E (342069) esp_https_server: esp_tls_create_server_session failed

W (342069) httpd: httpd_accept_conn: session creation failed
W (342079) httpd: httpd_server: error accepting new connection



React Native Debug:

Possible Unhandled Promise Rejection (id: 0):
TypeError: Network request failed
http://localhost:8081/index.bundle?plat ... e:24531:33
http://localhost:8081/index.bundle?plat ... e:28668:26
_callTimer@http://localhost:8081/index.bundle?plat ... e:28588:17
callTimers@http://localhost:8081/index.bundle?plat ... e:28789:19
__callFunction@http://localhost:8081/index.bundle?plat ... ue:3086:36
http://localhost:8081/index.bundle?plat ... ue:2810:31
__guard@http://localhost:8081/index.bundle?plat ... ue:3037:15
callFunctionReturnFlushedQueue@http://localhost:8081/index.bundle?plat ... ue:2809:21
callFunctionReturnFlushedQueue@[native code]




React Native App.js (for connecting to ESP32 Https)

Code: Select all

import React, { Component } from 'react';
import {PermissionsAndroid,Text,View,Button,StyleSheet  } from 'react-native';
import wifi from 'react-native-android-wifi';

//================================================================================================
//======================================= styles =================================================
//================================================================================================
const styles = StyleSheet.create({
  view: {
    alignItems: 'center', 
    backgroundColor: "#791424",
    padding: 20,
  },
  text: {
    fontSize: 30,
    fontWeight: "bold",
    color: "#F0F0F0"
  }
})


//================================================================================================
//======================================= getData ================================================
//=================================================================c===============================

const getData =  () => {

    fetch("https://192.168.4.1:443/hello") 
    .then(response => response.text())
    .then(data => console.log(data))
    //.catch(error => { });
}

//================================================================================================
//=================================== getWiFiSSID ================================================
//================================================================================================
const getWiFiSSID = () => {
  try {
  wifi.getSSID((ssid) => {
    console.log(ssid);
  });  
  }
  catch (err) {
    console.warn(err)
  }
}

//================================================================================================
//=================================== getWiFiBSSID ================================================
//================================================================================================
const getWiFiBSSID = () => {
  try {
  wifi.getBSSID((bssid) => {
    console.log(bssid);
  });  
  }
  catch (err) {
    console.warn(err)
  }
}

//================================================================================================
//=================================== enableWiFi =================================================
//================================================================================================
const enableWiFi = () => {
  wifi.setEnabled(true);
}

//================================================================================================
//=================================== disableWiFi ================================================
//================================================================================================
const disableWiFi = () => {
  wifi.setEnabled(false);
}

//================================================================================================
//=================================== checkConnected =============================================
//================================================================================================
const checkConnected = () => {
  wifi.connectionStatus((isConnected) => {
    if (isConnected) {
        console.log("is connected");
      } else {
        console.log("is not connected");
    }
  });
}

//================================================================================================
//============================================ getNetworkIP ======================================
//================================================================================================
const getNetworkIP = () => {
  try {
    wifi.getIP((ip) => {
      console.log(ip);
    }); 
  }
  catch (err) {
    console.warn(err)
  }
}

//================================================================================================
//============================================ getNetworkIP ======================================
//================================================================================================
const connectNetwork = () => {
  try {
    wifi.findAndConnect("ESP32", "Password", (found) => {
      if (found) {
        console.log("wifi is in range");
      } else {
        console.log("wifi is not in range");
      }
    }); 
  }
  catch (err) {
    console.warn(err)
  }
}

//================================================================================================
//==================================== disconnectNetwork =========================================
//================================================================================================
const disconnectNetwork =  () => {
  wifi.disconnect();
}

//================================================================================================
//=================================== loadSSIDList ===============================================
//================================================================================================
const loadSSIDList = () => {
/*
wifiStringList is a stringified JSONArray with the following fields for each scanned wifi
{
  "SSID": "The network name",
  "BSSID": "The address of the access point",
  "capabilities": "Describes the authentication, key management, and encryption schemes supported by the access point"
  "frequency":"The primary 20 MHz frequency (in MHz) of the channel over which the client is communicating with the access point",
  "level":"The detected signal level in dBm, also known as the RSSI. (Remember its a negative value)",
  "timestamp":"Timestamp in microseconds (since boot) when this result was last seen"
}
*/
wifi.loadWifiList((wifiStringList) => {
  var wifiArray = JSON.parse(wifiStringList);
    console.log(wifiArray);
  },
  (error) => {
    console.log(error);
  }
);
}

//================================================================================================-
//=================================== App Class ==================================================
//================================================================================================
class App extends Component {

    componentDidMount = () => {

      getData();
  
  }

  render () {
    try {
      const granted = PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION)
    } catch (err) {
      console.warn(err)
    }

    return (
        <View style={styles.view}>
          <Text style={styles.text}>My WiFi App</Text>
          <Button title="Get SSID" onPress={getWiFiSSID} />
          <Button title="Get BSSID" onPress={getWiFiBSSID} />
          <Button title="Enable WiFi" onPress={enableWiFi} />
          <Button title="Disable WiFi" onPress={disableWiFi} />
          <Button title="List SSIDs" onPress={loadSSIDList} />
          <Button title="Check Connection" onPress={checkConnected} />
          <Button title="Get Network IP" onPress={getNetworkIP} />
          <Button title="Connect Network" onPress={connectNetwork} />
          <Button title="Disconnect Network" onPress={disconnectNetwork} />
          <Button title="Get Data" onPress={getData} />
        </View>
    )
  }
}

export default App;
ESP32 Main.c (AP and HTTPS Server)

Code: Select all

#include <esp_wifi.h>
#include <esp_event.h>
#include <esp_log.h>
#include <esp_system.h>
#include <nvs_flash.h>
#include <sys/param.h>
#include "esp_netif.h"
#include "esp_eth.h"
#include "protocol_examples_common.h"

#include <esp_https_server.h>

#define EXAMPLE_ESP_WIFI_SSID      "ESP32"//"ESP32"
#define EXAMPLE_ESP_WIFI_PASS      "password"//"password"
#define EXAMPLE_ESP_WIFI_CHANNEL   1 //CONFIG_ESP_WIFI_CHANNEL
#define EXAMPLE_MAX_STA_CONN       4 //CONFIG_ESP_MAX_STA_CONN

static const char *TAG = "example";


/* An HTTP GET handler */
static esp_err_t root_get_handler(httpd_req_t *req)
{
    httpd_resp_set_type(req, "text/html");
    httpd_resp_send(req, "<h1>Hello Secure World!</h1>", HTTPD_RESP_USE_STRLEN);

    return ESP_OK;
}

static const httpd_uri_t root = {
    .uri       = "/hello",
    .method    = HTTP_GET,
    .handler   = root_get_handler
};


static httpd_handle_t start_webserver(void)
{
    httpd_handle_t server = NULL;

    // Start the httpd server
    ESP_LOGI(TAG, "Starting server");

    httpd_ssl_config_t conf = HTTPD_SSL_CONFIG_DEFAULT();

    extern const unsigned char cacert_pem_start[] asm("_binary_cacert_pem_start");
    extern const unsigned char cacert_pem_end[]   asm("_binary_cacert_pem_end");
    conf.cacert_pem = cacert_pem_start;
    conf.cacert_len = cacert_pem_end - cacert_pem_start;

    extern const unsigned char prvtkey_pem_start[] asm("_binary_prvtkey_pem_start");
    extern const unsigned char prvtkey_pem_end[]   asm("_binary_prvtkey_pem_end");
    conf.prvtkey_pem = prvtkey_pem_start;
    conf.prvtkey_len = prvtkey_pem_end - prvtkey_pem_start;

    esp_err_t ret = httpd_ssl_start(&server, &conf);
    if (ESP_OK != ret) {
        ESP_LOGI(TAG, "Error starting server!");
        return NULL;
    }

    // Set URI handlers
    ESP_LOGI(TAG, "Registering URI handlers");
    httpd_register_uri_handler(server, &root);
    return server;
}

static void stop_webserver(httpd_handle_t server)
{
    // Stop the httpd server
    httpd_ssl_stop(server);
}

static void disconnect_handler(void* arg, esp_event_base_t event_base,
                               int32_t event_id, void* event_data)
{
    httpd_handle_t* server = (httpd_handle_t*) arg;
    if (*server) {
        stop_webserver(*server);
        *server = NULL;
    }
}

static void connect_handler(void* arg, esp_event_base_t event_base,
                            int32_t event_id, void* event_data)
{
    httpd_handle_t* server = (httpd_handle_t*) arg;
    if (*server == NULL) {
        *server = start_webserver();
    }
}

//############################################################################
//############################################################################
//############################################################################

static void wifi_event_handler(void* arg, esp_event_base_t event_base,
                                    int32_t event_id, void* event_data)
{
    if (event_id == WIFI_EVENT_AP_STACONNECTED) {
        wifi_event_ap_staconnected_t* event = (wifi_event_ap_staconnected_t*) event_data;
        ESP_LOGI(TAG, "station "MACSTR" join, AID=%d",
                 MAC2STR(event->mac), event->aid);
    } else if (event_id == WIFI_EVENT_AP_STADISCONNECTED) {
        wifi_event_ap_stadisconnected_t* event = (wifi_event_ap_stadisconnected_t*) event_data;
        ESP_LOGI(TAG, "station "MACSTR" leave, AID=%d",
                 MAC2STR(event->mac), event->aid);
    }
}


void wifi_init_softap(void)
{
    ESP_ERROR_CHECK(esp_netif_init());
    ESP_ERROR_CHECK(esp_event_loop_create_default());
    esp_netif_create_default_wifi_ap();

    wifi_init_config_t cfg = WIFI_INIT_CONFIG_DEFAULT();
    ESP_ERROR_CHECK(esp_wifi_init(&cfg));

    ESP_ERROR_CHECK(esp_event_handler_instance_register(WIFI_EVENT,
                                                        ESP_EVENT_ANY_ID,
                                                        &wifi_event_handler,
                                                        NULL,
                                                        NULL));

    wifi_config_t wifi_config = {
        .ap = {
            .ssid = EXAMPLE_ESP_WIFI_SSID,
            .ssid_len = strlen(EXAMPLE_ESP_WIFI_SSID),
            .channel = EXAMPLE_ESP_WIFI_CHANNEL,
            .password = EXAMPLE_ESP_WIFI_PASS,
            .max_connection = EXAMPLE_MAX_STA_CONN,
            .authmode = WIFI_AUTH_WPA_WPA2_PSK
        },
    };
    if (strlen(EXAMPLE_ESP_WIFI_PASS) == 0) {
        wifi_config.ap.authmode = WIFI_AUTH_OPEN;
    }

    ESP_ERROR_CHECK(esp_wifi_set_mode(WIFI_MODE_AP));
    ESP_ERROR_CHECK(esp_wifi_set_config(WIFI_IF_AP, &wifi_config));
    ESP_ERROR_CHECK(esp_wifi_start());

    ESP_LOGI(TAG, "wifi_init_softap completed. SSID:%s password:%s channel:%d",
             EXAMPLE_ESP_WIFI_SSID, EXAMPLE_ESP_WIFI_PASS, EXAMPLE_ESP_WIFI_CHANNEL);
}


//############################################################################
//############################################################################
//############################################################################
void app_main(void)
{
    static httpd_handle_t server = NULL;

    ESP_ERROR_CHECK(nvs_flash_init());
    ESP_ERROR_CHECK(esp_netif_init());
    //ESP_ERROR_CHECK(esp_event_loop_create_default());

    wifi_init_softap(); //added 
    start_webserver();//added 

    /* Register event handlers to start server when Wi-Fi or Ethernet is connected,
     * and stop server when disconnection happens.
     */

// #ifdef CONFIG_EXAMPLE_CONNECT_WIFI
//     ESP_ERROR_CHECK(esp_event_handler_register(IP_EVENT, IP_EVENT_STA_GOT_IP, &connect_handler, &server));
//     ESP_ERROR_CHECK(esp_event_handler_register(WIFI_EVENT, WIFI_EVENT_STA_DISCONNECTED, &disconnect_handler, &server));
// #endif // CONFIG_EXAMPLE_CONNECT_WIFI
// #ifdef CONFIG_EXAMPLE_CONNECT_ETHERNET
//     ESP_ERROR_CHECK(esp_event_handler_register(IP_EVENT, IP_EVENT_ETH_GOT_IP, &connect_handler, &server));
//     ESP_ERROR_CHECK(esp_event_handler_register(ETH_EVENT, ETHERNET_EVENT_DISCONNECTED, &disconnect_handler, &server));
// #endif // CONFIG_EXAMPLE_CONNECT_ETHERNET

    /* This helper function configures Wi-Fi or Ethernet, as selected in menuconfig.
     * Read "Establishing Wi-Fi or Ethernet Connection" section in
     * examples/protocols/README.md for more information about this function.
     */
    //ESP_ERROR_CHECK(example_connect());
}


Who is online

Users browsing this forum: Baidu [Spider] and 94 guests