AvantMaker.com

ESP32 WebServer Library – urlDecode()

Home / References / ESP32 Library / WebServer Library

Description

The urlDecode() method decodes a URL-encoded string into plain text. This static utility method converts percent-encoded characters (like %20 for space) and plus signs (+) back to their original characters, making it essential for processing URL parameters, form data, and query strings received from HTTP requests. The method handles standard URL encoding where special characters are represented as percent signs followed by their hexadecimal ASCII values. This guide is part of the Comprehensive Guide to the ESP32 Arduino Core Library, accessible on AvantMaker.com.

Syntax and Usage

The urlDecode() method can be used in one way:

  • Decoding URL-encoded String: WebServer::urlDecode(encoded_string) – Decodes a URL-encoded string and returns the decoded plain text version.

For practical applications and examples of this method, please consult the “Example Code” section on this page. This section provides comprehensive guidance to help you better understand and apply the method effectively.

Arguments

  • text (const String&): The URL-encoded string that needs to be decoded. This string may contain percent-encoded characters (like %20, %21, etc.) and plus signs (+) that represent spaces. The method will process all encoded characters and convert them back to their original form.

This page is part of the Comprehensive Guide to the ESP32 Arduino Core Library, accessible on AvantMaker.com.

Return Value

Returns a String containing the decoded plain text. All percent-encoded characters are converted to their corresponding ASCII characters, plus signs (+) are converted to spaces, and regular ASCII characters remain unchanged.

Example Codes

URL Parameter Decoding

This example demonstrates how to use urlDecode method to decode URL-encoded parameters received from HTTP requests, including form submissions and query strings.

How to use this example:

1. Replace “your_wifi_ssid” and “your_wifi_password” with your actual WiFi credentials.
2. Upload the code to your ESP32.
3. Open the Serial Monitor to see the IP address and decoded output.
4. Access the root page to see a form for testing URL encoding/decoding.
5. Try submitting the form with special characters like spaces, symbols, and non-ASCII characters.
6. Visit “/test” endpoint with URL parameters to see automatic decoding in action.
7. Check the Serial Monitor to see the before and after decoding comparison.

/*
 * Author: Avant Maker
 * Date: June 17, 2025
 * Version: 1.0
 * License: MIT 
 * 
 * Description: 
 * This example demonstrates how to use removeMiddleware method to dynamically
 * add and remove middleware based on application state, such as enabling/disabling
 * authentication during runtime.
 *
 * How to use this example:
 * 1. Replace "your_wifi_ssid" and "your_wifi_password" with your actual
 * WiFi credentials.
 * 2. Upload the code to your ESP32.
 * 3. Open the Serial Monitor to see the logging output and IP address.
 * 4. Access "/public" endpoint to see the response with logging middleware active.
 * 5. Access "/disable-auth" to remove the authentication middleware from the
 * "/protected" route.
 * 6. Access "/enable-auth" to add the authentication middleware back to the
 * "/protected" route.
 * 7. Try accessing "/protected" before and after toggling authentication to
 * see the difference.
 *
 * Code Source:
 * This example code is sourced from the Comprehensive Guide
 * to the ESP32 Arduino Core Library, accessible on AvantMaker.com.
 * For additional code examples and in-depth documentation related to
 * the ESP32 Arduino Core Library, please visit:
 *
 * https://avantmaker.com/home/all-about-esp32-arduino-core-library/
 *
 * AvantMaker.com, your premier destination for all things
 * DIY, AI, IoT, Smart Home, and STEM projects. We are dedicated
 * to empowering makers, learners, and enthusiasts with
 * the resources they need to bring their nnovative ideas to life.
 */

#include <WiFi.h>
#include <WebServer.h>
#include <Middlewares.h>

const char* ssid = "your_wifi_ssid";
const char* password = "your_wifi_password";

WebServer server(80);

// Create middleware instances
LoggingMiddleware logger;
CorsMiddleware cors;
AuthenticationMiddleware auth;

// Keep track of middleware state
bool authEnabled = true;
bool corsEnabled = true;

void setup() {
    Serial.begin(115200);
    
    // Connect to WiFi
    WiFi.begin(ssid, password);
    while (WiFi.status() != WL_CONNECTED) {
        delay(1000);
        Serial.println("Connecting to WiFi...");
    }
    Serial.println("Connected to WiFi");
    Serial.print("IP address: ");
    Serial.println(WiFi.localIP());
    
    // Configure middleware
    logger.setOutput(Serial);
    
    cors.setOrigin("*");
    cors.setMethods("GET,POST,PUT,DELETE,OPTIONS");
    cors.setHeaders("Content-Type,Authorization");
    
    auth.setUsername("admin");
    auth.setPassword("password123");
    auth.setRealm("ESP32 Dynamic Auth");
    auth.setAuthMethod(BASIC_AUTH);
    
    // Add initial middleware to server
    server.addMiddleware(&logger);
    server.addMiddleware(&cors);
    
    // Public route - always accessible
    server.on("/public", []() {
        server.send(200, "text/html", 
                   "<h1>Public Page</h1>"
                   "<p>This page is always accessible</p>"
                   "<p><a href='/protected'>Try Protected Page</a></p>"
                   "<p><a href='/disable-auth'>Disable Auth</a> | "
                   "<a href='/enable-auth'>Enable Auth</a></p>"
                   "<p><a href='/disable-cors'>Disable CORS</a> | "
                   "<a href='/enable-cors'>Enable CORS</a></p>");
    });
    
    // Protected route - authentication can be toggled
    server.on("/protected", []() {
        server.send(200, "text/html", 
                   "<h1>Protected Page</h1>"
                   "<p>Authentication Status: " + String(authEnabled ? "Enabled" : "Disabled") + "</p>"
                   "<p>CORS Status: " + String(corsEnabled ? "Enabled" : "Disabled") + "</p>"
                   "<p><a href='/public'>Back to Public Page</a></p>");
    }).addMiddleware(&auth);
    
    // Route to disable authentication middleware
    server.on("/disable-auth", []() {
        if (authEnabled) {
            server.removeMiddleware(&auth);
            authEnabled = false;
            Serial.println("Authentication middleware removed");
        }
        server.send(200, "text/html", 
                   "<h1>Authentication Disabled</h1>"
                   "<p>Authentication middleware has been removed</p>"
                   "<p><a href='/protected'>Try Protected Page (No Auth)</a></p>"
                   "<p><a href='/public'>Back to Public Page</a></p>");
    });
    
    // Route to enable authentication middleware
    server.on("/enable-auth", []() {
        if (!authEnabled) {
            server.addMiddleware(&auth);
            authEnabled = true;
            Serial.println("Authentication middleware added");
        }
        server.send(200, "text/html", 
                   "<h1>Authentication Enabled</h1>"
                   "<p>Authentication middleware has been added</p>"
                   "<p><a href='/protected'>Try Protected Page (With Auth)</a></p>"
                   "<p><a href='/public'>Back to Public Page</a></p>");
    });
    
    // Route to disable CORS middleware
    server.on("/disable-cors", []() {
        if (corsEnabled) {
            server.removeMiddleware(&cors);
            corsEnabled = false;
            Serial.println("CORS middleware removed");
        }
        server.send(200, "text/html", 
                   "<h1>CORS Disabled</h1>"
                   "<p>CORS middleware has been removed</p>"
                   "<p><a href='/protected'>Try Protected Page</a></p>"
                   "<p><a href='/public'>Back to Public Page</a></p>");
    });
    
    // Route to enable CORS middleware
    server.on("/enable-cors", []() {
        if (!corsEnabled) {
            server.addMiddleware(&cors);
            corsEnabled = true;
            Serial.println("CORS middleware added");
        }
        server.send(200, "text/html", 
                   "<h1>CORS Enabled</h1>"
                   "<p>CORS middleware has been added</p>"
                   "<p><a href='/protected'>Try Protected Page</a></p>"
                   "<p><a href='/public'>Back to Public Page</a></p>");
    });
    
    // Status route to check current middleware state
    server.on("/status", []() {
        server.send(200, "application/json", 
                   "{\"authentication\":" + String(authEnabled ? "true" : "false") + 
                   ",\"cors\":" + String(corsEnabled ? "true" : "false") + 
                   ",\"message\":\"Middleware status retrieved successfully\"}");
    });
    
    server.begin();
    Serial.println("HTTP server started");
    Serial.println("Visit /public to start exploring middleware management");
}

void loop() {
    server.handleClient();
}

This page is part of the Comprehensive Guide to the ESP32 Arduino Core Library, accessible on AvantMaker.com.

ESP32 Library Index

ESP32 Arduino Core Library

FAQ

Ready to experiment and explore more about ESP32? Visit our website’s All About ESP32 Resources Hub, packed with tutorials, guides, and tools to inspire your maker journey. Experiment, explore, and elevate your skills with everything you need to master this powerful microcontroller platform!

error: Content is protected !!