仅在生产时出现 Flask 错误请求

Question

我最近为我的网站实现了一个报告系统，我让它在我的笔记本电脑上运行，但是当我将它部署到 vercel 中时，它在使用 fetch 时会给出“错误请求”。我不认为我做错了什么？

@app.route("/vulnerability/get",methods=["POST"])
def report_get():
  return get_report(request.json.get("id"))

这是发出获取请求的代码：

/report/manage/[slug]/+page.ts

import { serverURL } from '../../../../serverContactor';

export async function load({ params,fetch }){
    let code=params.slug;
    let body = {"id":code as string};
    const dataRequest = await fetch(`${serverURL}/vulnerability/get`,{
        method:"POST",
        headers:{"Content-Type":"application/json"},
        body: JSON.stringify(body)
    });
    let data;
    try {
        data = await dataRequest.json();
    } catch(error) {
        return {"Error":true,"name":error as string,"response":dataRequest, "code":code as string}
    }
    return data;
}

这会导致应用程序记录以下内容：

{
  Error: true,
  name: SyntaxError: Unexpected token '<', "<!doctype "... is not valid JSON
      at JSON.parse (<anonymous>)
      at Proxy.<anonymous> (file:///var/task/.svelte-kit/output/server/index.js:693:25)
      at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
      at async load (file:///var/task/.svelte-kit/output/server/entries/pages/report/manage/_slug_/_page.ts.js:14:12)
      at async load_data (file:///var/task/.svelte-kit/output/server/index.js:600:18)
      at async file:///var/task/.svelte-kit/output/server/index.js:2085:18,
  response: Response {
    status: 400,
    statusText: 'Bad Request',
    headers: Headers {
      'access-control-allow-credentials': 'true',
      'access-control-allow-headers': 'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version',
      'access-control-allow-methods': 'GET,OPTIONS,PATCH,DELETE,POST,PUT',
      'access-control-allow-origin': 'https://frii-site-frontend-ezejbxuv9-ctih1s-projects.vercel.app',
      'cache-control': 'public, max-age=0, must-revalidate',
      connection: 'keep-alive',
      'content-length': '167',
      'content-type': 'text/html; charset=utf-8',
      date: 'Wed, 10 Jul 2024 07:06:09 GMT',
      server: 'Vercel',
      'strict-transport-security': 'max-age=63072000',
      vary: 'Origin',
      'x-vercel-cache': 'MISS',
      'x-vercel-id': 'arn1:sfo1:sfo1:iad1::iad1::kf868-1720595169898-50deaf4d69a8'
    },
    body: ReadableStream { locked: true, state: 'closed', supportsBYOB: true },
    bodyUsed: true,
    ok: false,
    redirected: false,
    type: 'basic',
    url: 'https://server.frii.site/vulnerability/get'
  },
  code: 'WYC6EG9oYpNClQYtUdBSFovH'
}

使用 insomnia 效果很好，但似乎只有在 fetch 时才会发生。

如果前端在本地运行，则应用程序可以正常工作，后端托管的位置不会产生任何影响。 我还在另一个页面中使用相同的端点，效果很好。

/report/track/+page.ts

import { serverURL } from '../../../serverContactor';

export async function load({ url,fetch }) {
    let code:string|null=url.searchParams.get("code");
    let body = {
        "id":code
    };
    const dataRequest = await fetch(`${serverURL}/vulnerability/get`,{
        method:"POST",
        headers:{"Content-Type":"application/json"},
        body: JSON.stringify(body)
    });
    const data = await dataRequest.json();
    return data;
}  

但以下代码适用于

playcode.io

async function load(params:string,serverURL:string) {
    let code=params;
    let body = {"id":code as string};

    const dataRequest = await fetch(`${serverURL}/vulnerability/get`,{
        method:"POST",
        headers:{"Content-Type":"application/json"},
        body: JSON.stringify(body)
    });
    let data;
        dataRequest.text().then(text=>{
            console.log(`Headers: ${dataRequest.headers} body: ${dataRequest.body} body used: ${dataRequest.bodyUsed} text: ${text} code:${code}`);
        });
    return data;
}

P.S：我在前端使用 SvelteKit

Answer 1

我发现了一个非常hacky的修复方法

在发出请求之前获取索引端点似乎可以使其工作？我不知道为什么会这样，我也不在乎。

这是一个例子：

import { serverURL } from '../../../serverContactor';

export async function load({ url }) {
    let code:string|null=url.searchParams.get("code");
    await fetch(`${serverURL}`).then(response=>{console.log(response.status)});
    const dataRequest = await fetch(`${serverURL}/vulnerability/get`,{
        method:"POST",
        headers:{"Content-Type":"application/json"},
        body: JSON.stringify({"id":code})
    });
    const data = await dataRequest.json();
    return data;
}