#Erro 405 on post to OpenAI with NextJS deployed on Vercel

24 messages · Page 1 of 1 (latest)

cosmic steppeBOT
#
Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

      🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in <id:customize>

      ✅ You can mark a message as the answer for your post with `Right click -> Apps -> Mark Solution`
      (if you don't see the option, try refreshing Discord with Ctrl + R)
sonic quartz
# 
    "message": "Request failed with status code 405",
    "name": "AxiosError",
    "stack": "AxiosError: Request failed with status code 405\n    at https://www.boostio.ai/_next/static/chunks/218-149b336ac3def750.js:1:18669\n    at XMLHttpRequest.c (https://www.boostio.ai/_next/static/chunks/218-149b336ac3def750.js:1:18809)",
    "config": {
        "transitional": {
            "silentJSONParsing": true,
            "forcedJSONParsing": true,
            "clarifyTimeoutError": false
        },
        "adapter": [
            "xhr",
            "http"
        ],
        "transformRequest": [
            null
        ],
        "transformResponse": [
            null
        ],
        "timeout": 0,
        "xsrfCookieName": "XSRF-TOKEN",
        "xsrfHeaderName": "X-XSRF-TOKEN",
        "maxContentLength": -1,
        "maxBodyLength": -1,
        "env": {},
        "headers": {
            "Accept": "application/json, text/plain, */*",
            "Content-Type": "application/json"
        },
        "method": "post",
        "url": "/api/ai/chat",
        "data": "{\"role\":\"user\",\"type\":1,\"inputs\":[\"Create a react button\",\"\",\"\"]}"
    },
    "code": "ERR_BAD_REQUEST",
    "status": 405
}````
worn oriole
#

That’s method not allowed error, check that you are making the request with the correct method aka POST, PUT, DELETE etc.

sonic quartz
#

Yes I am. A post, which works fine in localhost

flint star
#

im not sure what you are trying to do, but notice that axios does not work in Vercel Edge Runtime. Thus Vercel provides Vercel AI SDK to address the issue.

worthy shuttle
#

You have Hobby plan I guess and there is a 10s server side function runtime... I wanted to vectorize documents last on vercel, but the first step when it's vectorising the PDF file took to much time. I figured out to handle it from the next.js env variables. Both, the ChatCompletion class also defined in an env variable and the vectorized docuemnt too. Maybe this comment will help to you... Good luck

flint star
#

yep, that is why you want to deploy to Edge Runtime, where billing is measured by CPU time 50ms, instead of wall clock time cap 10s in hobby.

#

another advantage is zero cold start time thanks to V8 isolates

worthy shuttle
flint star
#

yeah, Cloudflare Worker is really awesome.

sonic quartz
#

And I still have a 504 error

sonic quartz
#

On my component I call the api

       ...
      });
#

And the api looks like this:

  req: NextApiRequest,
  res: NextApiResponse
) {
  try {
    const { type, inputs } = req.body;

    const prompt = generatePrompt(inputs, type);

    const completion = await openai.createChatCompletion({
      model: "gpt-4",
      messages: [{ role: "user", content: prompt }],
    });
    res.status(200).json(completion.data.choices[0].message);
  } catch (err) {
    const error = err as any;
    if (error.response) {
      console.log(error.response.status);
      console.log(error.response.data);
    } else {
      console.log(error.message);
    }
  }
}
#

It works on localhost, but gives 504 in production

worn oriole
sonic quartz
#

Now is 504

flint star
#

so deploy it to Edge instead of Serveles, where 10 sec wall time cap in hobby

sonic quartz
#

Hmm ok thanks. That's all in Vercel right?

flint star
#

yes

sonic quartz
#

Deploying this change now 🤞

#

I've added this to the api, above the handler func:

  runtime: "edge",
};````
#

And now I have an app error:

image.png
#

On localhost is returning 200, but the "data" prop is empty now