Best way to secure API and front

Hello !

I would like to secure my api.

My api is called via a public front.

Both applications are hosted on fly.io.

I would like to allow only my front app to call my API.

My front app must be accessible from the public internet and use my api.

What is the best way to secure this API ? Fly.io private network ? IP whitelist ?

Do you have other solutions ?

Thank you for helping

The best way to do this is to make your API private and proxy your API requests from the front end to your private API via the .flycast endpoint.

So I can call my private API directly from my front (public) with this url for example:

https://my-api.flycast ?

What exactly do you mean by “the front app”? Do you mean the part that runs in the user’s browser?

Exactly

When you said you had 2 fly apps, I’m assuming your front end app has some kind of web server. That’s where you’d proxy to your API endpoint, not directly on the browser

In short: look at what your tools provide in terms of authn/authz. Also, your backend stack’s community might be more able to help - it feels like it’s not a Fly-specific problem.

You can’t really verify that a request to your API comes from a browser running your code. It’s not a Fly problem, or a browser problem - it’s how networked computers work. Anyone can just poke that API by hand, use some handy tool like Postman, or “copy as curl” from browser’s network tab and than play with it.

The best way to secure an API is to use authentication and authorization tools that come with your backend’s framework. You should verify who uses the API (probably by some kind of login and sessions setup), and in your app’s code decide what they can access based on their identity.

If you can’t put authentication at your current API’s level (for example if it’s some 3rd party product), then @khuezy’s suggestion to run a little fronted-specific proxy might help. But it all depends on what you are doing, why, and with what tools :slight_smile:

Yes the proxy idea is great. Thanks!

To summarize for the moment I have set up a proxy at the level of my frontend application (which is public). The proxy redirects requests to my backend which is also public.

This secures a first part.

Here is the path

Request => https://my-app.com/api/product => Proxy nginx => https://my-backend.fly.dev/product

Is it possible to use the .flycast url for the backend ?
Like this :
Request => https://my-app.com/api/product => Proxy nginx => http://my-backend.flycast/product

To know:

The frontend must be accessible and work publicly. The 2 apps (front & back) are hosted on fly.io

You don’t even need to use nginx here if you don’t need it. Just proxy your front end’s API requests to <your.backend.api>.flycast

Can I call a flycast url in https from my web server ?

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.