Will sk-auth work with strapi?

[magick93]

Hello

I'm currently using Strapi headless cms.

It has a feature of providing various auth providers, and this also relates to accessing cms content.

I'm interested to understand better if this is an alternative to, or complimentary to the strapi auth mechanism.

https://strapi.io/documentation/developer-docs/latest/guides/auth-request.html#setup

Thanks for your help, and for enhancing the svelte ecosystem.

[Dan6erbond]

Hi there! Thank you for opening this discussion page, I haven't personally used or setup a Strapi CMS backend with authentication myself yet, but it's something I will consider creating an example for this project when I get around to it. In any case, SK-auth is customizable and well-equipped to handle all sorts of authentication flows, so Strapi's standard JWT implementation shouldn't be an issue.

I gave the documentation a look on the auth setup, and it looks like Strapi has a pretty simple login/auth flow. So my proposal would be to create the following provider in SK-auth and then just storing the JWT in the SK session so you can retrieve it from the frontend/client and use it to make requests.

Custom Provider

You'll need to make a custom provider that extends from the SK-auth generic Provider<T> class. This will need to implement a sign-in method, that simply redirects to the callback, as you don't have any third-party flows to integrate. Then, the callback() method is the one you override and return a [Profile, string | null] tuple result, where the first value is the user profile (including JWT) and the second a redirect string.

class StrapiProvider extends Provider {
  constructor(config: ProviderConfig) {
    super({
      // This line is important to make the `api/auth/strapi/<signin|callback>` endpoints work and tells signIn() which endpoint to use
      id: "strapi", 
    });
  }

  async callback({ body }: ServerRequest) {
    const { username, password } = body;
  
    const res = await fetch("http://localhost:1337/auth/local", {
      method: "POST",
      body: JSON.stringify({
        password,
        identifier: username,
      }),
    });
    const profile = await res.json();
    return [profile, ""];
  }
}

Signing-In / Using JWT

You can then easily sign-in to your app with the signIn() method from the sk-auth/client package which will automatically hit the callback route of your provider if you pass it data:

signIn("strapi", { username: "username", password: "password" });

You can then use the JWT by accessing the profile, as long as it's returned from the callback() method in your provider, and injected into the SK session as described in the README Getting Started.

Hope this helps!