Getting an error: "Failed to find Server Action "4a68...". This request might be from an older or newer deployment."

[Jared-Dahlke]

I recently deployed an App dir 14.0.1 Nextjs application and have several users using it at my company. It uses server actions heavily. This AM i started getting some errors in Sentry:

Failed to find Server Action "4a682493280336616b4a9a906883df1c9dcdd5a5". This request might be from an older or newer deployment.

My assumption is that my users haven't refreshed their browser since I pushed out some changes.

Anyone ever seen anything like this? Any ideas or tips? Should I push out some change that makes users refresh when a new release is out?

[lotusjohn]

Getting the same in local dev on 14.0.0 up to 14.0.5 canary 5 for any server action which is triggered from client component.
Server action in a server component works.

Working:

//ServerForm.tsx

export default function ServerForm() {
  const action = async (formData) => {
    'use server'
    console.log('server action', formData.get('name'))
  }
  return (
    <form action={action}>
      <input name={'name'} />
      <button type={'submit'}>Submit</button>
    </form>
  )
}

Doesnt work:

//action.ts

'use server'
export async function formServerAction(params) {
  //code 
  return 'return value here'
}

//ClientCompForm.tsx

//component code
const onSubmit: SubmitHandler<FormInput> = async (data) => {
    //code
    await formServerAction(reqParams)
}

[Jared-Dahlke]

@lotusjohn, I started passing in server actions from server components and it seems to have fixed the problem.

so basically like this:

// server component

import { saveData } from 'actions/saveData'

export default async function Page() {
  

  return (
    <ClientComponent
      saveData={saveData}
    />
  );
}

Then i can use it in the ClientComponent like this:

'use client'

export const ClientComponent=({saveData})=> {

return (
  ...some form
<button onClick={saveData}></button>
)

}

or i can just keep the server action in the server component like this:

// server component


export default async function Page() {
  
  const saveData=async(data)=> {
      'use server'
      //save data to db

   }

  return (
    <ClientComponent
      saveData={saveData}
    />
  );
}

Both seem to work, and prevent the error.

Can you confirm if you've tried similar? Glad to see i'm not the only one who experienced this.

[lotusjohn]

I just tried passing as prop as well and it worked!

[Jared-Dahlke]

@leerob this seems to be a problem, but we don't have the ability to make a repro repo because it requires multiple deployments to reproduce. can you please look into this or address?

[ken-spencer]

I am experiencing the same problem as well. In my application if I log out in one tab and then trigger a server action in the other tab I get this error every time.

[thomasrichmond]

Hey, I know this was a while ago, but wondering if you ever found a fix for this? We are using auth0 for user auth and the exact same happens when ever I trigger a server action on one tab after logging out out on another. Any help would be awesome as I am scratching my head over this!

[CodingDutchman]

Once your session is invalidated, wouldn't it be invalidated for all your tabs?

[thomasrichmond]

Yes it would be, but this was not the reason my FE was crashing. To make a long story short, triggering middleware from a server action (to perform auth checks using Next.redirect()) causes the server action to silently return undefined, causing a load of unexpected behaviour in your app. Here is the thread explaining that hard auth checks should always be done at the request level, not the middleware level (complete opposite of the next docs!)

[mastoj]

I also got this now using next 14.0.4. For me it happens when the server actions is called from an parallel intercepted route. The exact same code works fine from the actual route.

[ken-spencer]

I was able to figure it out in my application. Logging out in one tab prevented the server actions in the other tab from working because the middleware was now redirecting them. Never would have guessed from the error :)

[ahmetkca]

I am facing the same problem. However, it is slightly different. I have a tanstack query in a client component where I use server action as queryFn. The problem arises when I invalidate this tanstack query from parallel intercepted route.

[Jared-Dahlke]

I also got this now using next 14.0.4. For me it happens when the server actions is called from an parallel intercepted route. The exact same code works fine from the actual route.

Can you please expand on this? What do you mean by "parallel intercepted route" and "actual route"? Explain like I am 80 IQ please. Can you give example? Why is this not being fixed or better addressed?

[ahmetkca]

I also got this now using next 14.0.4. For me it happens when the server actions is called from an parallel intercepted route. The exact same code works fine from the actual route.

Can you please expand on this? What do you mean by "parallel intercepted route" and "actual route"? Explain like I am 80 IQ please. Can you give example? Why is this not being fixed or better addressed?

What I mean by parallel intercepted route is this:

In /boards/[boardId] page.tsx I display tasks for the given board. If you click on a task, it opens the comments for the clicked task in the modal, /boards/[boardId]/tasks/[taskId]/comments.

The route /boards/[boardId]/tasks/[taskId]/comments is rendered on top of /boards/[boardId] in a modal. So the route /boards/[boardId]/tasks/[taskId]/comments is being intercepted.

User adds a a new comment. I want to invalidate the query so that the number of comments in the /boards/[boardId] updates. I invalidate the tanstack query but because server actions cannot be found it fails.

Error: Failed to find Server Action "de6c6489e15944f0b88e9d483d2eef1d967c7a4c". This request might be from an older or newer deployment. Original error: Invariant: Couldn't find action module ID from module map.

[mkbctrl]

In my case it happens when trying to redirect on successfully submitted form.
Fun fact: it worked for like an hour or two, and then it started to throw error 🙃 - maybe a local dev issue?

useEffect(() => {
    if (state?.submitted) {
      actionRedirect(Path.UserHome)
    }
  }, [state])

where:

'use server'

import { Path } from 'src/constants/path'
import { redirect } from 'src/services/i18n/i18n-navigation'

/**
 * actionRedirect - if you need to trigger redirect from the client component
 * https://nextjs.org/docs/app/api-reference/functions/redirect
 */
export async function actionRedirect(path: Path) {
  redirect(path)
}

error:

rror: Failed to find Server Action "017bd78c23c5fecaef8cb9b835f35b17bdd6640d". This request might be from an older or newer deployment. Original error: Invariant: Couldn't find action module ID from module map.

By the way, anyone has an approach to onFormSubmission side effects, and is willing to share? I am working with native useFormState, gave it a ride, and it's missing a bit in flexibility or I can't wrap my head around on Next.js 14 specifics yet

EDIT:
In my case non of the workarounds work.

EDIT2:
Using router.push started to work -> I ended up reading this https://nextjs.org/docs/app/api-reference/functions/redirect due to the warning the contents I don't remember stating I should use server action... What a maze 😂

[paulinhapenedo]

I'm getting the same error. The full error message:

Error: Failed to find Server Action "ff338b32de2c62c9fce3998a34545a3e0672f704". This request might be from an older or newer deployment. Original error: Invariant: Couldn't find action module ID from module map.

The stack I'm using:
next: 14.1.0
next-auth: 4.24.5
react-query: 5.18.0

It happens whenever the user's JWT token expires and Tanstack Query tries to refetch the data on the background. All of my query/mutation functions are Server Actions. In them, I have this code running before actually fetching anything:

// serverAuth lives in another file
export const serverAuth = async () => await getServerSession(authOptions);


// actual Server Action
'use server';

const getUnitPractitioners = () => {
 const session = await serverAuth();

  if (!session) {
    LOG.error('🚨 No session found when fetching practitioners for this unit');
    return Promise.reject(
      'No session found when fetching practitioners for this unit'
    );
  }

// does whatever action is necessary

return data;
}

[steventkrawczyk]

I'm experiencing the same issue

[ghunkins]

Same issue on both stable and canary releases for next.

Re-echoing that it appears to occur when using the Client Components data fetching paradigm.

[bernaferrari]

You are right but same would happen with api routes, like, if you changed a route it would still reach the old one. I guess it is less bad, but would still happen.

[Lebraz98]

I have same problem.
I have fixed it by remove request.headers from fetch header and create new header value
not pass the next request header inside fetch create new header request value like this

old code: image

new code:

[Prains]

Same issue here. Happens when i reopen intercepted modal window that uses server actions in client components using browser navigation.

[teddybee]

Same issue here.
I would like to do a simple logout (jwt cookie clear) and redirect to home in server action.

[newtonMM]

I'm experiencing the same issue, were you able to fix ir

[GVALFER]

Same here

"next": "^14.1.0",

Error: Failed to find Server Action "572c475e1c59eeb141374e2737137c179e2063dc". 
This request might be from an older or newer deployment. Original error: Invariant: Couldn't find action module ID from module map.
    at t3 (/.../node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:39:1693)
    at /.../node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:38:7079
    at AsyncLocalStorage.run (node:async_hooks:338:14)

[abdtriedcoding]

Any updates facing same issue ?

[RestartDK]

I get a similar error when I use react-email...

[sim391calado]

I have this exact same issue.

[huozhi]

If you still encounter it with latest Next.js version, please file an issue with reproduction, we can help take a look on it! 🙏

[marsonmao-trait]

Hi @huozhi, just wondering if we're expected to use the practice in #58431 (reply in thread) (i.e. using props to pass server actions around), or are we good with just importing them from a file in a Client component? 🙏

[huozhi]

@marsonmao-trait It should work if you import server action into client components, if you still have issues with it probably a bug. Would you mind filing an issue with your repro and tag me there? Thanks

[marsonmao-trait]

I installed 14.2.10 and I'm still getting undefined with a un-refreshed browser tab calling a server action.

Scenario: a user opens a tab, and then the server has a new deployment while the tab is not refreshed i.e. it becomes outdated / stale; in this case if the user Submit (with server action) using the stale client, the server action returns undefined

---

I tried this pattern: import server actions using relative path in a server component, and pass it as a prop to a client component, but it does not work

Referenced from #58431 (reply in thread) and #58431 (comment)

---

The specific behavior on my un-refreshed tab is: when clicking Submit, it fired a POST server action with header Accept = text/x-component, but and then it received a 200 response, with header Content-type = text/html; charset=utf-8, also the server action returns undefined.

So from the Dev console we can see an uncaught error saying "reading xxx from undefined", also the user would see no changes from the page (because the response seems to be the exact HTML structure of the current page).

In this case if the user chooses to refresh the tab, then it can work, but not every time the users are aware of this, obviously.

So I'm wondering how can I maybe detect this kind of response (server action returning undefined) gracefully, i.e. not to try-catch on "every" server action call, so that I can show an error message to the users and propose a manual refresh?

[abhi12299]

from the nextjs docs: https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions-and-mutations#security:~:text=However%2C%20for%20this,a%20specific%20build.
it seems that a server action can only be invoked for a particular build.

If this is the constraint, we can work around this by having an api route serve the build id to the frontend, and the frontend can poll for the build id. If it sees any changes, we can ask the user to refresh the page

[benjick]

@abhi12299 got an example? 😇

[abhi12299]

@benjick haven't tried it myself, but you can serve the value of process.env.GIT_HASH on an API route to check for staleness. Ref: https://nextjs.org/docs/app/api-reference/config/next-config-js/generateBuildId

If that is not available after the build time, you can modify the webpack/turbopack config in next.config.js/ts file

[benjick]

This feature of generating new "unguessable, non-deterministic IDs" for server actions on every build is ruining the ability to continuously deploy my application. I don't want to force my users to refresh their browsers every time I do a deploy. What's the solution for self-hosters? Can this feature be turned off?

[controversial]

I believe you can set NEXT_SERVER_ACTIONS_ENCRYPTION_KEY to a fixed value

[benjick]

@controversial thanks, I'll try it! I was just thinking how it would be nice to set a key yourself and rotate it on demand and came back to this thread to suggest it. Cheers!

[benjick]

I've been reading through this issue: #75541

But it's not really clear if/when the id could change even after setting NEXT_SERVER_ACTIONS_ENCRYPTION_KEY

[benjick]

It doesn't work, at least not for me. Did a deploy and an action which is in a file that hasn't been changed for a week failed.

[wieringen]

We are self-hosting Next.js on Cloud Run. We have set the NEXT_SERVER_ACTIONS_ENCRYPTION_KEY, but that made no difference. This error is still popping up all the time. Is there anything that can be done?

[wieringen]

resource "random_bytes" "next_encryption" {
  length = 32
}

I used the terraform random_bytes resource

[benjick]

How do you use it?

[IkerPagoaga]

I got it working, set it both during build and runtime

Do you set it in a docker building script and then store it on a secret?

[benjick]

@IkerPagoaga what do you mean store it on a secret?

1. Pass it to next build as an env var via build secret in my Dockerfile
2. Set it as an env var during runtime

[IkerPagoaga]

@IkerPagoaga what do you mean store it on a secret?

1. Pass it to next build as an env var via build secret in my Dockerfile
2. Set it as an env var during runtime

I found out it can be troubling if you hardcode the value, so just as yourself, I add it to my dockerfile without being hardcoded. If you use google cloud secret manager you can forget about having to update the key value itself since you are using the newest latest version of the secret that gets created with a different script. (Edit: only 6 secrets can be kept active if you dont want to start paying for them on gc secret manager, if you dont need to store them, store and destroy the previous version. Update this value each 3 months, you shouldnt have to worry about it.)

[hessaam]

I toggled client component to the server component (APP CRASHED) and to the client component again (!!) and everything had been OK.

[AdarshaNayak]

We have set the NEXT_SERVER_ACTIONS_ENCRYPTION_KEY but still we run into Failed to find server action error. Although the frequency has reduced we would not like to have it in the first place.
Is there a way to disable non-deterministic nature of these IDs?
I'm currently on v15.3.4

[markedwards]

Also running into this on 14.2.33, after switching to a standalone build. What is the deal with this? This is severely breaking our UX.

[markedwards]

Update on this -- it turned out in our case to be non-deterministic absolute paths in CI causing server action ids to change on every deploy. Fixing that solved the issue.

[kyrylolvov]

Could you elaborate on this? How were you able to fix it?

[markedwards]

So in our case, we switched to doing the next build directly inside a GitHub runner, instead of inside of a docker image build. GitHub actions have a different absolute path for $GITHUB_WORKSPACE on every run. So that was causing the next build to generate a new id for every action on every run.

The fix was to do:

mkdir /company
mount --bind "$GITHUB_WORKSPACE" /company

And then perform our pipelines steps from the /company directory instead of $GITHUB_WORKSPACE. However, this is only possible because we use AWS Codebuild as our custom runner. I don't think you are allowed to do the above in a standard GitHub runner.

TLDR -- you have to have a deterministic absolute path on every build in your CI, somehow.

[kyrylolvov]

Currently facing this issue on 15.1.4, hosting in Docker on ECS

[leandronn]

For me it was a browser issue. Hard reloading the browser, worked just fine.

[markedwards]

I think you might misunderstand. That's exactly what's being complained about here. The app should continue working without the user refreshing.

[developerEhsan]

Guys did you find any solution?

[leandronn]

I think you might misunderstand. That's exactly what's being complained about here. The app should continue working without the user refreshing.

but if you rebuild your .next compilation, browser will have cached "old" action IDs. the app should not continue working with a diferent build.

[kyrylolvov]

I feel like for me the issue is that there's other stuff running on the ECS, and whenever those get deployed, they restart Next.js application, which seems to break Server Actions. Might be wrong though. Basically, Next.js needs like ideal environment with nothing interrupting it.

[JoshuaSmeda]

Getting this issue at all the time on Next 16.0.10 on Dokploy.

I've even set NEXT_SERVER_ACTIONS_ENCRYPTION_KEY but makes no difference.

[youssefKetata]

Did someone figure out a solution for this , without using client functions?

[kyrylolvov]

Moved to API routes

[youssefKetata]

I tried it, did not work for me, same error appers

[Pratham5236]

Anyone could figure this out? Its bugging a lot of our users

[anjan-kp]

Does this issue occur if we don't use any server action?
I am using NextJS 15.4.10
How about adding generateBuildId to next.config.ts?

[Pratham5236]

To anyone facing this issue, while self hosting Next.js, please try adding NEXT_DEPLOYMENT_ID or deploymentId to next.config.ts/js. According to official documentation here, this helps in version skewing protection. I have added this and so far, I'm not seeing issues as i was earlier