json文件被CORS阻止[重复]答案

【问题标题】：json file blocked by CORS [duplicate]json文件被CORS阻止[重复]
【发布时间】：2021-04-18 23:10:33
【问题描述】：

对于我的学校项目，我正在使用链接到 Raspberry pi 的硬件按钮，并让它根据按钮按下（用 Python 编码）给出真或假值。这保存在 Pi 上的本地 json 文件中，我使用 javascript 将值发送到本地网站。

问题是我在浏览器的控制台中收到此错误：

CORS 策略已阻止从源“null”访问“file:///home/pi/website/button-status.json”处的 XMLHttpRequest：跨源请求仅支持协议方案：http、数据, chrome, chrome-extension, chrome-untrusted, https.

我已经在我的笔记本电脑上测试了代码，它工作正常，只是在 Pi 上它给出了这个错误。我在 Pi 上使用 chromium 作为浏览器。

有人知道为什么会发生这种情况以及如何解决吗？提前致谢！

Python 代码：

import json
import RPi.GPIO as GPIO
from time import sleep

GPIO.setmode(GPIO.BCM)
GPIO.setup(17, GPIO.IN, pull_up_down=GPIO.PUD_UP)

waar = 1
nWaar = 0
button_status = False

path = "/home/pi/website"

def save_button_status():
    with open(path + "/button-status.json", "w") as f:
        json.dump({'status': button_status}, f)

while True:
    input_state = GPIO.input(17)

    if input_state == False :
        if waar == 1:
            print('Button Press True')
            button_status = True
            save_button_status()
            waar = 0
            nWaar = 1
            sleep(5)



    if input_state == True:
        if nWaar == 1:
            print('Button Press False')
            button_status = False
            save_button_status()
            waar = 1
            nWaar = 0

Javascript：

function get(url, success) {
console.log('hoi');
    //--- Get JSON data at the given URL and call success if successful
    const request = new XMLHttpRequest();
    request.open("GET", url, true);
    request.onreadystatechange = function() {
        if (request.readyState === 4 && request.status === 200) {
            success(JSON.parse(request.responseText));
        }
    };
    request.send();
}

function receiveStatus(response) {
    if (response.status !== status) {  // only do something if status has changed
        status = response.status;
        console.log('button status is now', status);
    }
}
let status;
let interval = setInterval(() => get("button-status.json", receiveStatus), 2000);

【问题讨论】：

标签： javascript python json cors

【解决方案1】：

你应该看看我找到的这篇 Medium 文章，我认为它应该有助于解决你的问题并更好地理解 CORS here

它的意思是您只需要调整请求中的标头以允许来自特定位置的特定响应。它使用 URL，但我认为如果您在本地网络上，直接 IP 地址应该没问题。如果您在远离网络的地方工作，则必须设置一些端口转发，并且如果这是一个学校项目，可能对他们可能制定的任何网络法规都很严格。

【讨论】：