从 esp javascript 获取时出现 CORS 错误

Question

我设置了一个 ESP32 网络服务器，它以 .json 格式为我提供传感器值。在控制台中我得到错误：

错误：Cross-Origin 请求被阻止：同源策略不允许读取位于 http://10.0.0.40/sensor 的远程资源。（原因：缺少 CORS header ‘Access-Control-Allow-Origin’）。

错误：未捕获（承诺）类型错误：尝试获取资源时出现网络错误。

我需要更改什么？

// JavaScript source code
fetch('http://10.0.0.40/sensor')
    .then(response => response.json())
    .then(data => {

        var unit0 = data['0']['unit'];
        var unit1 = data['1']['unit'];

        var temperature = data['0']['value'];
        var humidity = data['1']['value'];

        document.getElementById("sensortemperature").innerHTML = temperature + unit0;
        document.getElementById("sensorhumidity").innerHTML = humidity + unit1;

        console.log(temperature + unit0);

    })

Answer 1

错误消息表明 CORS 错误：

Error: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://10.0.0.40/sensor. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

ESP32 网络服务器需要为 browser/client 请求您的传感器数据启用 CORS。

您的评论表明您正在使用 ESP WebServer 库。这提供了一个 enableCORS() 方法（参见 https://github.com/espressif/arduino-esp32/blob/master/libraries/WebServer/src/WebServer.h#L127）。

因此您可以在创建网络服务器后启用 CORS，例如：

WebServer server();
server.enableCORS(true);

从 esp javascript 获取时出现 CORS 错误

get CORS Error when fetch from esp javascript

javascript

arduino

esp32