I recently had a small project remix + strapi, and got an unexpected bug, when logging in successfully, and throwing to a certain page, the loader did not send the appropriate data, and instead returned data like below:
export const name = "landing-remix";export const sideEffects = false;export const type = "module";export const scripts = { build: "remix vite:build", dev: "remix vite:dev", lint: "eslint --ignore-path .gitignore --cache --cache-location ./node_modules/.cache/eslint .", start: "remix-serve build/server/index.js", typecheck: "tsc"};
//all in package.json
code root that I made :
import { userme } from "~/api/auth/userme.server";
export const loader = async ({ request }: LoaderFunctionArgs) => {
const user = await userme(request);
return json({
user: user || null,
env: {
STRAPI_API_URL: process.env.STRAPI_API_URL,
STRAPI_URL: process.env.STRAPI_URL,
LOGO: Logo,
}
});
};
export default function App() {
const data = useLoaderData<typeof loader>();
console.log(data);
return (.....)
}
Code Session
export async function createUserSession(redirectTo: string, user: any) {
const sessionData = await getSession();
sessionData.set("userSession", user);
return redirect(redirectTo, {
headers: { "X-Remix-Hard-Redirect": "true",
"Set-Cookie": await commitSession(sessionData) },
});
}
function getUserSession(request: Request) {
return getSession(request.headers.get("Cookie"));
}
export async function getUserData(request: Request) {
const session = await getUserSession(request);
// console.log(session.get("userSession"));
if (!session) {
// if there is no user session, redirect to login
return redirect("/login", {
headers: { "Set-Cookie": await destroySession(session) },
});
}
return session.get("userSession");
}
expected behavior :
displays userme