Saving an Auth Token to Local Storage in React
Guide Tasks
  • Read Tutorial
  • Watch Guide Video
Video locked
This video is viewable to users with a Bottega Bootcamp license

[00:00:01] Hi welcome back to the reactor. In this guy we are first going to start off by talking a little bit about local storage and then we will hop into the newsletter components and what we need to do to display everything you see here on the screen and get this data into here. And I told you that we will be doing it first free. A normal user but since we are signing in with a Outman user we will be doing all the admin actions first and then after all that we will just limit what normal user can do by checking the. If it's an admin or not the user. If he or she is so to get started let's talk about storage a bit. First let's get rid of this token in the catalog and then let's basically save it to local search the web we can do this is by saying local storage and basically all local storage is its your local storage on your computer specific to that you're up. So the reason we want to put the token in local storage is because no nobody else can access it on the Internet because we now need to have a website. If anything happens basically nobody can get to this unless they hack into the computer because of local. It's on your computer. So you got that same type of malware or something for someone to get your local in your local storage and it can't be scraped from your Web site. So we want to put it in mobile storage and then get rid of it. We don't want to log it anywhere. [00:01:36][95.1]
[00:01:36] We just want it in local storage so we do that by saying local storage of said item token response date token. Let's go ahead and hop over to the browser here and check that out. Let's go to network or let's go to see where is it. It's an application local storage. OK. So let's remove the app and then sign in or it looks like an order. Arnell already saved in because it was there so let's just reload it anyway locals sign in and let's clear our local storage. One thing I forgot to say is we have to you we have to actually clear it from our local storage a point to once we sign out because we don't want to have the token in there anymore if we're signed out. Because if you are the token in there then you can access certain routes on the bra on the server and get content that shouldn't have access to. So you have to clear it out here manually when you sign out and we'll do that when we get around the site. But for now we need to talk about saving it in local storage so that signing with Ivan get the password and to see we had signed in says cannot be property to to an undefined. That's because I said data not data back reload Stepanov. And again that's a password you navigated here doesn't log yet. Let's check our application. We've saved it into the browser. So we have a local Pocan in here and that's all good to go. Now since we talked about that for a little bit longer than I expect to do. [00:03:19][102.8]
[00:03:20] Let's move on to this stuff in the next guide and what's just coming through. So it's not as good a key committee. Analysts say saved tokin to locals. The same token to local storage or saving because it's not something that happened once it's going to happen every damn sentence of saving local saving token auto storage. All right I'll catch the next guy. We will start on the news component. We're about sort of newsletter's combines. [00:03:20][0.0]
[197.8]