[Request]:How to add a new provider in users-permissions plugin in Strapi V4？Document of "Adding a new provider" is not update for Strapi V4.

[smoothdvd]

Summary

How to add a new provider in users-permissions plugin in Strapi V4

Why is it needed?

Document for v4 is not update: https://docs.strapi.io/developer-docs/latest/plugins/users-permissions.html#adding-a-new-provider-to-your-project

Suggested solution(s)

No response

Related issue(s)/PR(s)

No response

[smoothdvd]

I write a tutorial https://smoothdvd.medium.com/add-a-customize-users-permissions-provider-for-strapi-v4-6aa78c642977, can I add it to document?

[derweili]

@smoothdvd I'm also currently working on implementing a custom provider.

You tutorial got me one step further than the outdated docs. Thank You!!!

But it's still not working. When trying to authenticate by opening http://localhost:1337/api/connect/wpauth in the browser, I get instantly redirected to my redirect URL with the Error message: Grant missing or misconfigured provider

My adjustments of the bootstrap/index.js look like this:

..
    wpauth: {
      enabled: false,
      icon: 'comments',
      key: '',
      secret: '',
      callback: `${baseURL}/callback`,
      scope: ['basic'],
      subdomain: 'oauth-server.test/oauth',
    },
...

I'm using a custom local oauth server.

The Provider is now showing up in the Strapi Admin and I can enable and configure it. But when trying to connect I get directly redirected to my redirect URL with the above error.

I never get redirected to my oauth server.

Do you have any Idea on what to do?

[smoothdvd]

@derweili Please inspect baseURL's value, the index.js of current version has a bug of baseURL generation.

https://github.com/strapi/strapi/blob/c106d19dd54b5e8adaab1ad5c3458967e38f6541/packages/plugins/users-permissions/server/bootstrap/index.js#L44

You can patch like that:

...
const urljoin = require('url-join');
...
...
const baseURL = urljoin(`${strapi.config.server.url}/`, apiPrefix, 'auth');
...

After patch, you also need modify the grant store manually (in database, table 'strapi_core_store_settings', key 'plugin_users-permissions_grant', your custom provider's callback value).

[derweili]

@smoothdvd thank you for that code. This fixed another error I had with the callback URL.

Unfortuntately my problem I is not the callback URL but the fact I never get redirected to the /authorize URL of my OAuth provider.
Instead when trying to login via oauth I get directly redirected to the callback URL with the Error Grant missing or misconfigured provider

[smoothdvd]

@derweili Do you implement code in providers.js?

[derweili]

@smoothdvd Yes I did, though I'm not sure if it works.

But I think this getProfile() function in the providers.js does not even get called.

As I understand this function is only responsible for taking the access_token returned by the OAuth server, requesting the user data (email and username) using this access_token from the oauth server, and finally passing the user data to the callback() function.

But I do not even get redirected to the OAuth server so strapi never gets an access_token and the getProfile() never gets called.

As I understand the auth process should work like this:

1. Start the auth process redirecting the user to strapi connect api: http://localhost:1337/api/connect/wpauth
2. Strapi redirects the user to the OAuth servers authorize url
3. The OAuth server redirects the user to callback URL from strapi together with an access token e.g. http://localhost:1337/api/connect/wpauth/callback?access_token=XXX
4. Strapi takes the auth code and requests the email and username using the auth code. And matches this data with the user accounts in strapi. This is done by the getProfile() function.
5. Strapi redirects the user to the callback URL of the frontend app

The getProfile() function from the providers.js gets called at step 4.
My error occurs at step 2. I do not get redirected to the authorize URL. Instead, strapi auth process skips to step 5 with an error message in the url.

Is there an error in my bootstrap/index.js File? For me, this looks good.

One thing I do not understand by now: where/how do I specify the authorize endpoint of my OAuth app?
I can specify a subdomain property in the bootstrap/index.js. Does strapi automatically expect the auth URL is subdomain + '/authorize. This is true for my oauth server. But I'm not sure if strapi works like this.

[smoothdvd]

@derweili Please check connect source code: https://github.com/strapi/strapi/blob/29bdadf3292817278d7f1d104ae754af07c6c580/packages/plugins/users-permissions/server/controllers/auth.js#L157

and grant repo's config:
https://github.com/simov/grant#connect-origin

[smoothdvd]

@derweili Grant document: https://github.com/simov/grant#misc-custom-providers

Maybe you should add codes like:

{
  "awesome": {
    "authorize_url": "https://awesome.com/authorize",
    "access_url": "https://awesome.com/token",
    "oauth": 2,
    "key": "...",
    "secret": "...",
    "scope": ["read", "write"]
  }
}

[strapi-bot]

This issue has been mentioned on Strapi Community Forum. There might be relevant details there:

https://forum.strapi.io/t/adding-authentication-provider-results-in-unknown-provider/22299/1

[fiderosado]

I need help with the example, it seems to me that they should show the content better, I don't know how to start, please help me, I am making a custom provider, oauth 2, I already have it ready in next pro I want to integrate it in strapi

[pwizla]

Hello. I'm sorry that you were having troubles and that this issue didn't get more attention sooner. I'm cleaning up old documentation issues and I will close this issue now. The Providers documentation has been updated sometimes end of last year. Feel free to open a new issue if you're still having trouble with the documentation for Strapi v4.11+