fetch readme

additional/env.js

@@ -685,13 +685,33 @@ let env = {
             const response = await fetch(urlStr);
             const result = await response.text();
 
-            console.log(result);
-
             const ptr = writeStringToWasm(result);
-            console.log(ptr);
 
             const { ExecuteFetchHandler} = window.crafter_webbuild_wasi.instance.exports;
-            console.log("callback");
+            ExecuteFetchHandler(handlerID, ptr);
+            WasmFree(ptr);
+
+        } catch (error) {
+            return 0;
+        }
+    },
+    fetchWithBody: async function(url, urlLenght, body, bodyLength, handlerID) {
+        try {
+            const urlStr = decoder.decode(new Int8Array(window.crafter_webbuild_wasi.instance.exports.memory.buffer, url, urlLenght));
+            const bodyStr = decoder.decode(new Int8Array(window.crafter_webbuild_wasi.instance.exports.memory.buffer, body, bodyLength));
+            
+            const response = await fetch(urlStr, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: bodyStr
+            });
+            const result = await response.text();
+
+            const ptr = writeStringToWasm(result);
+
+            const { ExecuteFetchHandler} = window.crafter_webbuild_wasi.instance.exports;
             ExecuteFetchHandler(handlerID, ptr);
             WasmFree(ptr);
 

examples/FetchExample/README.md

@@ -0,0 +1,42 @@
+# FetchExample
+
+This sample demonstrates how to use the Fetch API in Crafter.CppDOM to make HTTP requests.
+
+## Features
+
+- Shows how to perform HTTP GET requests
+- Demonstrates asynchronous response handling
+- Illustrates how to update the DOM with fetched data
+
+## Usage
+
+```cpp
+import Crafter.CppDOM;
+import std;
+using namespace Crafter::CppDOMBindings;
+
+int main(){
+    void* body = GetElementById("body");
+    SetInnerHTML(body, "<h1>Fetch Example</h1><p>Testing HTTP requests...</p>");
+    
+    Fetch("https://httpbin.org/get", [body](std::string result){
+        if (!result.empty()) {
+            SetInnerHTML(body, "<h1>Fetch Example</h1><p>Response: " + result + "</p>");
+        } else {
+            SetInnerHTML(body, "<h1>Fetch Example</h1><p>Failed to fetch data</p>");
+        }
+        FreeJs(body);
+    });
+}
+```
+
+## Building and Running
+
+```bash
+crafter-build build executable
+run.sh
+```
+
+Then navigate to `http://localhost:8080/` in your browser.
+
+If caddy is not installed, you can use your favorite static file server instead.

interfaces/Crafter.CppDOM-BindingsExport.cppm

@@ -217,9 +217,15 @@ extern "C" {
 
 export namespace Crafter::CppDOMBindings {
     __attribute__((import_module("env"), import_name("fetch"))) void Fetch(const char* url, std::int32_t urlLenght, std::int32_t handlerID);
+    __attribute__((import_module("env"), import_name("fetchWithBody"))) void FetchWithBody(const char* url, std::int32_t urlLenght, const char* body, std::int32_t bodyLength, std::int32_t handlerID);
     void Fetch(const std::string_view url, std::function<void(std::string)> callback) {
         std::int32_t id = fetchHandlerMaxId++;
         CppDOMBindings::fetchHandlers->insert({id, callback});
         Fetch(url.data(), url.size(), id);
     }
+    void Fetch(const std::string_view url, const std::string_view body, std::function<void(std::string)> callback) {
+        std::int32_t id = fetchHandlerMaxId++;
+        CppDOMBindings::fetchHandlers->insert({id, callback});
+        FetchWithBody(url.data(), url.size(), body.data(), body.size(), id);
+    }
 }