pulp · n35k3nd1r · Aug 6, 2026
diff --git a/CHANGES.md b/CHANGES.md
@@ -1,3 +1,10 @@
+## Unreleased
+
+### What's Changed
+* Add cookie-based session authentication support while retaining HTTP Basic authentication
+
+---
+
 ## 0.1.24 (2026-01-02) {: #0.1.24 }
 
 ### What's Changed

diff --git a/README.md b/README.md
@@ -84,5 +84,15 @@ The UI builds produced by `npm run build` can be further configured by serving a
 
 * `API_BASE_PATH` - defaults to `/pulp/api/v3/` - change when using domains or a different path
 * `UI_BASE_PATH` - defaults to `/ui/` - change when only serving index in a subdirectory, or want different browser path prefix
-* `UI_EXTERNAL_LOGIN_URI` - defaults to nothing - set to something like `/login/` when using an SSO
+* `UI_EXTERNAL_LOGIN_URI` - defaults to nothing. When unset, Pulp UI uses its
+  built-in HTTP Basic login. Set it to the backend login endpoint, for example
+  `/auth/login/`, to enable cookie-based external authentication such as SSO.
+  Pulp UI appends a URL-encoded `next` query parameter so the backend can return
+  the browser to the requested UI route after authentication. In this mode the
+  UI validates the Django session after every page load and does not persist a
+  session identity or password in browser storage. The UI and API must share an
+  origin, or be configured so the browser sends the Django session cookie to
+  both. The backend must expose its standard browsable users API and Django
+  logout endpoint. Session detection reads only the authenticated username
+  shown in the users API header; it does not depend on task permissions.
 * `EXTRA_VERSION` - an extra version string to display in about modal
diff --git a/cypress/e2e/session-auth.js b/cypress/e2e/session-auth.js
@@ -0,0 +1,90 @@
+const sessionPage = (username, csrfToken = 'test-csrf-token') => `
+  <html>
+    <body>
+      ${
+        username
+          ? `<a class="dropdown-toggle" href="#">${username}</a>`
+          : '<a href="/auth/login/">Log in</a>'
+      }
+      <form>
+        <input name="csrfmiddlewaretoken" value="${csrfToken}">
+      </form>
+    </body>
+  </html>
+`;
+
+const configureSSO = () => {
+  cy.intercept('GET', '/pulp-ui-config.json', {
+    API_BASE_PATH: '/pulp/api/v3/',
+    UI_BASE_PATH: '/ui/',
+    UI_EXTERNAL_LOGIN_URI: '/auth/login/',
+    EXTRA_VERSION: '',
+  });
+};
+
+describe('Session authentication', () => {
+  it('restores an authenticated Django session', () => {
+    configureSSO();
+    cy.intercept('GET', '/pulp/api/v3/users/?limit=1', {
+      headers: { 'content-type': 'text/html' },
+      body: sessionPage('sso-user'),
+    });
+
+    cy.ui('about');
+
+    cy.get('[data-cy=user-dropdown]').contains('sso-user');
+    cy.get('[data-cy=pulp-menu-item-Login]').should('not.exist');
+    cy.window()
+      .then((window) => window.sessionStorage.getItem('credentials'))
+      .should('be.null');
+    cy.window()
+      .then((window) => window.localStorage.getItem('credentials'))
+      .should('be.null');
+  });
+
+  it('does not trust cached session identity', () => {
+    configureSSO();
+    cy.intercept('GET', '/pulp/api/v3/users/?limit=1', {
+      headers: { 'content-type': 'text/html' },
+      body: sessionPage(null),
+    });
+
+    cy.visit('/ui/about/', {
+      onBeforeLoad(window) {
+        window.sessionStorage.credentials = JSON.stringify({
+          username: 'stale-user',
+          password: '',
+          remember: false,
+          authentication: 'session',
+        });
+      },
+    });
+
+    cy.get('[data-cy=user-dropdown]').should('not.exist');
+    cy.get('[data-cy=pulp-menu-item-Login]').should('exist');
+  });
+
+  it('posts the Django logout and clears the local identity', () => {
+    configureSSO();
+    let authenticated = true;
+
+    cy.intercept('GET', '/pulp/api/v3/users/?limit=1', (request) => {
+      request.reply({
+        headers: { 'content-type': 'text/html' },
+        body: sessionPage(authenticated ? 'sso-user' : null),
+      });
+    });
+    cy.intercept('POST', '/auth/logout/', (request) => {
+      authenticated = false;
+      request.reply({ statusCode: 204 });
+    }).as('logout');
+
+    cy.ui('about');
+    cy.get('[data-cy=user-dropdown]').click();
+    cy.contains('a', 'Logout').click();
+
+    cy.wait('@logout');
+    cy.get('[data-cy=user-dropdown]').should('not.exist');
+    cy.get('[data-cy=pulp-menu-item-Login]').should('exist');
+  });
+});
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/api/base.ts b/src/api/base.ts
@@ -8,9 +8,10 @@ export class BaseAPI {
 
   constructor() {
     this.http = axios.create({
-      // adapter + withCredentials ensures no popup on http basic auth fail
+      // The fetch adapter avoids the browser's Basic Auth popup. Cookies are
+      // required when the API is authenticated through a Django SSO session.
       adapter: 'fetch',
-      withCredentials: false,
+      withCredentials: true,
 
       // baseURL gets set in PulpAPI
       paramsSerializer: {

diff --git a/src/api/pulp.ts b/src/api/pulp.ts
@@ -11,11 +11,18 @@ export class PulpAPI extends BaseAPI {
 
     this.http.interceptors.request.use((request) => {
       if (!request.auth) {
-        request.auth = JSON.parse(
+        const credentials = JSON.parse(
           window.sessionStorage.credentials ||
             window.localStorage.credentials ||
             '{}',
         );
+        if (
+          credentials.authentication !== 'session' &&
+          credentials.username &&
+          credentials.password
+        ) {
+          request.auth = credentials;
+        }
       }
 
       request.baseURL = config.API_BASE_PATH;

diff --git a/src/app-routes.tsx b/src/app-routes.tsx
@@ -3,7 +3,12 @@ import { Banner, Flex, FlexItem } from '@patternfly/react-core';
 import WrenchIcon from '@patternfly/react-icons/dist/esm/icons/wrench-icon';
 import { type ElementType } from 'react';
 import { Navigate, redirect, useLocation } from 'react-router';
-import { ErrorBoundary, ExternalLink, NotFound } from 'src/components';
+import {
+  ErrorBoundary,
+  ExternalLink,
+  LoadingSpinner,
+  NotFound,
+} from 'src/components';
 import {
   AboutProject,
   AnsibleRemoteDetail,
@@ -322,9 +327,13 @@ const AuthHandler = ({
   noAuth,
   path,
 }: IRouteConfig) => {
-  const { credentials } = useUserContext();
+  const { credentials, isLoading } = useUserContext();
   const { pathname } = useLocation();
 
+  if (isLoading) {
+    return <LoadingSpinner />;
+  }
+
   if (!credentials && !noAuth) {
     // NOTE: also update LoginLink when changing this
     if (config.UI_EXTERNAL_LOGIN_URI) {