Allowing api request only from SPA

Question

I am building a web page with ASP.NET Core and angular 8 (hosted together). I want to allow requests to my API only from SPA.

At this point, I think to create some kind of rule of hashing that only frontend and backend apps know. For every request I will calculate hash and put it in header of the request. After I receive request, I will calculate hash again and compare it to the hash provided in the header. If they match, then it's OK.

I am interested in how much secure is it and is there any way to hack it.

I am new to angular and I am also interested in if there is any possibility (in production mode) to write some kind of js code (by app user), which will call my 'send request' method (i.e not by clicking button).

EDIT:

I use standard jwt token based authentication in my app, so there is no possibility to access api resources if user is not authenticated. What I want to achieve is that authenticated app user (developer) should not be able to make request from other sources like postman, C# code, browser console for example.

I have some 'valuable' data and I want it to be visible only my web page. I want to eliminate stealing facts..

Answer 1

There is no real secure solution for your requirement. The reasons for this:

• JavaScript code is always readable. Every user can read and debug your SPA and whatever logic you add to protect your requests, developers can see and re-implement in their own app. You can try to make their life harder... that's all.

• That said: You cannot include secrets in your code. Secrets loaded during runtime will be visible if developers debug your code.

• Your server cannot see what's the client app because native apps will use any http headers and look exactly like a browser.

The common "solution" for this is to limit and block by the number of requests from an IP assuming that the amount of data typically requested in interactive usage is low.

---

A simple way to make life harder, may be to switch to websockets (signalR) instead of http requests - assuming standard crawlers are limited to http.