My simple application written in Javascript is using a service (which is written as a wrapper on Auth0) for authentication. On successful login, if I refresh the home page, application again goes to login page (even if I have stored the access token in cookies)
I also tried to store the access token in browser session storage.
As my index.html is launched, i am checking if my application url contains access token. If there is no access token, I redirect it to login page.
if (((window.location.hash).indexOf('access_token') < 0)) {
location.replace(redirectUrl);
}
On successful login, as url has access token in it, app works fine further.
But next time when I refresh the home page, it don't have access token in URL.
As per my understanding, as I have access token in cookies, it should not ask me for login again as long as token is valid.
It is still asking for login. What should be the strategy should I use to persist the token ?
On logout, I am setting the cookie to expire. Is there any ideal way to do log out other than this?
This can often be troubleshooted with a HAR file capture to follow the trail being left in the authentication flow. However since we don't have that option at this juncture here are a couple things to look at.
Are you using Dev keys in your auth scenario?
Expiry time
Where is the access token being stored?
https://auth0.com/docs/tokens/overview-access-tokens
Currently, you have a somewhat incomplete implementation.
As per my understanding, as I have access token in cookies, it should not ask me for login again as long as token is valid.
Saving token in the cookie storage and local storage does not have any relation with user authentication state. It is just a way of persisting the token and reading the data. In each navigation, you need to read the token and extract the information from the token to make sure user is authenticated.
The architecture you should follow:
Redirect the user to /authorize endpoint if there is no valid token in the application.
Once auth0 finish the user validation, the user will be redirected in the whitelisted callback URL. Make sure this URL is unique and save the token from URL fragments. It is very important to complete the token validation on the client side. Otherwise, it will be a major security issue. https://auth0.com/docs/tokens/guides/id-token/validate-id-token
Redirect the user to the secured URL.
I would highly recommend using auth0 SDK as it mitigates all the security issues including token signature validation using RS256 algorithm.
https://auth0.com/docs/quickstart/spa/vanillajs/01-login
You may find folloiwng thread useful
Why my auth0 token expires when refreshing page or clicking link in my Angular app?
Related
I have an aplication which is using jwt authentication, so i have an api /login, where i generate jwt like:
res.cookie('Authorization', 'Bearer ' + token, {httOnly: true});
When i login in on front end, in react js, the server generate jwt token.
Questions:
How to manage jwt on front end, after log in? (now the token is sent in cookie and i can't read it using javascript), and when i go to another route after login, i have to send back from front end the token, but it is only on /login page not in second route. I now that i can handle token using localStorage, but this s not secure. So, how, in my situation to send back the token if i navigate after login on another page?
If you don't switch domains, and the cookie path is global, then you can access it from any page in the front-end. See: https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies
Also, I would think twice before going with cookies. I would suggest using short-lived tokens (30 mins) with refreshTokens (30 mins) in localStorage and send them using the standard Authorization header, and not having to worry about someone stealing them. (Just don't store sensitive data in there). The refresh token will periodically require a new pair of token/refresh, before the time runs out.
There is also sessionStorage if you wouldn't like to persist the data for a long time: https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage with the trick that, each tab/window has separate sessionStorage.
I have a Keycloak server setup with a realm and a client. I have Authorization setup on the client and I'm able to evaluate the authentication within the admin interface.
When I click "Show authorization data", I can see in the response an authorization attribute with permissions.
I have a web client that uses a redirect via keycloak for oidc authentication. I would like to limit which keyclock users are able to login into the client, so I would like to authorise the login, but I'm unable to see the authorization attribute in the JWT.
Am I completely misunderstanding how this works, or is there something I can do to see that attribute?
OK, I've finally go my head around it. Short answer - I needed to RTFM.
Long answer - I needed to hit the token endpoint twice. The first time with grant_type = authorization_code to get the access token. Then again with grant_type = urn:ietf:params:oauth:grant-type:uma-ticket (and with the access token in the header) to get the keycloak client to authenticate.
If the second response comes back as 403 - access_denied, then I reject the login, otherwise, I allow the user to login into my system.
The specific bit I needed can be found in the docs is here: https://www.keycloak.org/docs/6.0/authorization_services/#_service_obtaining_permissions
I have used the Youtube-api and also created the oauth-clientId for some demo project. I also used the Client libraries (java & javascript) for uploading videos to my channel and i succeeded. But i don't want to share my login credentials and want my client users to upload videos to my channel. Is there any way, i mean documentation or procedure or youtube-implementations?
Assuming that you are using Java as you said. You should have a refresh token after your application has been authenticated.
The refresh token can be used to request a new access token. You should use this refresh token to allow others to upload to your channel. Note: To my knowledge you cant get a refresh token with the JavaScript client library due to security issues. You need to use a server sided language to do this.
For Refrence:
YouTube does not support service accounts so that wont work. API Key is only used for accessing public data so that wont work either.
I finally found an answer to my question and now my users[whom i give some authorizations] can directly upload to my youtube channel.
As per the comments i received for my question, i came to the conclusion that i have to do it at the server side because of the security issues.
The thing which came to rescue is namely Refresh Token.
I first created a simple application through which i logged & uploaded video [uploading is not necessary] into my youtube account and received the respected refresh token
Then i saved that refresh token through which i created a Credential object manually.
You can check the code provided by google :
UploadVideo.java
Credential credential = Auth.authorize(scopes, "uploadvideo");
This is what i replaced with this and obtained my own refresh token.Refresh token does not expire like normal access token, and is used to generate normal access token when needed. So, refresh token was the key to my question
Then at the backend, the only thing you have to do is just create the Credential manually. You can use this code
getCredential = new GoogleCredential.Builder()
.setJsonFactory(JSON_FACTORY)
.setTransport(HTTP_TRANSPORT)
.setClientSecrets(clientId, clientSecret)
.build()
.setRefreshToken(refreshToken)
// The refresh token here will be the same you received offline.
Here is the official google doc about this concept
Refreshing an access token (offline access)
Access tokens periodically expire. You can refresh an access token without prompting the user for permission (including when the user is not present) if you requested offline access to the scopes associated with the token.
If you use a Google API Client Library, the client object refreshes the access token as needed as long as you configure that object for offline access.
If you are not using a client library, you need to set the access_type HTTP query parameter to offline when redirecting the user to Google's OAuth 2.0 server. In that case, Google's authorization server returns a refresh token when you exchange an authorization code for an access token. Then, if the access token expires (or at any other time), you can use a refresh token to obtain a new access token.
Requesting offline access is a requirement for any application that needs to access a Google API when the user is not present. For example, an app that performs backup services or executes actions at predetermined times needs to be able to refresh its access token when the user is not present. The default style of access is called online.
Server-side web applications, installed applications, and devices all obtain refresh tokens during the authorization process. Refresh tokens are not typically used in client-side (JavaScript) web applications.
I have a problem understanding the principle handling of oauth 2.0 tokens.
My scenario is, I have a web based frontend backend system with node.js and angular 2.
A user should be able upload a video on this site. Then some additional metadata is created (dosen't matter for this question). When that is done, the user could upload the video to youtube with the additional data by clicking on a button.
My question is how many tokens/credentials are there in this process. The youtube api needs an oauth token. Does the user also have its own token?
Here is the tutorial I used:
https://ionicabizau.net/blog/14-uploading-videos-to-youtube-using-nodejs
As you can see one token for the API is created for local testing. But is this token generated in a different way in a live version? And how is the user of my website recognized. Also via this token? Or do I have to generate a second token for him?
I am not sure what you mean by 'Token'.
In order to access any Google API you will first need to register your application on Google Developer console. You will then need to create Oauth2 credentials. Oauth2 credentials is were your application will request access from a user to access the data on their YouTube account.
On Google Developer console you will need to save the Client id, client secret and the redirect uri. All three will be needed by your code to authenticate the user.
When the user grants your application access to their YouTube data. You will get an access token and a refresh token back from the authentication server. Access tokens are short lived about an hour and are used to make requests (like upload) to the API. A refresh token can be used to request a new access token once the one you have currently has expired.
You will probably end up with the following:
client id, client secrete, redirect uri, and a refresh token.
If you are interested I have a tutorial that is part of my Google Development for beginners tutorial series that explains Oauth2 and how it works.
An access token is generated from the Server side and sent back to client from where the access request is generated. For all the subsequent requests you need to pass the access token which will be verified with the signature of the token saved on the server to check the authentication of valid requests. You will only get 1 access token which will be used.
You can also use "Refresh" tokens in case you need to keep your access tokens valid for longer duration.
I am trying to wrap my head around the G+ Sign-in flow, but I am not sure if I have gotten it right.
I have mainly been looking at this page
Where in that flow can I connect to my own database and fetch things such as username and permissions, and what am I supposed to store as identifier in my database (to quickly identify them next logon)? Should I talk to the G+ API and get their G+ ID and then store that (together with the data I want to store about the user)?
How would the flow look the second time they sign-on?
I need something that will in the end give me the G+ ID (if I used that) so that I can find them in my DB.
The quickest way to get going with Google+ API calls is the Google+ Quickstarts. These samples will get you going with code that should be ready to copy and paste into your applications. I'll shortly discuss the flows demonstrated in the apps.
As with OAuth 2.0, the goal is to get a bearer token (access token in OAuth 2.0) to authorize API calls. The token can be retrieved a number of ways, but the most important for sign-in using the Google+ Sign-In button is code exchange.
The first time a user encounters your site (let's call it sign-up) the flow will be code exchange. The code exchange pattern is:
User reaches your site
User clicks preferred authorization (Google+ Sign-In)
User is presented with consent / authorization screen
Code is returned from JavaScript to the web client
The Web client (HTML/JavaScript) passes the authorization code to your server
The server exchanges the code for a refresh and access token then caches these tokens
At this point, your server has an access token. This means that you can make API calls (e.g. plus.people.get('me'), which gets the signed-in user's profile) to Google based on the user permissions granted to your app.
The user should now be authorized with your server and authentication should happen based on the user's session and so forth. However, now you have a new problem, what happens when the user accesses your site again from a new browser, or otherwise destroys their session?
This is a great time to transition to the next important flow: the authentication (let's just call it "sign-in") flow. For sign-in, you should have the client pass your server an authentication credential (again a bearer token) and then verify the credential before establishing a new session for the user in your database.
The verify token examples on the Google+ Github page demonstrate concise code for sending and verifying ID tokens.
Let's discuss the details of one approach to passing a type of bearer token, the ID token, for authentication.
User signs in to your site
The Google+ Sign-In button returns an ID token in a callback
The client securely passes the ID token to the server
The server verifies the ID token*
The client session is then authenticated
The steps for * are best put in another question, however a typical set of tests includes:
Verify the token's certificate is Google's
Verify the client id is for this app
Verify the user has an account on your site (optional, do this if you need offline access)
Verify the token hasn't expired
Hope that clears things up for the two.
There is one final flow you should be aware of, used for offline API access, token refresh. Token refresh happens when you have a refresh token and an expired access token. For Google's implementation of OAuth 2.0, access tokens expire after 3600 seconds (1 hour). Because these tokens expire, you need to be able to get new access tokens when your stored access tokens expire. To do this, you pass three bits to Google:
Refresh token (retrieved from code exchange)
Client ID (retrieved from the Google developer console)
Client secret (again, retrieved from the Google developer console)
These parts are passed to the Google OAuth server and the server will then return a fresh access token that you can use for offline API access.
There's a wealth of information on this topic, see also:
Using the one-time code flow for Google+ Sign-In
Google+ Developer documentation, Token Verification