I use axios library in vue for authentication (POST with headers) on Trustpilot but the browser send a pre-fligth calling and the Trustpilot API respond me with error because OPTION method is not Allowed.
I suppose that the authentication request is a simple request (https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS) but axios make it as a not simple request and the browser call a pre-fligth request. There is a method for fix this problem?
Thanks
You can't do a browser call to the trustpilot oauth endpoint. Cause the Authorization consists of your apikey and secret. Exposing that to a browser client would be vulnerable.
Your server will be able to call the API.
If you don't have a server, then redirect the user to https://authenticate.trustpilot.com with your client_id and redirect url, where the user is able to login in.
You can see more details here: https://developers.trustpilot.com/authentication#implicit
Related
Friends, in the Authorization code flow, it states that after the /authorize call is initiated and success, the authorization code will be sent via HTTP 302 "redirect" URL to the client(say ReactJS webapp). Why the OAuth specification requires this to be sent in a redirect so the authorization code is sent in URL parameters exposed. I know it is recommended to use PKCE to handle this auth code leak issue, but my question is why OAuth spec requires us to send the auth code in 302 redirect in URL params in the 1st place. Why cannot the client(ReactJS webapp) place a simple GET request to the IDP and why cannot the IDP send back the auth code in the response body to the react JS application(say by xmlhttprequest). Any help is appreciated. Thanks.
If you use a OAuth2 service like Google, or some other service, and your react application would be able to handle the entire flow it means it can completely act on behalf of the user.
By requiring a redirect, it means that the user's own browser will go to the auth service's website, which is the only place the user can trust to safely enter their password and grant access to your application.
The URL in the addressbar means trust. Users are trained to never enter their password in a website they don't recognize.
I'm currently trying to implement silent refresh follow this workaround
However, even when I'm logged in, if I try to do an AJAX GET request to the oauth2/authorize endpoint, I get a status of 200. I tried going to the URL in the browser directly, and it worked. Do I need to pass additional information?
Any help would be greatly appreciated, thanks!
I ended up solving my own problem and was able to not have to use an iframe.
Solution to original problem (I was using authorization code flow):
Set up an endpoint on your server with a silent response that FusionAuth can redirect to (endpoint 1).
Set up an endpoint that you will call from your app to perform the silent refresh (endpoint 2).
From the app, send AJAX GET request to endpoint 2.
On the server side of endpoint 2, send AJAX GET request to FusionAuth with redirect_uri=(endpoint 2)
On success, get redirected url. (In express.js with axios I did response.request.res.responseUrl)
If the url is current server host and not the fusionauth service host, complete auth code flow. Return the token and tell the browser that the user is logged in.
In all other cases the user is not logged in, so return to app that user is not logged in.
I have a Vuejs application created using Nuxtjs. I am also using Django as the backend server, and I made an API to interact with the backend server (Django) and front-end app (Vuejs/Nuxtjs). And any API related fetch are done in the AsyncData function of the page to render the data on the server-side using axios. Also, I am using json web token authentication, and the API generates a jwt token after successful login which is stored in the cookie. So on the backend, it will always check for the request's authorization header for the token. If the request is from a logged in user (authorized token) then return authenticated json data, or else return non authenticated data.
The problem:
When the user navigates to the app, I would like to check if the user is authenticated. If the user is authenticated, render the authenticated page. If not then display non authenticated page.
My thoughts:
When the fetch is done from the App on the AsyncData function, I would check whether there is any value for the cookie. If there is then send the token with the request's authorization header. But, since the page will be rendered on the server first, and not on the client side (where the cookie actually is) it will never find the token for the authorization.
How can I check if the user is already logged in or not so that I can get authenticated and non authenticated data respectively from the API?
Update
When I successfully log in (post authorized email and password), I get a json response back with the token, which I set in the cookie like this:
this.$cookie.set('my_auth_token', this.token, {expires: 15})
How can I retrieve client side cookie and into the nuxt server for server side rendering?
Cookies are exposed in the (Express) Nuxt server through middleware.
Specifically, they can be read from the req.headers.cookie property. You can see an example implementation of this in the Nuxt documentation.
Regarding your implementation: fetching the privileged data from your API using Node would seem to be the ideal way to delegate session handling to that single service (rather than both) and provide SSR for your users.
If you've chosen to instead implement your session handling on the Django service then you'll need to "forward" your cookies by passing them into your axios request headers.
I did something similar using Firebase authentication. There is an example project on Github as well as a blog entry outlining the important files and configuration used in the application.
I've registered as a developer with eBay and created an app.
I generated an Oauth (not Auth'n'Auth)
Using Postman to generate a simple request (image) and recieving an error for token invalidity
Error: Invalid access token. Check the value of the Authorization HTTP request header.
What am I doing wrong here?
If your token is for "sandbox" environment, make sure you use sandbox API endpoints for your requests as well.
Instead of https://api.ebay.com/buy/browse/v1/...,
try https://api.sandbox.ebay.com/buy/browse/v1/....
One of the issues which might have happened is:
The access token might have expired
Use the refresh token to refresh the access token when it expires — you know when to do this when your call to the API returns a status code of 401 and the above body you saw in Postman.
normally browser stores and adds authentication header automaticly after successfull authentication.
I have a XMLHttpRequest and added the authentication header for basic auth. No problem at all.
Then I try to send a second request to the same url that is basic http protected without adding manually the http request header to this request. Poorly it seems that the browser is not storing the authentication provided in request 1. My goal is to add the authentication handler transparently to every request that follows the first one (like a native browser do).
Any idea? Thanks.
Browser only storing authetication requested from user. So, if you send 1st request w/o authentication fields, browser will prompt user for auth this time, remember credentials and use it for next requests transparently.