如何为手动调用的HTTPS云函数设置请求体？

问题背景 #

我有一个Cloud Functions的HTTPS onRequest 函数，通过req.body获取参数。目前用Cloud Task调用时，请求配置和函数代码如下，Cloud Task调用正常，但想从浏览器手动测试该函数，该如何设置请求体？

Cloud Task 请求配置 #

const task: tasks.protos.google.cloud.tasks.v2.ITask = {
    httpRequest: {
        httpMethod: 'POST',
        url,
        body: Buffer.from(JSON.stringify(payload)).toString('base64'),
        headers: {
            'Content-Type': 'application/json',
        },
    },
    scheduleTime: {
        seconds:  7200 + Date.now() / 1000
    }
}

Cloud Functions 函数代码 #

functions.https.onRequest((req, res) => {
     const payload = req.body as IScrapeTaskArguments;
});

手动测试方法 #

方法1：浏览器开发者工具发送POST请求 #

• 打开浏览器开发者工具（按F12或Ctrl+Shift+I），切换到「Network」面板
• 点击左上角「+」新建请求，或右键现有请求选择「Edit and Resend」
• 配置请求：
  • 请求方法选POST，填入你的Cloud Functions函数URL
  • 在「Headers」标签添加Content-Type: application/json
  • 切换到「Body」标签，选择「raw」格式，直接输入JSON格式的payload内容（无需做base64编码）
• 点击「Send」发送请求，在「Response」标签查看函数返回结果

方法2：浏览器控制台执行fetch命令 #

直接在浏览器控制台（开发者工具的「Console」面板）运行以下代码，替换成你的函数URL和实际payload参数：

fetch('你的Cloud Functions函数URL', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    // 替换为你的实际参数
    exampleKey: 'exampleValue',
    anotherKey: 456
  })
})
.then(res => res.text())
.then(data => console.log('响应结果:', data))
.catch(err => console.error('请求出错:', err));

关键注意点 #

• Cloud Functions的onRequest函数会自动解析Content-Type: application/json的请求体，不需要像Cloud Task那样对JSON做base64编码
• 如果你的函数需要身份验证，手动测试时要在请求头里添加对应的认证信息（比如Firebase的ID Token）

内容的提问来源于stack exchange，提问作者Christian