Calling a secured REST api from Javascript without user login screen - javascript

How would you call the secured REST api from the Javascript script application that doesn't have the login?
I have a Javascript application (React) that doesn't have a user login. It needs to call some REST api services that uses Oauth (Azure Ad -
WindowsAzureActiveDirectoryBearerAuthentication).
Those REST services have CORS enabled.
I also registered my web application in Azure Ad.
The issue is that the javascript application needs to call https://login.microsoftonline.com/{{tenantId}}/oauth2/token to get the access token. I found no way to enable the CORS for that URL. My JS application doens't have any login so I can't show the login screen in popup or use adal js.
The solution that I come up with is that I put my Javascript application in NodeJS (Express). The JS call the NodeJS that calls the login.microsoftonline.com to get the token and pass it when calling other secured REST services.
It works great but I think there might be some security issues around that.
Is there any better way to design this kind of application?

What you are doing is the proper approach. It keeps all the Oauth tokens secure on your server without having to expose them client side.
That is the main reason most Oauth2 API's don't implement CORS

Related

HTTPS on localhost for OAuth for a desktop application

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.

Best security practices for OAuth 2 authentication in a Javascript application

I've a REST API, with an OAuth 2 authentication mechanism (FOSOAuthServerBundle on a Symfony 3 application).
To get/refresh a token, the URL look like : https://api.example.com/oauth/v2/token?grant_type=[password|refresh_token]&client_id=[client_id]&client_secret=[client_secret]&username=[username]&password=[password]
This works great on server-to-server calls, but can't be applied on Javascript apps.
How can implement API Oauth 2 authentication from a front application ? (JWT is not present on the server).
In the context you described, the best option (if not able to change the api) is to create a thin proxy to add another layer of protection to your token.
Given you are probably a javascript developer, you can easily use AWS API Gateway + Lambda to create that without needing a server.
A server dies every time someone implements OAuth in a single page is
web-app. Stop the genocide! Use a server side proxy! Act now!
— Alex Bilbie (#alexbilbie) (https://github.com/alexbilbie/alexbilbie.github.com/blob/master/_posts/2014-11-11-oauth-and-javascript.md)

restrict access to to web Application

I have a JSP webapp developed in Eclipse as a dynamic web project.
we use a third party web application that invokes my application, I need to validate that only the requests that come from that application are allowed to create a new session in my application.
I´m tring to do it with javascript and thinking , as a last resource, to use a Filter class to know the request origin and define the behaviour.
the problem is that the user requires that the operation is done on the client side, meaning I have to use javascript or similar, I have read about document.referrer on JS, but so far nothing is shown on the console.
Anything that you do in the client using JS for handling sessions wouldn't be secure as it can be easily modified by a malicious user. Also, using the referer or any other http header params would be insecure as they can also be easily spoofed.
If this third party application is directly calling your application I imagine that you have some degree of control over it. Can you access and modify its source code or are you just using configuration params?
Ideally the third party application would use an authentication token on each request that it makes to your application. And these authentication requests as well as all the session handling logic would always be handled on the server side.

Authenticate chrome extension with Django backend

I currently have a backend written in Django and a chrome extension which makes rest requests to the backend. The backend is set up for user registration and login through a webpage.
I'd like to authenticate users in the chrome extension such that they can login once and the chrome extension will maintain the session across multiple loads on different pages. All rest requests from the extension should then be authenticated with the ability to tell which user is making a given request in the handler for the request.
I am very unfamiliar with this type client-server authentication and after a look around it looks like oauth or simple https header authentication may be the way to go. I am uncertain about oauth as this seems overkill (and I am generally unfamiliar with it), while I'm not sure how to maintain the https authentication across uses of the extension. Could someone sketch out the necessary elements from the Django backend through to making the login and subsequent rest requests in javascript?

Facebook API: How to authenticate a web app

I am attempting to write a plugin for a webapp that integrates it with facebook using the Javascript API. The application is installed by our customers on their own servers each with their own site names. This poses a problem to me as Facebook wants me to specify a site url for the application. This url is going to be different for every customer. Creating a new application for each customer is not an option.
In my research of this problem it seems that I have to pretend to be a desktop app and follow that authentication path. I cannot figure out how to do this.
Anyone have any idea how this can be done?
Are you going to host the app as a canvas app or outside facebook?
Is the url important to you? There is a strict one-to-one relation between base-url and application.
What many apps do is host the apps as directories in their domain. For example http://crazy-fb-app.com/customername
That's your options basically if you want to use Javascript SDK.
If you're going to be using server side technology you could have the user authorize the application while requesting permission to access user's data while he's offline. in that case you will receive a non-expiring (or long-expiring) authentication token which you can use from the server to make Graph API calls on behalf of the user. For some stuff you can obtain an Application Auth token (which is shorter and non-user-specific) to make calls to the graph.
Rotem

Categories