时间戳

首页 > 解决方案 > Firebase 函数发送后无法设置标头

javascript - Firebase 函数发送后无法设置标头

问题描述

我有一个 Firebase 函数，我无法从我的 React.js 网络应用程序中查询，但通过 Postman 没有问题。

当我尝试通过网络应用程序发出请求时，我的 Firebase 控制台中出现以下错误：

错误：发送后无法设置标头。

at validateHeader (_http_outgoing.js:491:11)
at ServerResponse.setHeader (_http_outgoing.js:498:3)
at ServerResponse.header (/worker/node_modules/express/lib/response.js:767:10)
at ServerResponse.json (/worker/node_modules/express/lib/response.js:264:10)
at ServerResponse.send (/worker/node_modules/express/lib/response.js:158:21)
at exports.uploadImage.functions.https.onRequest (/srv/index.js:21:13)
at <anonymous>
at process._tickDomainCallback (internal/process/next_tick.js:229:7)

在网络应用程序上，我收到 500 错误响应，但没有返回任何数据。

我的请求是这样提出的：

const data = {
    image: 'image url here',
    options: {
        tags: 'document,doctor',
    }
};
axios.post('*** FUNCTION URL HERE***/uploadImage', data, {
    headers: {
        'Content-Type': 'application/json',
    },
})

但是，如果我通过Postman发出请求，那么我会收到 200 响应，其中包含我期望的数据。

这是我的函数/index.js文件的样子：

const functions = require('firebase-functions');
const admin = require('firebase-admin');
const cloudinary = require('cloudinary');
const cors = require('cors')({origin: true});

admin.initializeApp();

exports.uploadImage = functions.https.onRequest(async (req, res) => {
    cors(req, res, () => {});
    cloudinary.config({
        cloud_name: 'config here',
        api_key: 'config here',
        api_secret: 'config here',
    });

    try { 
        const data = Object.apply({folder: 'myortho'}, req.body.options);
        const response = await cloudinary.uploader.upload(req.body.image, data);
        return res.send(response);
    }catch(error) {
        return res.send(500, {message: 'Error uploading image', error});
    }
});

我看到了许多与我遇到的错误有关的问题，但其中许多问题都与人们的路由问题有关（这对我来说不是一个问题，因为这是一个云功能，而不是我自己的 Node.js 后端服务器）。

这也是一个我无法理解的错误，因为它是通过 Postman 成功的，但不是通过我的浏览器，所以我真的很困惑。

标签： javascriptnode.jsreactjsfirebasegoogle-cloud-functions

解决方案

当你使用 cors 时，你应该把你的代码放在你传递给它的回调函数中。您根本没有使用该回调，正在发生的事情是您的代码正在尝试发送两个响应。它应该更像这样：

exports.uploadImage = functions.https.onRequest(async (req, res) => {
    cors(req, res, () => {
        cloudinary.config({
            cloud_name: 'config here',
            api_key: 'config here',
            api_secret: 'config here',
        });

        try { 
            const data = Object.apply({folder: 'myortho'}, req.body.options);
            const response = await cloudinary.uploader.upload(req.body.image, data);
            return res.send(response);
        } catch(error) {
            return res.send(500, {message: 'Error uploading image', error});
        }
    });
});

推荐阅读