Analyzing Stock data Using Django and React [Part 3]

React

Github : KRX-frontend

1. Asynchronous

• authTokenLogin.js

      const handleLogin = async () => {
  

  Define ansynchronous

  1. It is triggered when the user click the login button

  2. And it involves a request to the server

2. localStorage

• User can checks own Token through the developer tools in their browser’s localstorage

  Can not access another user’s token or data. But it is still risk of token theft

• HttpOnly cookies, It is more secure to protect

3. Login Problems

1. The first login attempt fails, there could be an issue with the server response

• After the first failed login attempt, it is important to reset the error state before trying again.

  clear the error each time a new login attempt

   useEffect(() => {
      const token = localStorage.getItem("authToken");
      if (token) {
         setIsAuthenticated(true);
      } else {
         setIsAuthenticated(false);
      }
   }, []); // Runs only once when the component mounts
  

1. Even though a use hasn’t logged in, they are still able to access the /search page. This happens because the authentication check may not be function properly or it’s being bypassed.

• After a successful login, the isAuthenticated state is properly set to true and then the authentication token is stored in localStorage