Usage of Strapi API Token

[Johannes-Schiel]

I looked in the documentation and i need a feature so i can make a request with nuxt to a strapi backend with the help of a api token that i generated in strapi is there a possibility for this or would this make any sence to have this feature? When yes i would volunteer to build something like that.

[mh35]

👍

[benjamincanac]

There was some discussions about this in #254 and #322.

I'm still confused about why you'd want to do this, @nuxtjs/strapi composables are not available on the server, so this mean users will have access to your API token when fetching this data.

[Johannes-Schiel]

Strapi can generate a permanent api token that don't connect to a user. I need this because there is no login to my project but not I can't set the route in Strapi to public because of legal reasons. Because of this ask the question, currently I creaked my own solution.

So this can be closed.

[dmitriybraginets]

There was some discussions about this in #254 and #322.

I'm still confused about why you'd want to do this, @nuxtjs/strapi composables are not available on the server, so this mean users will have access to your API token when fetching this data.

@benjamincanac Could you please tell us a little bit about why the composables are not available on the server? What is the reason for this in this case? I want to build the SSR application using Strapi as the CMS backend. I don't want to make my CMS public, so I just created an API token, which is the common Strapi technique.

Last but not least - using useStrapi all the data fetching happens on the backend side and I get the HTML string on the doc request from the browser. Probably I didn't understand you correctly about the "@nuxtjs/strapi composables are not available on the server" statement.

[philipimperato]

Doesn't this assume that the @nuxtjs/strapi package is only compatible with user / cookie auth? Should that be in the docs?

[idesignzone]

I looked in the documentation and i need a feature so i can make a request with nuxt to a strapi backend with the help of a api token that i generated in strapi is there a possibility for this or would this make any sence to have this feature? When yes i would volunteer to build something like that.

in Nuxt 3 you will need to setup a server API route ./server/api/createNew.js
Here is an example of how it may look like

export default defineEventHandler(async (event) => {
  const docBody = await readBody(event);

  const apiUrl = process.env.STRAPI_URL + "/api/contacts";
  const requestData = {
    data: {
      name: docBody.name,
      email: docBody.email,
    },
  };

  const headers = new Headers({
    "Content-Type": "application/json",
    Authorization: "Bearer " + process.env.STRAPI_TOKEN,
    Accept: "application/json",
  });

  const fetchOptions = {
    method: "POST",
    headers: headers,
    body: JSON.stringify(requestData),
  };

  const response = await fetch(apiUrl, fetchOptions);

  if (!response.ok) {
    console.error(`Error creating new item. Status: ${response.status}`);
    return [];
  }

  const responseData = await response.json();

  return responseData;
});

Now call this endpoint in your nuxt application.

<script setup>
    const res = await $fetch("/api/createNew", {
      method: "POST",
      body: {
        name: "name_value_from_form",
        email: "email_value_from_form",
      },
    });
</script>

This way you are making an authenticated request to strapi without exposing your credntials.

[philipimperato]

This way you are making an authenticated request to strapi without exposing your credntials.

This doesn't use @nuxt/strapi.

[idesignzone]

This way you are making an authenticated request to strapi without exposing your credntials.

This doesn't use @nuxt/strapi.

Well Strapi Nuxt Module compostables are meant for client only. They won't work on the server.
Request headers in client side are exposed.