API Authentication and Securing Data Best approach working with Angular JS and .Net Web API

Hello ,
               I am working on a project in Angular JS . We have developed an API (.Net MVC WebAPI with oAuth Authentication ) for any sort of Data,Business logic and server side stuffs . Angular Web App and Mobile apps consume This api for their data needs . I want to know the Best approach i should follow for API Security .

My Concerns

1. Angular JS is client side framework and keeping any secure data (credentials/Encryption Keys ) for authenticate Every API Request from Client App/ Mobile App are not secure enough.

2. This API also has few methods which i have to use without login (public) like

            A. Register a User
            B. Creating A Retail Order and payment .

How can these methods be protected without any authentication ?

3. How can i secure my information passing from Angular App To API like Credit card details ? Is using HTTPS enough secure ?

What Currently we are doing
i have review so many articles and Found oAuth 2.0 is best with JWT which i am currently using too but currently we issue token only after Login page so Secure pages and api methods going well and pubilc methods are still public .

please help

Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Julian HansenCommented:
1. There is the local storage option but I would not use that either - consider the browser space as insecure and keep anything that is sensitive in the session data on the server

2. Protected in what way?

3. HTTPS is about as secure as you are going to get in terms of data over the wire - banks and finanical institutions use it - if you want more security than that you probably should not be playing in the internet space.

Bottom line - give to the browser what is necessary to make the application work but do not trust the browser either in what it gives you (the server) or in its ability to keep a secret (hiding sensitive information from prying / unauthorised eyes).

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
I don't quite understand the problem. If an Angular App must authenticate itself against some login server before accessing some sensitive data, one just needs to authenticate in angular and ensure that the API server accepts such credentials(a JWT). This is usually done with OAuth 1 or 2, and it you are very user friendly, a host of other login possibilities, like Facebook and Twitter.

That said I'd use a module like https://github.com/lynndylanhurley/ng-token-auth or https://github.com/sahat/satellizer. I myself are in the process of authenticating with the latter module. The problem I have is that my legacy server app does not support Token Authentication, so I'll have to implement that first. Then each Angular request will send an authentication header with a JWT which (legacy-wise) I'll then have to validate.
Julian HansenCommented:
If an Angular App must authenticate itself against some login server before accessing some sensitive data, one just needs to authenticate in angular and ensure that the API server accepts such credentials(a JWT). This is usually done with OAuth 1 or 2, and it you are very user friendly, a host of other login possibilities, like Facebook and Twitter.
And what is to stop someone doing a view source on the code and stealing the credentials?
Usually these services are accessed from a server script that hides the credentials OR the authentication method includes checking the key against the requesting domain name so that it can't be used on another site (like Google Maps for instance)
Take a look at the flow diagram ng-token-auth here (https://github.com/lynndylanhurley/ng-token-auth#conceptual) note where the actual authentication takes place. The auth token is placed in a cookie that is then used to proceed. If I read the diagram correctly - nowhere are is the auth data  (username / password) present in the browser - it is entered by the user in a login window and an Auth token is returned.
In the context of your question asked - point 1 was about storing credentials client side - don't. In terms of protecting the registration and email pages - what is your thinking here - if you are not already registered and don't have a sign in - then how would you get to a protected registration page - maybe I am not understanding the question?
Acronis True Image 2019 just released!

Create a reliable backup. Make sure you always have dependable copies of your data so you can restore your entire system or individual files.

No, you have totally understood the question, as well as I, or else you would have not posted MY link to refer to the diagram. When I wrote "must authenticate itself against some login server" I meant that the app does NOT have a login, but obtains the login from the authentication server, the API server issues in response a local JWT (and NOT a cookie) to the app which will send it on every request in the HTTP header.
Julian HansenCommented:
Going back to your point 3 = regarding security. If you are using HTTPS that is usually enough - but you do have the option of encryption on top of JWT which you can add.

The trend is definitely going in the direction of token based authentication - so you are on the right track with that.

In terms of design some things to think about is what information to cache on the browser side - from what I have read the best practice seems to be to store the sensitive stuff server side and only store the token on the client side - this would be my preference.
Anirudh Krishan VaishnavAuthor Commented:
Hi ,
          Thanks for all your help .

1. Resolved . Token would be saved by cookie so no need to store it on local storage.
2. Public Methods . Few processes (public ) don't have Authentication like public shopping carts. for example http://amazon.com/ is a public shopping cart. there is no login to view products  . so i was referring for protecting these kind of public API Methods (getting products) . i think checking domain can be only idea to protect them ?
3. For 3rd point my main concern was Protecting Sensitive information when we submit to API. Client app submit payment or credit card information during the checkout . i tried Encryption but Encryption code on client side is not protected again . i could find only HTTPS can transfer information securely .

Julian HansenCommented:
You are welcome,

On the securing of data - there is only so much that can be done - at some point the data has to be captured and moved from owner to server - that is an unavoidable requirement - you cannot completely eradicate risk - but you can make bring to within acceptable limits which HTTPS does.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.