Hi @snow mesa. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
#Missing `origin` header from a forwarded Server Actions request.Error: Failed to find Server Action
stoic gladeBOT
Based on the knowledge sources provided, it seems like you're encountering an issue with Next.js Server Actions where the origin header is missing from a forwarded Server Actions request. This issue has been reported in various forms in the Next.js GitHub issues.
The error message you're seeing suggests that the Server Action you're trying to call cannot be found. This could be due to a mismatch between the origin header and the x-forwarded-host header, as discussed in this GitHub issue (https://github.com/vercel/next.js/issues/58295).
In another GitHub issue (https://github.com/vercel/next.js/issues/63915), a similar error was reported when using Server Actions in parallel routes. The error was triggered when a Server Action was called from a route other than the one where it was defined.
Unfortunately, without more specific information about your code and configuration, it's difficult to provide a more precise solution. However, you might want to check your Server Actions setup and ensure that the origin and x-forwarded-host headers are correctly configured. If you're using Server Actions across multiple routes, make sure the actions are correctly defined and accessible from the routes where they're being called.
If you're still encountering issues, consider creating a minimal reproduction of the issue and reporting it on the Next.js GitHub issues page for further assistance.
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
snow mesa
@stoic glade /** @type {import('next').NextConfig} /
const nextConfig = {
env: {
GPT_API_KEY: process.env.GPT_API_KEY,
CCP_AI_BASE_URL: process.env.CCP_AI_BASE_URL,
CCP_API_BASE_URL: process.env.CCP_API_BASE_URL,
CCP_FE_BASE_URL: process.env.CCP_FE_BASE_URL,
},
async headers() {
return [
{
// matching all API routes
source: "/api/:path",
headers: [
{ key: "Access-Control-Allow-Credentials", value: "true" },
{ key: "Access-Control-Allow-Origin", value: "*" }, // replace this your actual origin
{
key: "Access-Control-Allow-Methods",
value: "GET,DELETE,PATCH,POST,PUT",
},
{
key: "Access-Control-Allow-Headers",
value:
"X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version",
},
],
},
];
},
compiler: {
styledComponents: true,
},
images: {
domains: ["images.unsplash.com", "hcmus-careercompass.me"],
remotePatterns: [
{
protocol: "http",
hostname: "127.0.0.1",
port: "9000",
},
],
},
};
module.exports = nextConfig;
Here is my next config
stoic gladeBOT
Let me check the knowledge base for you. One moment! :books:
Your next.config.js file seems to be well configured. It includes environment variables, headers configuration, compiler options, and image settings. Here's a brief overview of each section:
-
Environment Variables: You're correctly setting up environment variables using the
envproperty. These variables will be available in your Next.js application. -
Headers: You're setting up headers for all API routes (
/api/:path*). This includes CORS headers, which are necessary if you're making requests to your Next.js application from a different origin. -
Compiler: You're enabling styled components in the compiler options. This is necessary if you're using styled-components in your application.
-
Images: You're configuring the
imagesproperty to allow images from specific domains and remote patterns. This is necessary if you're using Next.js' Image component with images hosted on these domains.
Remember, next.config.js is a regular Node.js module, not a JSON file. It gets used by the Next.js server and build phases, and it's not included in the browser build (source (https://nextjs.org/docs/app/api-reference/next-config-js)).