Druxt Authentication with Drupal Simple OAuth2 and nuxt/auth.
- DruxtJS: https://druxtjs.org
- Community Discord server: https://discord.druxtjs.org
$ npm install druxt-auth
Add module to nuxt.config.js
module.exports = {
buildModules: [
'druxt',
['druxt-auth', {
clientId: '[DRUPAL_CONSUMER_UUID]',
clientSecret: '[DRUPAL_CONSUMER_SECRET]',
scope: ['default'],
}]
],
druxt: {
baseUrl: 'https://demo-api.druxtjs.org'
},
}Note: Replace [DRUPAL_CONSUMER_UUID] and [DRUPAL_CONSUMER_SECRET] with the details from the consumer created in the following step.
-
Download, install and setup the Simple OAuth module.
-
Create a Consumer depending on your desired authorization strategy:
-
Authorization Code grant:
- New Secret: leave this empty
- Is Confidential: unchecked
- Use PKCE?: checked
- Redirect URI:
[FRONTEND_URL]/callback(e.g.,http://localhost:3000/callback)
-
Password grant:
- New Secret: provide a secure secret
- Is Confidential: checked
- Redirect URI:
[FRONTEND_URL]/callback(e.g.,http://localhost:3000/callback)
-
The DruxtAuth module installs and configures the nuxt/auth module for your Druxt site.
It adds two auth strategies that can be used via the $auth plugin:
-
drupal-authorization_codethis.$nuxt.$auth.loginWith('drupal-authorization_code')
-
drupal-passwordthis.$nuxt.$auth.loginWith('drupal-password', { data: { username: '', password: '' } })
Note: Nuxt must be running in SSR mode for password grant, and client secret must be set.
-
See the nuxt/auth documentation form more details: https://auth.nuxtjs.org/api/auth
| Option | Type | Required | Default | Description |
|---|---|---|---|---|
clientId |
string |
Yes | undefined |
The Drupal Consumer UUID |
clientSecret |
string |
No | undefined |
The Drupal Consumer API secret. Required for Password grant. |
scope |
array |
No | undefined |
The OAuth Scopes to be used for the Drupal Consumer. |
![renovate[bot] avatar](https://avatars.githubusercontent.com/in/2740?v=4 "renovate[bot]")
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent