Store access and refresh token in local storage

Hello everyone. I have a security concern. In my web app I use private videos accessible only to authenticated users and after that , instead of authenticating each time with a POST call , I store the access_token and refresh_token in the local storage.

this.http.post('https://ws.api.video/auth/api-key', {'apiKey':"xxxxxxx"}, { headers: headers })
                      .subscribe((response:any)=>{
                        console.log(response);
                        this.storage.updateAccessToken({"access_token" : response.access_token, "refresh_token" : response.refresh_token , "lastUpdate" : new Date().getTime()});
                      });

Is it safe to do this or is it wrong? Because reading a bit on the internet some people advise against storing the tokens on the frontend

Hi @showenka, the main problem is not local storage, but making the call to our api from your front end is not the best solution. We recommend you to have an endpoint in your backend that allows you to call our api, return the private token back to the frontend and use it for your next callings.

I hope this helps you.
Regards,