Redirect When Access Token Expired OAuth2 - angularjs

Im using OAuth2 to secure my API, but i wouldn't use refresh token to get my new access token, im just want redirect to some pages when the access token is expired
Header Response Capture

I guess redirecting is easy, If your application is a server App then send the response back to browser with status 302 and LOCATION=redirect_URI?error_code=&error_desc=. You can build the error page to be JSP or even servlet which simply reads the error_code and error_description and displays it in friendly manner. Make sure that the error page is not protected by the filter which checks the token

Related

What is the flow of using JWT work on the frontend?

I am new to web dev. I built a backend using Django Rest Framework and am using JWT to handle auth.
Now, I want to connect my backend to my frontend in React. But, I am confused how this should be done. Here are my question:
What is the whole flow of requesting and using JWT access and refresh tokens? Like, when should I request a new access token with my refresh token and when should I request a new refresh token? Thanks!
I will make a quick response:
Flow of requesting and using JWT:
A picture worth a thousand words.
The access token is not lasting forever. Whenever it expires, you have to request a new access token with your refresh token.
Refresh tokens can expire, although their expiration time is usually much longer than access tokens. To handle this case, almost all implementations I've seen return a known error code of 'invalid_grant' that you can check for on the client-side and handle by your business. (ex: Show login page...)
Regarding your questions:
What is the whole flow of requesting and using JWT access and refresh tokens?
I don't know you're using what's package about JWT, having too many packages about Django JWT on github (pyjwt, djangorestframework_simplejwt, ...). And Im using pyjwt in my application, because I want to custom my authentication in-app for security.
The workflow:
When FE send request to login/signup APIs, BE generate a token by using JWT, and return that token in the response.
FE store that token on local storage, using it for sending other requests.
BE will take the token by each request from FE to verify. The same as TokenAuthentication of DRF, we must be custom it when using pyjwt. Will verify the JWT token instead.
when should I request a new access token with my refresh token and when should I request a new refresh token?
You can request a new access token after that token is expired.
When you're using djangorestframework_simplejwt you can see the refresh token but in my case (pyjwt), I just need re-generate jwt token again :)
There could be options, but simple flow is next:
You do auth and get access and refresh tokens from a backend and save them as cookies.
You use your access token until you get error 401 because access token has expired
Then you try to refresh your tokens using your refresh token. If you use axios on frontend, good option to write a middleware for this case. This middleware will refresh tokens and repeat a last request. There should be recipes in google.
If success you got new pair of access and refresh tokens and continue your workflow.
If fail, you need to auth again to get tokens.

Do I need to check JWT expiration on client side?

I'm developing website like classified ads with Django REST framework, react and redux. I have a question about authentication with JWT.
I want to use djangorestframework_simplejwt for authenticate and I've checked a few tutorial. I saw that many tutorial are checking access token on client side like below
export function isAccessTokenExpired(state) {
if (state.access && state.access.exp) {
return 1000 * state.access.exp - (new Date()).getTime() < 5000
}
return true
}
and refresh token as well.
But I don't know why. Because just request new access token with refresh token every time we got HTTP 401 Unauthorized error with expired access token.
The workflow that I thought is
Send server a request with access token to get page which only
authenticated user can see.
If access token is expired, frontend
will get HTTP 401 Unauthorized error.
Send server a request with
refresh token to get new access token, then frontend will store it
to localStorage.
Send a request again.
Is this bad way?
My apologies with my poor English...
You shouldnt be checking the JWT on the client side. A JWT is basically a token that the server has given you that is "assumed" valid. When you send the token back, the server will tell you if the token is not valid in the form of Http Status Code 401 - Unauthorized

Handle access token in angularJS

I have Web Api and AngularJS to consume web Api.
when user login with credential user get access_token and refresh token with issued and expires field.
access_token is expired in each 1 minutes and allocate new token to user.
now the problem is
The time between token expired and allocation of new token to user.
if user do a page refresh then its makes an api call to load data of that page, but the access token was just expired and user does not got a new token, so old token is set in header of api call, hence user got 401 unauthorized as response and application throw user to log out.
I am using token in first time so not have much information about access_token and refresh_token
So, I do not know how to handle this situation.
advises is appreciable.
Whenever you make an API call to load data on the page, in the callback you should check the status code. If the status code is 401, get the refresh token and then make another call to the same API and then only initialize the app. Otherwise initialize the app with the old response value.
Thanks #Kushal and #sahil to provide idea.
When user's token is expired app redirect them to login page so on login page added api call to fetch token by user's refresh_token and if user has correct refresh token then assign them to new token and redirect to page which user refreshed by tracking / maintain log of current page of user are. and its working.
Thanks again.

OAuth 2.0 with GMAIL API using

I am trying to create a sample program for Install Application to access google mail api using oAuthentication. But I have a query before start working on it.
I read on most of doc and following this link https://developers.google.com/identity/protocols/OAuth2InstalledApp
First we need to request for token by providing ClientID and SecretKey
That will return Token in response that Token is pass to other google service which we want to access.
During this process code open the browser (Single time) to get token id. It can not happen without browser.
Can't we do http request to google then get respond from it without using browser, like access any rest api we do?
From Google's Using OAuth 2.0 to Access Google APIs:
The authorization sequence begins when your application redirects a
browser to a Google URL; the URL includes query parameters that
indicate the type of access being requested. Google handles the user
authentication, session selection, and user consent. The result is an
authorization code, which the application can exchange for an access
token and a refresh token.
The application should store the refresh token for future use and use
the access token to access a Google API. Once the access token
expires, the application uses the refresh token to obtain a new one.
You have no choice but to redirect the user to Google the first time the user is using your application. However, you can ask for a refresh token that you can use to refresh the access token after this first login, which usually expires after one hour.

Handling Page Reloads With OAuth Access Code In URI

I've run into an issue when using OAuth 2 authorization codes in an web app's URL, such as is returned by Google's OAuth method (https://developers.google.com/accounts/docs/OAuth2Login).
I've been using the google redirect method; where you redirect the user to a Google URL, passing in client_id and redirect_uri. The user authenticates and the authorization code is passed to the redirect_uri as a
The issue is that the access code stays in the page URL, so if the user bookmarks or posts the URL, they are sending an invalid Authorization Code.
Eg:
http://myapp.com/?code=kACASDSDdAS81J5B8M_owCyUNgV46XdZaqBBMh4T8OJFEKPRrgN7gtiFOcMW5Fv3gk
What is the best way to handle this case? Ideally, I would like to send the authorization code in a POST body as it isn't visible to the player?
I've spent a bit of time looking at Google App Engine (the platform I'm using) to redirect the user, but can't seem to send a POST body in a redirect.
After the user is directed to your app with the authorization code in the URL query parameter, you should:
1) Exchange the authorization code for an access token by making a HTTPs POST to Google's OAuth 2.0 token endpoint and save that access token as appropriate (datastore, memcache, etc)
2) Redirect the user to a URL without the ?code. You can't send a POST body in a redirect (HTTP doesn't allow it), but that shouldn't be necessary if you store the access token server-side for making API calls.
If you must make the token accessible client-side, you can:
a) Send it back as a cookie along with the redirect (which exposes it to the client, though you could encrypt it) OR
b) Generate a HTML form, with JavaScript for auto-submitting it instead of doing the redirect. Kind of ugly, but common.

Resources