How to store OAuth1 tokens used by an Angular Front-End

Question

I'm currently working on a headless project: an Angular Front-End retrieves data dynamically using a Back-End's API.

This API requires an OAuth1 ahtorization, so that the Angular app has to pass 4 tokens (request, request secret, access, access secret) on each call.

Currently, these tokens are stored in a JS config file. As the API client is a pure Front-End app, any user can access them (even from the browser's console!).

My question is pretty obvious: how to store these tokens in a more secure way in my use case?

Thank you in advance.

You can save them in JSON file and read them with service, or you just can store them encrypted in localstorage. — ahmed gaber, Apr 29 '19 at 16:41
Thank you Ahmed. Indeed, I already thought about such a strategy. I think it's useless, because the encoding/decoding functions would been visible by anyone, since it's part of the front-end app... — David Kohelet, Apr 30 '19 at 06:58

score 0 · Answer 1 · answered Feb 17 '19 at 08:58

0

I think you can encode each token and store it in localstorage, when you need to send the token the back end retrieve it from localstorage decode it and send it back.

answered Feb 17 '19 at 08:58

Ali Badr

128
1
10

Thank you Ali. Indeed, I already thought about such a strategy. I think it's useless, because the encoding/decoding functions would been visible by anyone, since it's part of the front-end app... – David Kohelet Apr 30 '19 at 06:56

score 0 · Answer 2 · answered Feb 17 '19 at 10:34

0

save in Local Storage:

localStorage.setItem('currentUser', JSON.stringify({ token: token, name: name }));

get from Local Storage:

var currentUser = JSON.parse(localStorage.getItem('currentUser'));
var token = currentUser.token; // your token

answered Feb 17 '19 at 10:34

Baruch Gans

1,415
1
10
21

How to store OAuth1 tokens used by an Angular Front-End

2 Answers2