Angular and Spring rest api communication over https - javascript

I have frontend written in angular and backend written in Spring. I bought hosting and there I installed tomcat where im deploying my production backend. Im deploying frontend under domain folder on my hosting service.
Spring has jks certificate. I added this jks certificate to connectors in server.xml.
Angular has let's encrypt certificate which was generated for my domain "spotmapa.pl".
Now i have this situation:
On desktop google chrome my domain seems "not secure" and when this website makes api calls for backend it does it correct.
But in for example firefox my domain seems secure and has padlock but api calls to backend not working from there.
My api calls to backend from postman works properly, but doesnt work from secured by lets encrypt website.
I dont get any errros in logs.
I have two questions:
Should i have the same certificate for backend and frontend?
Why does unsecured origins make api calls right, but secured website https://spotmapa.pl no?


Frontend with lets encrypt was calling api secured by selfsigned certificate. This caused problem. I did lets encrypt for the backend too and it works correctly.

Related

Use RESTful API with and without JWT authentication

I have a web application with Angular front-end and a back-end developed using the Nest.JS framework.
The back-end RESTful API endpoints are secured with an SSO and JWT authentication.
Using the same web application I created a desktop application with the help of the NW.JS.
The application setup is successful and can run on the desktop OS.
Now I need to use the same back-end RESTful API endpoints without the SSO but with JWT for the desktop application.
In some situations (ex. checking for updates), I only need to use the SSO login.
How can I use the Nest.JS server endpoints for this kind of use cases.
Is there a conditional way to write annotations/middleware that we can use to check the app is running on WEB or Desktop and bypass the SSO login?
Also this should be a much secure way to protect the endpoint in both situations.
NOTE: Identifying the running environment is also has configured and running well in the application.
Thank you very much

Calling a secured REST api from Javascript without user login screen

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

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.

Should Firebase Auth with Javascript use HTTPS

First time I've begun using firebase with a JavaScript project:
firebaseAuth.signInWithEmailAndPassword(creds.username, creds.password
Since it is connecting to Google via websockets, will the website need to be served over HTTPS to avoid a security vulnerability?

Since Firebase Auth makes a request to Google's backend servers, it does so over HTTPS and no email/password data is unencrypted in flight. You should still strive to use HTTPS on your own system, and if you're using Firebase already Firebase Hosting offers free static web hosting with SSL provisioning on your own domain.

How to call secure ssl REST web API in html javascript code

I am developing an cross platform html5 javascript application. In that I have to fetch data from secure ssl enable web api. I am getting problem while calling this web api from server by sending response "access forbidden" when I disable the SSL on server it works fine. So to resolve this I have to add client certificate while requesting/communicating with these API's. I have used both jquery.ajax and xmlhttmRequest to fetch data from server in Javascript but it gives error for web api where SSL implemented. Please let me know to resolve this. Thanks.

Categories