Protect your API

It’s common that front-end UI and back-end APIs are decoupled and that you will want to call your back-end API knowing it is securely authenticated.

Set up Kinde

Link to this section

For additional security we recommend you register your endpoint as an API in Kinde.

Set up front end

Link to this section

Audience

Link to this section

If you have registered your API in Kinde as above, you will need to make sure to pass the audience as a parameter in your authentication url. If you are using our React or JavaScript SDK this is handled for you.

This ensures the access token you receive when the user signs in, will contain the audience claim.

Calling your API

Link to this section

When you make the call to your API you will want to ensure the access token is sent in the headers. An example in React for a bookstore app might be:

const {getToken} = useKindeAuth();
const [books, setBooks] = useState([]);

const fetchBooks = async () => {
  try {
    const accessToken = await getToken();
    const res = await fetch(`https://api.myapp.com/books`, {
      headers: {
        Authorization: `Bearer ${accessToken}`
      }
    });
    const {data} = await res.json();
    setBooks(data.books);
  } catch (err) {
    console.log(err);
  }
};

Setup back end

Link to this section

Now that the token is being passed from the front end you will need to verify it when it hits your API.

Libraries

Link to this section

We recommend that you use a library to verify your token. If you are using ExpressJS you can use our library or the OpenID Foundation has a list of libraries for working with JWT tokens.

Rolling your own

Link to this section

We strongly recommend against doing this, but if you have opted to go down this path, this doc provides you all the info about our JWTs.

JSON Web Key

Link to this section

It’s likely the library you decide to use will require the url for your public JSON Web Key (also known as a jwks file).

The file can be found here:

https://<your_subdomain>.kinde.com/.well-known/jwks

Audience

Link to this section

If you opted to register your API with Kinde as per the Setup Kinde step then you will need to make sure you pass the audience you registered on Kinde to whichever library you are using.