I am using next-intl package to make internalization on my Next app. In the server side I need to get the URL so I can look to param and make a request to my backend with it. Using referer header worked fine in local but when I deployed my app to Vercel it doesn't worked. To troubleshoot, I logged every header in there and find out there is no header I can use to get the url params.
My question is what can I use in getUserLocale function to get url other than referer to make my call.
This is request.ts file which is default file called for next-intl package:
import { getUserLocale } from "@/services/locale";import { getRequestConfig } from "next-intl/server";export default getRequestConfig(async () => { // Provide a static locale, fetch a user setting, // read from `cookies()`, `headers()`, etc. const locale = await getUserLocale(); return { locale, messages: (await import(`../messages/${locale}.json`)).default, };});and here I need to read URL so I can make the request I need.
"use server";import { cookies, headers } from "next/headers";import { Locale, defaultLocale } from "../i18n/config";const COOKIE_NAME = "language";const languageMap = { English: "en",} as const;export async function getUserLocale() { // WHEN I LOG THIS ON PRODUCTION THERE IS NO ITEM TO GET URL console.log( "headers", (await headers()).forEach((value, key) => { console.log("header", key, value); }), ); const referer = (await headers()).get("referer"); console.log("referer", referer); if (!referer) { return defaultLocale; } const url = new URL(referer); //http://localhost:3002/?some-id-that-i-need=123 const id = url.searchParams.get("some-id-that-i-need"); console.log("id", id); // So I can use that Id to make a request to the backend and get the language return defaultLocale;}export async function setUserLocale(locale: Locale) { (await cookies()).set(COOKIE_NAME, locale);}