Client Side Rendering and API Security

Implementation
,
#1

My question is regarding the security of APIs as it relates to client-side rendering. Recently, I’ve been making web applications using Vue.js or React, and letting them make requests to a backend API.

Since both of these frameworks are made with Client Side Rendering in mind, however, I am wondering how this may impact the security of my API. Since the requests are being handled client sided, what prevents anyone from looking at the code of my website and viewing the API endpoints, reverse engineering them, and making their own requests and messing with data? (especially on User account endpoints).

#2

If the API connection logic is on your site and not on a server then there is nothing preventing a malicious agent from making the requests on behalf of your site. There are two important distinctions to make here, each one with a potential solution.

  1. User endpoints. You implied user account endpoints are of special concern. Take into consideration that these endpoints will usually use a token instead of an API key. These tokens are created during sign in. As long as you render API data only for authenticated users then you have reduced your exposure to your registered users and can track abuse of endpoints through their tokens.

  2. All other requests to endpoints such as open APIs and third party vendors like maps, flights, sports, etc. that you want to display regardless of authentication are a bit more tricky to secure. In this situation you can use KOR Connect to reduce the exposure significantly. It reduces exposure because it validates that requests are always coming in from the front end’s domain by using recaptcha as an attestation service. It also detects abusive traffic patterns and expires the request automatically.
    Mind you that this solution will complement the User endpoints use case nicely as it will reduce the risk from authenticated users as well.

1 Like