I'm using the React Google Login package to authenticate users for my site. It works fine on desktop but when I test it out on mobile I am getting Error 400: redirect_uri_mismatch. I've made sure all my URIs are correct in the API credentials. I'm having a hard time understanding why it will work on desktop but not on mobile.
The redirect_uri_mismatch error message is very common. The redirect uri is used in web applications to tell the server where to return the authorization code to.
When a web application launches the consent screen and the user consents to authorization by defining a redirect uri the authorization sever knows where on your web server the application is able to handle the authorization code exchange step. For it to work properly each redirect uri for your web application must be registered exactly in Google cloud console for your project. This means HTTPS vs HTTP as well as ports and trailing slashes are important. How to fix redirect uri missmatch
True mobile login does not have a redirect uri, Client sided JavaScript applications also do not have a redirect uri they have a JavaScript origin.
Its hard to help you more without seeing your code but you may be mixing things a little.
For a web application you should have configured a web client on Google cloud console, if its back end then you should have a redirect uri, if its client side JavaScript then you should have added a JavaScript origin.
If you have a mobile application android or ios then you should have crated a mobile client. Which would not require a redirect uri.
Related
I'm trying to user firebase authentication (saml) within my Electron app. I have read that Electron isn't "officially supported", however I've also encountered some threads that indicate people have gotten it to work. My issue is when using firebase.auth().signInWithRedirect (or signInWithPopup), I get the error:
code: "auth/operation-not-supported-in-this-environment"
message: "This operation is not supported in the environment this application
is running on. "location.protocol" must be http, https or chrome-extension and
web storage must be enabled."
Google turns up this tips and tricks article which suggests just using a hosted URL:
Third, OAuth requests need to have a verifiable origin, which can be whitelisted in the Firebase Console. This requires the current Electron browser window to use the http or https protocol, and not file. That means the current window contents should be loaded with browserWindow.loadURL and not browserWindow.loadFile, and the url must be an http or https url, not a file:// url. This generally requires a hosted page somewhere that gets wrapped into the Electron window.
This will probably work, as just running the app locally on the angular dev server works by simply using:
mainWindow.loadURL('http://localhost:4200');
I don't want to do this because having a hosted page lessens much of the appeal of having a native app.
I could make this work in by just having a local Node/Express instance serve the app locally using get-port to find a free port to run the app there. I haven't really seen any examples showing this. There are a few Stackoverflow questions on getting it to work, but nothing that makes me think it is an acceptable production-level solution.
Is a local Express server an acceptable way to circumvent this error, or is there currently a better solution?
Note: The package recommended in this answer is not published by Firebase and anyway doesn't look like it supports SAML auth.
I had to do something very similar but with Auth0 instead of Firebase.
What I had to do was make two Browser Windows, where the first one is strictly an authentication Browser Window while the second one is the actual main App Browser Window.
Auth0 has the same restrictions of whitelisting only http/s protocols, so in the authentication Browser window, I load the Auth0 sign in URL via localhost (it’s a hosted URL in Auth0 itself). I then take the credentials (access token and refresh token) from that redirect/Oauth process and store them locally for the time being (use Keytar, SafeStorage, FS modules, whatever; I chose Keytar).
Then my authentication Browser Window closes itself and launches the main, app Browser Window.
From here onward, I have to reference my stored access token and refresh tokens from my storage location and use those in all other calls.
So, for instance, I have some API library modules I made for myself that use Axios. So I bring the saved access token into all of my Axios calls. Works like a charm.
So, in summary: I had to use two different Browser Windows and persist credentials locally for later use in the main Browser Window.
Check out Auth0’s guide on using Electron for authentication; I think you’ll find that many concepts carry over for Firebase and other providers.
i've successfuly implemented firebase email ver in my app, it is more feasible to load .html file rather than load a page from url as users can exploit the the url by sending fake data. but with oauth it is not possible,firebase create webapp you can create a html file it should contain api keys, host url etc and host it locally in android file://android_assets/filename.html this works fine even offline i dont know properly about
electron
I am creating a desktop application that using Spotify's oauth api. I am using the implicit grant flow described here: https://developer.spotify.com/web-api/authorization-guide/#implicit_grant_flow
My idea is to have an "Authenticate" button, that you click and it opens your browser. You login/approve the connection with Spotify. Then it sends you to a redirect url.
I want to set this redirect url to 127.0.0.1:58212 or some port on the loopback device.
My question is, should I use https for this?
I am leaning towards yes. One because the access token needs to be secure, and I believe other users on the system could potentially read the message when it is sent, and two because in the time it took the user to log in, someone could have taken over the port.
So I want SSL for encryption of the message, and I want to ensure I am actually talking to my app.
How do I generate certificates in this situation? I think each instance of the application needs to have its own certificate, and I need to somehow inform the computer to trust that certificate during the lifetime of the application.
I could also generate the certificate during installation, and do some step during installation that makes the system trust that certificate.
Am I thinking about this the correct way, or am I going about this all wrong?
I am using electron and express in JavaScript to write my application.
Thanks for any advice.
The best way to securely use Oauth with installed applications such as desktop applications is to use the Oauth 2 flow for installed applications. But this option would have to be implemented by the service provider. Google provides for this option.
https://developers.google.com/api-client-library/python/auth/installed-app
Unfortunately, many services do not implement OAuth2.
To use Oauth 1.0 with installed applications, instead of returning to a callback_url, the service provider displays the auth code to the user which the user can then copy and paste to the desktop application. Check out Trello Ouath integration which allows for this.
The Web Api flow that you are trying to achieve will not work in the case of desktop apps. The redirect uri 127.0.0.1:port is your local uri. The service provider will need, at the very least, your public ip to redirect the flow back to your system.
AFAIK, for a Desktop or a native app it is much better to implement the Oauth authorization code flow. The implicit grant is intended to be used on a device browser and not on a Web View.
If your app uses a Web Service to connect, your Web Service needs a redirect URL that uses https. Luckily most hosting platforms like Heroku provide this to you for free (otherwise you need to buy an SSL certificate which might be a lot of work).
On the authorization code flow, a token doesn't need to see the client, it is all stored in the backend.
Most services allow you to test on localhost with http.
I wrote a tutorial that could give you some guidance on the flow.
I am following the tutorial for azure mobile app services here.
The authentication works fine when using Cordova azure client. However, on the browser, I get the error below in chrome console:
XMLHttpRequest cannot load http://MYAPP.azurewebsites.net/tables/Users?.
The request was redirected to 'https://MYAPP.azurewebsites.net/tables/Users?',
which is disallowed for cross-origin requests that require preflight.
A workaround is to run chrome with --disable-web-security flag. However, I wonder if there is a way to fix this issue.
I have set CORS in azure portal to * which I assume allows all origins
You need to configure the CORS settings in the portal to allow the domain of the host that the web server is hosted on. For example, if you're entering something like https://www.mywebsite.com/ into the address bar to hit your Mobile App, you need to add www.mywebsite.com into the CORS settings.
I also notice the request is being redirected from http to https. Azure requires https for any authenticated requests (to protect the JWT token from man in the middle attacks) and will redirect if the request is on http. You need to change the URL in the constructor for your Mobile Apps client to use HTTPS.
I have exposed the functionality over REST services, which only authenticated user can access. My clients are JavaScript based code running on browser and Android clients.
Code is using google+ based authentication ( for both JavaScript and Android). Now with browser client it is quite easy. As REST server can determine easily with passed access token, whether browser client is already authenticated or not.
However for android client; how REST server would know, that it is already authenticated. Is there any way to get the access code in android once user as has signed it. JavaScript client get access token, is there any token in case of android which can be used.
Yes I can implement oAuth (https://developers.google.com/accounts/docs/OAuth2UserAgent) for android client without going with google+ sign-in directly. That would solve the problem, just wanted to check whether I can do without. Appreciate any help with this..
I want to authenticate users on a web application. The users are already logged into their Windows Network.
Notice, this is NOT Internet Information Server. I have a Java Application Server on the other side.
Is there a way using Javascript or something, so that a Windows Authentication can be taken, then sent to the server, and on the server, that token being validated (assuming the server is on the same network).
I have found that you can convert a token into a Windows Principal
So I need the Client part. A way to send that token to the server.
Any ideas?
If you setup your Java web application to support NTLM authentication, e.g. by using the HttpServletFilter from the Samba Java library, this should work without implementing any client side JavaScript.
Depending on which browser the client is using, you may however have to configure the browser to enable NTLM authentication against you server. If I'm not wrong, IE is by default configured to allow transparent NTLM authentication against servers on the local network, but in Firefox, you have to enable NTLM for each specific server address.