error 40104, 40105 when using ably with next js app router on vercel

Question

I'm using ably and have created a route to generate a token on next.js server using the following code, based on the next example on ably's web site

// src/app/api/getAblyToken/route.ts

import { NextResponse } from "next/server";
import ably from "ably/promises";

export const fetchCache = "force-no-store";

export async function GET() {
  const token = await new ably.Rest({
    queryTime: true,
    key: process.env["ABLY_API_KEY"]!,
  }).auth.createTokenRequest({
    capability: {
      "*": ["subscribe", "publish", "presence"],
    },
  });
  console.log(token);
  return NextResponse.json(token);
}

It all works great on my machine but when I deploy to vercel I get error 40104 and 40105.

That basically say that the token was already used or that it's timestamp is invalid.

Answer 1

You need to add the following code to the route.ts

export const dynamic = 'force-dynamic'

This will tell next not to cache the results returned by the fetch function used by ably to get data from it's server.

This answer is based on the following aticles:

• https://faqs.ably.com/40104-timestamp-not-current
• https://nextjs.org/docs/app/building-your-application/data-fetching/fetching-caching-and-revalidating#segment-level-caching
• https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config

Here's the final code:

import { NextResponse } from "next/server";
import ably from "ably/promises";

export const fetchCache = "force-no-store";

export async function GET() {
  const token = await new ably.Rest({
    queryTime: true,
    key: process.env["ABLY_API_KEY"]!,
  }).auth.createTokenRequest({
    capability: {
      "*": ["subscribe", "publish", "presence"],
    },
  });
  console.log(token);
  return NextResponse.json(token);
}

export const dynamic = 'force-dynamic'