#so if i am using server components i
violet ether
i am fetching a api to verify the user
it needs autorization token from local storaage
everytime i call the api
wicked crow
why don't you use cookies? Save the token in the cookies and the server can read them. Then fetch serverside
violet ether
try {
const res = await fetch(`${BASE_URL}/autologin`, {
headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`,
},
});
console.log(res);
if (!res.ok) {
throw new Error(`Failed to fetch data: ${res.status}`);
}
return res.json() as Promise<IAuthResponse>;
} catch (error: any) {
// Handle fetch errors (like network issues)
console.error("Fetch error:", error.message);
throw error;
}
}```i am not sure how to do this and we dont logout user until the use logout
wicked crow
you set the token as cookie, when the user login
violet ether
i mean the old user where using token from localstorgae
and backend jsut verify the token
i know the authentication sucks
but we have over million users
wicked crow
yes, auth like that sucks xD
wicked crow
what's the problem on a logout? You should log them out after a specific time my natural.. for safety reasons alone
violet ether
what's the problem on a logout? You should log them out after a specific time my...
no we dont do that
wicked crow
do i need any library for cookies?
no, it's supported by next
which auth library are u using?
violet ether
our dashbaord is a subdomain and we use the same localstorage method to login
violet ether
which auth library are u using?
for now all react i am just starting to create the landing page innext
making sure everything go smooth before i actually start coding
try {
const res = await fetch(`${BASE_URL}/autologin`, {
headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`,
},
});
console.log(res);
if (!res.ok) {
throw new Error(`Failed to fetch data: ${res.status}`);
}
return res.json() as Promise<IAuthResponse>;
} catch (error: any) {
console.error("Fetch error:", error.message);
throw error;
}
}```
solve me this issue
wicked crow
Can I give you a good and easy to setup auth library with cookie based AND localstorage based?
violet ether
Can I give you a good and easy to setup auth library with cookie based AND local...
sure why not
and it should not affect the old users
who are using localstorage
wicked crow
you said you using react to auth the user. So the auth currently is only clientside?
we were using react before
violet ether
you said you using react to auth the user. So the auth currently is only clients...
now no i am changing all the component to server side
violet ether
yeah
violet ether
i still i have to use localstorage in next as well ?
so if i am using server components i have to make a client component which gets this data and use in server compoent ?
something this will work right ?
wicked crow
No, you can’t. You can only go one direction: server -> client or client -> server thought params. And I don’t think that the user want, that their token will be published throught the url
If I were you, I would upgrade to an library, which can handle both auth modes (ssr though cookies and clientside though localstorage) and then you are ready to go for everything
violet ether
No, you can’t. You can only go one direction: server -> client or client -> serv...
its to lait for this now
wicked crow
Why?
violet ether
as i said you our authentication process is messed up
and we have like 400-500 always online
it would be better if we cahnge the authentication but will have to do so many changes
violet ether
No, you can’t. You can only go one direction: server -> client or client -> serv...
but let me tell you we still doing this for login user to send user from landing to dashbaord
wicked crow
Of course it’s a completely change. I think it is everytime, when you switch from one framework to another. But that’s also the chance to make a great app. To fix stuff. To also get a good auth system, …
wicked crow
as i said you our authentication process is messed up
You already said it ^
You NEED to change something. It can’t be how it is!
wicked crow
your favicon needs to be in the app dir:
https://nextjs.org/docs/app/api-reference/file-conventions/metadata/app-icons#image-files-ico-jpg-png