Ember Simple Auth OpenID Connect Addon

Common errors

• Error: Assertion Failed: The session is not authenticated.

  cause An unauthenticated user attempted to access a protected route without being redirected to the login route, or `session.requireAuthentication` was not awaited.
  fix Ensure all protected routes call `await this.session.requireAuthentication(transition, 'login');` in their `beforeModel` hook, and that the `login` route extends `OIDCAuthenticationRoute`.

• Failed to compile: Error: Module 'ember-simple-auth-oidc' does not contain an export named 'SomeSymbol'

  cause Attempting to import a symbol with the wrong import style (e.g., named vs. default) or from an incorrect path, or using CommonJS `require()` syntax with an ESM-only addon.
  fix Verify the correct import path and style (named vs. default export) from the package documentation. Use `import ... from '...'` syntax for Ember addons.

• 401 Unauthorized or CORS error during token refresh or API calls.

  cause Issues with `access_token` not being refreshed before an Ember Data request, incorrect `headers` configuration, or misconfigured OIDC endpoints.
  fix Ensure your application adapter extends `OIDCJSONAPIAdapter` or `OIDCRESTAdapter` and that your `headers` getter includes `...this.session.headers`. Also, confirm that `tokenEndpoint` and `issuer` configurations in `config/environment.js` are correct.

Warnings

• breaking When upgrading from version 3.x to 4.x, significant changes were introduced requiring migration. Refer to the `docs/migration-v4.md` guide for detailed instructions on updating your application.
  Fix: Consult the official migration guide at `docs/migration-v4.md` within the package repository for necessary code changes.
• gotcha The addon utilizes JavaScript Proxies, which may not be supported in older browsers like Internet Explorer. If IE support is a requirement, a polyfill for Proxy objects must be provided by the application.
  Fix: Include a JavaScript Proxy polyfill in your Ember application if supporting older browsers without native Proxy implementation.
• deprecated The internal configuration service was renamed in v7.3.1 to avoid naming collisions. While internal, applications overriding or directly extending internal addon services might be affected.
  Fix: Review custom configurations or service extensions that might be targeting the old config service name and update them accordingly.
• gotcha Prior to version 7.2.0, autodiscovery of the OIDC provider's configuration via the `.well-known` endpoint had issues, particularly with awaiting the fetching of this configuration in `beforeModel` and `afterModel` hooks, potentially leading to race conditions.
  Fix: Ensure you are on `v7.2.0` or newer to benefit from improved autodiscovery stability. If manually configuring, verify all endpoints are correctly specified.

Install

• npm install ember-simple-auth-oidc npm
• yarn add ember-simple-auth-oidc yarn
• pnpm add ember-simple-auth-oidc pnpm

Imports

• OIDCAuthenticationRoute
  wrong:

  const OIDCAuthenticationRoute = require('ember-simple-auth-oidc/routes/oidc-authentication');

  correct:

  import OIDCAuthenticationRoute from 'ember-simple-auth-oidc/routes/oidc-authentication';

  Ember addons primarily use ES Modules; CommonJS `require` is not supported for routes.
• OIDCJSONAPIAdapter
  wrong:

  import { OIDCJSONAPIAdapter } from 'ember-simple-auth-oidc/adapters/oidc-json-api-adapter';

  correct:

  import OIDCJSONAPIAdapter from 'ember-simple-auth-oidc/adapters/oidc-json-api-adapter';

  This is a default export from its specific path, not a named export from the root package.
• apolloMiddleware
  wrong:

  import apolloMiddleware from 'ember-simple-auth-oidc/utils/apollo-middleware';

  correct:

  import { apolloMiddleware } from 'ember-simple-auth-oidc';

  The `apolloMiddleware` utility is a named export directly from the root package.

Quickstart

This quickstart demonstrates the core setup for `ember-simple-auth-oidc`, including environment configuration, defining an authentication route, securing a protected route, and integrating with Ember Data for authenticated API requests. It also shows an optional setup for Apollo Client integration.

/* config/environment.js */
module.exports = function (environment) {
  let ENV = {
    modulePrefix: 'my-app',
    environment,
    rootURL: '/',
    locationType: 'history',
    EmberENV: {
      FEATURES: {},
      EXTEND_PROTOTYPES: {
        Date: false
      }
    },
    APP: {
      // Here you can pass flags/options to your application instance
      // when it is created
    },
    'ember-simple-auth': {
      authenticationRoute: 'login'
    },
    'ember-simple-auth-oidc': {
      clientId: process.env.OIDC_CLIENT_ID ?? 'my-oidc-client',
      issuer: process.env.OIDC_ISSUER ?? 'https://my-auth-server.com/realms/my-realm',
      redirectUri: process.env.OIDC_REDIRECT_URI ?? 'http://localhost:4200/login',
      scope: 'openid profile email',
      responseType: 'code',
      postLogoutRedirectUri: process.env.OIDC_LOGOUT_URI ?? 'http://localhost:4200/',
      tokenEndpoint: process.env.OIDC_TOKEN_ENDPOINT ?? 'https://my-auth-server.com/realms/my-realm/protocol/openid-connect/token',
      logoutEndpoint: process.env.OIDC_LOGOUT_ENDPOINT ?? 'https://my-auth-server.com/realms/my-realm/protocol/openid-connect/logout'
    }
  };

  return ENV;
};

/* app/routes/login.js */
import OIDCAuthenticationRoute from "ember-simple-auth-oidc/routes/oidc-authentication";

export default class LoginRoute extends OIDCAuthenticationRoute {}

/* app/routes/protected.js */
import Route from "@ember/routing/route";
import { service } from "@ember/service";

export default class ProtectedRoute extends Route {
  @service session;

  async beforeModel(transition) {
    await this.session.requireAuthentication(transition, "login");
  }
}

/* app/adapters/application.js */
import { service } from "@ember/service";
import OIDCJSONAPIAdapter from "ember-simple-auth-oidc/adapters/oidc-json-api-adapter";

export default class ApplicationAdapter extends OIDCJSONAPIAdapter {
  @service session;

  get headers() {
    return { ...this.session.headers, "Content-Language": "en-us" };
  }
}

// Example for Apollo client integration (optional)
/* app/services/apollo.js */
// import { service } from "@ember/service";
// import ApolloService from "ember-apollo-client/services/apollo";
// import { apolloMiddleware } from "ember-simple-auth-oidc";

// export default class CustomApolloService extends ApolloService {
//   @service session;

//   link() {
//     const httpLink = super.link();
//     return apolloMiddleware(httpLink, this.session);
//   }
// }