WebAssembly发送无效JSON请求体，Actix Web无法反序列化

开发者阿泽

2026-7-27

问题解决：WebAssembly发送POST请求无法被Actix Web反序列化

问题根源

你用serde_wasm_bindgen::to_value(&req)得到的是JS对象（JsValue类型），直接传给fetch的body参数时，浏览器会自动调用对象的toString()方法，最终发送的请求体内容是"[object Object]"——这根本不是合法的JSON格式，所以Actix Web服务器无法反序列化，抛出expected value的错误。而curl发送的是标准JSON字符串，所以能正常处理。

修复步骤

1. 将JS对象转为JSON字符串

需要借助js_sys::JSON::stringify把serde_wasm_bindgen生成的JS对象转换成标准JSON字符串，再作为请求体发送。

2. 确保请求头正确设置Content-Type

必须在请求头里明确指定Content-Type: application/json，告诉服务器接收的是JSON格式数据。

修改后的Wasm代码

use js_sys::JSON;
use wasm_bindgen::JsValue;
use web_sys::{Headers, RequestInit, Window};

// 假设你已经定义了req变量和ok回调函数
let window = web_sys::window().unwrap();

// 1. 设置请求头
let headers = Headers::new().unwrap();
headers.append("Content-Type", "application/json").unwrap();

// 2. 序列化请求体：Rust结构体 → JS对象 → JSON字符串
let req_js_value = serde_wasm_bindgen::to_value(&req).unwrap();
let json_body_str = JSON::stringify(&req_js_value).unwrap();
let request_body = JsValue::from_str(&json_body_str);

// 3. 发送请求
let _ = window
    .fetch_with_str_and_init(
        "/api",
        &RequestInit::new()
            .method("POST")
            .headers(&headers)
            .body(Some(&request_body))
    )
    .then(&ok);