Back
Appwrite is using localStorage for session management. Increase your security by adding a custom dom
- 0
- Auth
- Web

TypeScript
import { account } from "../Appwriteconfig";
import { useNavigate } from "react-router-dom";
const Login = ({}) => {
const [isauthenticated,setauthenticated]=useState('')
const handlelogin=async (e)=>{
e.preventDefault()
let login= await account.createEmailSession(e.target.email.value,e.target.password.value)
if (login){
setauthenticated(true)
}
else{
setauthenticated(false)
}
}
return (
<div
className="flex items-center justify-center h-screen bg-cover bg-center"
style={{
backgroundImage:
"url('https://static.cdninstagram.com/rsrc.php/v3/ye/r/YVr3E4VYzmE.png')",
}}
>
<div className="bg-white bg-opacity-30 p-8 mt-20 rounded-lg w-96 ">
<h2 style={{'color':'black'}} className="text-2xl font-bold mb-4 ">Login</h2>
<form onSubmit={handlelogin}>
<input style={{'color':'black'}}
type="email" name="email"
placeholder="Email"
className="block w-full p-2 mb-4 border rounded"
/>
<input style={{'color':'black'}}
type="password" name="password"
placeholder="Password"
className="block w-full p-2 mb-4 border rounded"
/>
<button
type="submit"
className="w-full p-2 bg-blue-500 text-white rounded hover:bg-blue-600"
>
Login
</button>
</form>
</div>
</div>
);
};
export default Login;
TL;DR
Developers are seeking to increase security by adding a custom dom to Appwrite, as it is currently using localStorage for session management. The issue raised in the thread concerns the rendering of true/false values.
Solution: The code shared involves a private route component and a login component. Developers were troubleshooting why the true/false values were not rendering correctly. The suggestion is to review the logic behind setting the authenticated state in the handlelogin function to ensure it functions as intended for proper session management.
TypeScript
import React, { useEffect, useState } from 'react'
import { Navigate } from 'react-router-dom'
const Privateroutes = ({component:Component,isauthenticated,...rest}) => {
console.log(isauthenticated)
useEffect(() => {
}, []);
return isauthenticated ?<Component {...rest} />:<Navigate to='/login' replace />
}
export default Privateroutes;

why it is not rendering the true false value
Recommended threads
- File tokens regenerate each page reload
Hello, on appwrite 1.7.4, when I create a file token via the API Tokens(appwriteAdminClient)#createFileToken I get a secret, then when I check in the console t...
- CSV Import Shows Success but Data Not Ap...
I tried importing a CSV file into my PRODUCTS collection. The dashboard shows the message “Import to PRODUCTS completed successfully,” but no data appears in th...
- [FEATURE] Better usage analytics for app...
Recently, i've gotten **73** emails from appwrite regarding excesive GBHours usage. I've almost hit the limit of 1000 and it is really hard to track down which ...
