Is it possible for a REST API to be called only by the frontend app's domain?

I have a website that has an Angular frontend (https://dev.myApp.com/) and a .NET 8 REST API (https://dev.dataAPI.com/api/), Both of these are hosted on different on prem servers.

If i click on a button in my frontend, it calls the REST API with with this method:

data(): Observable<Response> {
const path = `${this._apiUrl}/Parameter/Data`;
return this._http.get<Response>(path);
}


This is how the call is logged in the browser's console: https://dev.dataAPI.com/api/Parameter/Data

This is what it returns to the app:

{
"success": 1,
"message": "Ok",
"data": [
{
"id": 27,
"descri": "URUGUAY"
}
]
}


Here's the problem: If i know the full url of the get request and i paste it on my browser, it also works:



This to me feels like it's very unsafe. We are not sharing any sensible data in responses, and anything that could be is in POST requests so whoever wanted to run them like this would have to know the format of the body of the response, but i still think that maybe this shouldn't be possible in the first place.

We are not using something like tokens to secure the communication with the API yet, so i have to think about something else for now.

I've read that i could do something with CORS, but i also read that it's very easy to circumvent. This is how CORS is set up in my API:

var builder = WebApplication.CreateBuilder(args);

builder.Services.AddCors(options =>
{
options.AddPolicy("CorsApi",
builder => builder.WithOrigins("*")
.AllowAnyHeader()
.AllowAnyMethod());
});


So first of all, is this normal behavior or it's something i should be worried about?

Is it possible for my API to check who is calling it and make it so the request doesn't execute if it didn't came from my APP?

Continue reading...