CORS 问题 - 从原点 *** 获取 *** 的访问权限已被 CORS 策略阻止：无“Access-Control-Allow-Origin” - 将请求发送到 Firebase

Question

我遇到 CORS 问题，我正在发送更新数据的 put 请求 - 使用 React 发布到 Firebase：

const submitHandler = e => {
        e.preventDefault();
        const err = validate();
        if(err === false) {
            setFormData(formData)
            const requestOptions = {
                method: 'PUT',
                headers: {'Content-Type': 'application/json'},
                body: JSON.stringify({
                    title: title,
                    url: url,
                    author: author,
                    description: description})
            };
            fetch(`https://blog-d8b04-default-rtdb.europe-west1.firebasedatabase.app/posts/${postName}`, requestOptions)
                .then(response => {response.json(); console.log(response)})
                .then(data => console.log(data));
            setFormData(initialState);
        }
    }

我在控制台中收到此通知错误

Access to fetch at 'https://blog-d8b04-default-rtdb.europe-west1.firebasedatabase.app/posts/-MX1-Df4t59Y3DnyWUzB' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.
EditPost.js:58 PUT https://blog-d8b04-default-rtdb.europe-west1.firebasedatabase.app/posts/-MX1-Df4t59Y3DnyWUzB net::ERR_FAILED

通过帖子请求 - 添加新帖子一切正常。有人解决这个问题吗？

Answer 1

如果通过 HTTPS 访问数据库，则需要通过附加.json到数据库 URL 来访问数据的 JSON 版本，如下所示：

fetch(`https://blog-d8b04-default-rtdb.europe-west1.firebasedatabase.app/posts/${postName}.json`, requestOptions)
  .then(response => {response.json(); console.log(response)})
  .then(data => console.log(data));

您还应该更新数据库规则，因为您的数据库是世界可读和可写的。