{"id":2360,"date":"2017-02-16T19:53:54","date_gmt":"2017-02-17T03:53:54","guid":{"rendered":"http:\/\/visualgdb.com\/w\/?p=2360"},"modified":"2017-05-26T10:31:58","modified_gmt":"2017-05-26T17:31:58","slug":"creating-a-basic-http-server-with-esp32","status":"publish","type":"post","link":"https:\/\/visualgdb.com\/tutorials\/esp32\/http\/","title":{"rendered":"Creating a Basic HTTP Server with ESP32"},"content":{"rendered":"

This tutorial shows how to create a basic “HTTP Server” application for the ESP32 chip and debug it with VisualGDB. We will use the Sparkfun ESP32 Thing<\/a> board with the Olimex ARM-USB-OCD-H JTAG programmer to program and debug the board.<\/p>\n

Before you begin, install VisualGDB 5.2 or later. We also recommend following the basic ESP32 tutorial<\/a> to check that the JTAG connection with your device is working properly.<\/p>\n

    \n
  1. Start Visual Studio and open the VisualGDB Embedded Project Wizard:\"01-demoprjname\"<\/a><\/li>\n
  2. Proceed with the default settings on the first page:\"02-msbuild\"<\/a><\/li>\n
  3. Select the ESP32 toolchain and the regular ESP32 device:\"03-esp32\"<\/a><\/li>\n
  4. On the Sample Selection page select the “HTTP Server” sample and optionally change the subnet number:\"04-server\"<\/a><\/li>\n
  5. Finally select the interface you want to use for debugging. If you are using one of the Olimex JTAG debuggers, enable the “set explicit speed” checkbox:\"05-debug\"<\/a><\/li>\n
  6. Press “Finish” to generate your project. Before you can build it, open the Project Properties and change the optimization level for the debug configuration from -O0 to -Og as the default -O0 level prevents the ESP-IDF code from working correctly:\"06-optimize\"<\/a><\/li>\n
  7. The project generated by VisualGDB does 3 vital steps. First it enables the DHCP server so that the devices connecting to its Wi-Fi network will automatically get assigned IP addresses:\n
    \u00a0\u00a0\u00a0 tcpip_adapter_init();\r\n\u00a0\u00a0\u00a0 tcpip_adapter_ip_info_t info = { 0, };\r\n\u00a0\u00a0\u00a0 IP4_ADDR(&info.ip, 192, 168, 123, 1);\r\n\u00a0\u00a0\u00a0 IP4_ADDR(&info.gw, 192, 168, 123, 1);\r\n\u00a0\u00a0\u00a0 IP4_ADDR(&info.netmask, 255, 255, 255, 0);\r\n\u00a0\u00a0\u00a0 ESP_ERROR_CHECK(tcpip_adapter_dhcps_stop(TCPIP_ADAPTER_IF_AP));\r\n\u00a0\u00a0\u00a0 ESP_ERROR_CHECK(tcpip_adapter_set_ip_info(TCPIP_ADAPTER_IF_AP, &info));\r\n\u00a0\u00a0\u00a0 ESP_ERROR_CHECK(tcpip_adapter_dhcps_start(TCPIP_ADAPTER_IF_AP));<\/pre>\n
    Then it starts the Wi-Fi hardware in the Access Point mode:<\/p>\n
    \u00a0\u00a0\u00a0 wifi_config_t wifi_config;\r\n\u00a0\u00a0\u00a0 memset(&wifi_config, 0, sizeof(wifi_config));\r\n\u00a0\u00a0\u00a0 strcpy(wifi_config.ap.ssid, \"ESP32_VisualGDB\");\r\n\u00a0\u00a0\u00a0 wifi_config.ap.ssid_len = strlen(wifi_config.ap.ssid);\r\n\u00a0\u00a0\u00a0 wifi_config.ap.max_connection = 4;\r\n\u00a0\u00a0 \u00a0\r\n\u00a0\u00a0\u00a0 ESP_ERROR_CHECK(esp_wifi_set_mode(WIFI_MODE_AP));\r\n\u00a0\u00a0\u00a0 ESP_ERROR_CHECK(esp_wifi_set_config(WIFI_IF_AP, &wifi_config));\r\n\u00a0\u00a0\u00a0 ESP_ERROR_CHECK(esp_wifi_start());<\/pre>\n
    Finally it creates a thread that listens for connections on port 80 and responds to each one. Note that the last part uses the regular socket functions like bind()<\/strong> and accept()<\/strong> to work with the sockets:<\/p>\n
    void ServerTask(void *pvParameters)\r\n{\r\n\u00a0\u00a0 \u00a0struct sockaddr_in server_addr, client_addr;\r\n\u00a0\u00a0\u00a0 int server_sock;\r\n\u00a0\u00a0\u00a0 socklen_t sin_size = sizeof(client_addr);\r\n\u00a0\u00a0\u00a0 bzero(&server_addr, sizeof(struct sockaddr_in));\r\n\u00a0\u00a0\u00a0 server_addr.sin_family = AF_INET;\r\n\u00a0\u00a0\u00a0 server_addr.sin_addr.s_addr = INADDR_ANY;\r\n\u00a0\u00a0\u00a0 server_addr.sin_port = htons(80);\r\n\r\n\u00a0\u00a0\u00a0 server_sock = socket(AF_INET, SOCK_STREAM, 0);\r\n\u00a0\u00a0\u00a0 bind(server_sock, (struct sockaddr *)(&server_addr), sizeof(struct sockaddr));\r\n\u00a0\u00a0\u00a0 listen(server_sock, 5);\r\n\u00a0\u00a0\u00a0 for (;;) \r\n\u00a0\u00a0\u00a0 {\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 int client_sock = accept(server_sock, (struct sockaddr *) &client_addr, &sin_size);\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\/\/...\r\n\u00a0\u00a0 \u00a0}\r\n}<\/pre>\n<\/li>\n
  8. The project is based on the open-source ESP-IDF<\/a> framework, so you can use features like Go-to-definition and Code Map to quickly explore how different functions interact:\"codemap\"<\/a><\/li>\n
  9. Build the project via Build->Build Solution:\"07-build\"<\/a><\/li>\n
  10. Now press F5 to automatically program the SPI FLASH and begin debugging your project:\"08-load\"<\/a><\/li>\n
  11. Once the project is running, connect to the ESP32_VisualGDB Wi-Fi network from your device:\"09-wifi\"<\/a><\/li>\n
  12. Once the connection is successful, open 192.168.<subnet>.1<\/strong> in your browser:\"10-page\"<\/a><\/li>\n
  13. Set a breakpoint after the call to read() and refresh your browser page. The breakpoint will hit and you will see the HTTP request sent your the browser to the device:\"11-watch\"<\/a>Note that the ESP32 tools have several known limitations. Please refer to this post<\/a> for a discussion on known issues and workarounds.<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"
    This tutorial shows how to create a basic “HTTP Server” application for the ESP32 chip and debug it with VisualGDB.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[142],"tags":[138,101,102],"_links":{"self":[{"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/posts\/2360"}],"collection":[{"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/comments?post=2360"}],"version-history":[{"count":1,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/posts\/2360\/revisions"}],"predecessor-version":[{"id":2373,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/posts\/2360\/revisions\/2373"}],"wp:attachment":[{"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/media?parent=2360"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/categories?post=2360"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/tags?post=2360"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}