druxt-auth

library0.4.0jsnpmunverified

DruxtAuth is a Nuxt.js module designed to streamline authentication for Druxt sites by integrating with Drupal's Simple OAuth2 module and the popular `@nuxtjs/auth` module. It abstracts away much of the boilerplate required for connecting a Nuxt frontend to a Drupal backend using OAuth2. The current stable version is 0.4.0, indicating a pre-1.0 release, with updates and patches released as needed. Its key differentiator is its specific focus on the Druxt ecosystem, providing pre-configured strategies for both Drupal Authorization Code and Password grants, significantly simplifying the setup process for developers building headless Drupal applications with Nuxt. It extends the core functionalities of `@nuxtjs/auth` by providing Drupal-specific endpoints and configurations, making it a go-to solution for authentication within the Druxt project framework.

auth-security web-framework

npm install druxt-auth

package ↗

INSTALL

IMPORT

SIG · DRUXT-AUTH

druxt-auth

auth-securityjavascriptv0.4.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

module registration

✓ export default { buildModules: [ ['druxt-auth', { clientId: '...' }] ] }

✗ import DruxtAuth from 'druxt-auth'

DruxtAuth is a Nuxt module and is configured in `nuxt.config.js` via the `buildModules` array, not imported as a JavaScript module directly into application code. Options are passed as the second array element.

$auth plugin

✓ this.$auth.loginWith('drupal-authorization_code')

✗ import { $auth } from 'druxt-auth'

The `$auth` object is a plugin injected by `@nuxtjs/auth` (which DruxtAuth configures). It is globally available within Vue components and Nuxt context, not directly imported.

Drupal Strategies

✓ this.$auth.loginWith('drupal-password', { data: { username: 'user', password: 'pwd' } })

✗ this.$auth.loginWith('oauth2')

DruxtAuth registers specific strategies: `drupal-authorization_code` and `drupal-password`. Using generic strategy names or non-existent ones will fail.

This quickstart demonstrates how to configure the `druxt-auth` module in your `nuxt.config.js`, including setting up `clientId`, `clientSecret`, and `baseUrl`. It also shows a basic `loginWith` example for the `drupal-authorization_code` strategy within a Vue component, illustrating the client-side interaction.

module.exports = { // Required for Druxt modules: [ 'druxt' ], buildModules: [ ['druxt-auth', { clientId: process.env.DRUPAL_CONSUMER_UUID ?? 'YOUR_DRUPAL_CONSUMER_UUID', clientSecret: process.env.DRUPAL_CONSUMER_SECRET ?? '', // Required for password grant, keep empty for authorization code scope: ['default'], }] ], druxt: { baseUrl: process.env.DRUPAL_BASE_URL ?? 'https://demo-api.druxtjs.org' }, // For password grant, Nuxt must be in SSR mode. // This setting is typically in a server-side context or specific environment configuration. // Example of usage in a Vue component (e.g., pages/login.vue) // <template> // <button @click="login">Login with Authorization Code</button> // </template> // <script> // export default { // methods: { // async login() { // try { // await this.$auth.loginWith('drupal-authorization_code'); // console.log('Initiated Authorization Code Flow'); // } catch (error) { // console.error('Login failed:', error); // } // } // } // } // </script> }

Debug

Known issues

breakingThe `clientId` option is mandatory for `druxt-auth` to function correctly. Without it, the module cannot identify the Drupal OAuth consumer.

fix

Ensure `clientId` is set in the `druxt-auth` module options in `nuxt.config.js`, using the UUID of your Drupal OAuth consumer.

affects: >=0.1.0

gotchaWhen using the `drupal-password` grant, the `clientSecret` option is required and your Nuxt application must be running in SSR (Server-Side Rendering) mode. Client-side-only applications cannot securely use the password grant type with a confidential client.

fix

Provide `clientSecret` in your `druxt-auth` module options and ensure `target: 'server'` or equivalent SSR setup for your Nuxt project.

affects: >=0.1.0

gotchaIncorrect configuration of the Drupal Simple OAuth module (e.g., wrong grant types, redirect URIs, or PKCE settings) will lead to authentication failures.

fix

Carefully follow the Drupal setup instructions for Simple OAuth, ensuring the consumer matches the grant type (Authorization Code with PKCE, or Password with client secret) and the redirect URI is correct.

affects: >=0.1.0

gotchaThe `druxt-auth` module depends on the `@nuxtjs/auth` module. While `druxt-auth` configures it, understanding the underlying `@nuxtjs/auth` documentation can be crucial for advanced use cases or troubleshooting.

fix

Consult the official `@nuxtjs/auth` documentation (https://auth.nuxtjs.org/) for detailed information on the `$auth` plugin, strategies, and lifecycle hooks.

affects: >=0.1.0

Errors

Common errors & fixes

TypeError: Cannot read properties of undefined (reading 'loginWith')

The `$auth` plugin is not properly initialized or accessed outside a Nuxt/Vue component context, or `druxt-auth` module is not correctly registered in `nuxt.config.js`.

fix

Ensure `druxt-auth` is listed in `buildModules` in `nuxt.config.js` and `$auth` is accessed within a Vue component method or Nuxt context (e.g., `this.$auth` or `context.$auth`).

OAuth Error: invalid_client / Invalid client credentials.

The `clientId` or `clientSecret` provided in `nuxt.config.js` does not match the configured Drupal OAuth consumer, or the consumer itself is misconfigured.

fix

Verify that `clientId` and `clientSecret` (if used) are exact matches to the Drupal OAuth consumer settings. Check the Drupal consumer's UUID and secret, and ensure it's enabled.

OAuth Error: unauthorized_client / The client is not authorized to request an authorization code using this method.

The Drupal OAuth consumer is not configured for the requested grant type (e.g., trying to use password grant on a consumer configured only for authorization code, or missing PKCE for authorization code).

fix

Review your Drupal OAuth consumer settings. For 'Authorization Code' grant, ensure 'Use PKCE?' is checked and 'Is Confidential' is unchecked. For 'Password' grant, ensure 'Is Confidential' is checked and a 'New Secret' is provided.

Upgrade

Version history

0.4.0latest on npm

Audit

Dependencies

axiosrequiredPeer dependency, likely used for HTTP requests to the Drupal API and OAuth endpoints.

body-parserrequiredPeer dependency, typically used in Node.js environments for parsing request bodies, especially relevant for server-side operations or callback routes.

Agent activity

20 hits · last 30 days

node

Amazon

OpenAI (training)

Resources

packagehttps://www.npmjs.com/package/druxt-auth ↗