Authorization use VM IP instead of subdomain/domain name

[geoffroyp]

Greetings,

I'm trying to set up a project using mercure to push events from a symfony API to a react website.

When the user enters his credentials on the login page of my react website, it calls the API which respond in an appropriate way, but also set a mercure cookie like this:

` public function __construct(
private RequestStack $requestStack,
private Authorization $authorization
)
{
}

// and further, in a function:
$this->authorization->setCookie($request, ['https://example.com/books/1']);`

problem is, I get the following error:
Unable to create authorization cookie for a hub on the different second-level domain "192.168.1.43".

why does it tries to use my VM IP as domain, hwile my API actually has a working subdomain/domain name set, as well as TLS activated?

[sebheitzmann]

#54 Maybe this issue could help

[johnErojas]

HUB Authorization (Subscriber):

It's 2025, and I had the same issue.

I ran into this issue when trying to connect with turbo_stream_listen while the hub was hosted on a different domain.

I first tried enabling the withCredentials attribute:

<div {{ turbo_stream_listen('email_preview', 'default', { withCredentials: true }) }}></div>

But this resulted in the error:

According to the Mercure documentation the JWT token can also be passed as a query parameter in the URL.

So, I ended up creating a custom Stimulus controller to inject the token directly.

Here’s the code, hopefully it saves you the same headache.

3 Files: twig filter - stimulus controller - your twig template

1: Create a TwigFilter to generate the token.

src/Service/TwigHubToken.php

<?php

namespace App\Service;

use Symfony\Component\Mercure\HubInterface;
use Twig\Extension\AbstractExtension;
use Twig\TwigFilter;

class TwigHubToken extends AbstractExtension
{

    public function __construct(
        private readonly HubInterface $hub,
    )
    {
    }

    public function getFilters(): array
    {
        return [
            new TwigFilter('hub_token', [$this, 'getToken'])
        ];
    }

    public function getToken(string $topic): string
    {
        return $this->hub->getFactory()->create(subscribe: [$topic], publish: ['*']);
    }
}

---

2: Create a Stimulus controller to inject the token

assets/controllers/turbo_stream_auth_controller.ts

import { Controller } from '@hotwired/stimulus';

type Param = { key: string; value: string };

/* stimulusFetch: 'lazy' */
export default class extends Controller {
  /**
   * @param token {string} - Create it using hub_token
   * @param map {string} - Create it using turbo_stream_listen
   * @example output:
   * data-controller="symfony--ux-turbo--mercure-turbo-stream"
   * data-symfony--ux-turbo--mercure-turbo-stream-hub-value="https://your-production-domain.com/.well-known/mercure"
   * data-symfony--ux-turbo--mercure-turbo-stream-topic-value="email_preview"
   */
  static values = {
    map: String,
    token: String,
  };

  declare readonly mapValue: string;
  declare readonly tokenValue: string;

  initialize() {
    const params: Param[] = [];

    this.mapValue.split(' ').map(line => {
      const [key, value] = line.replaceAll('"', '').split('=');

      if (key.includes('hub-value')) {
        // inject the token as query
        const searchParams = new URLSearchParams('');
        searchParams.set('authorization', this.tokenValue);
        const url = `${value}?${searchParams.toString()}`;
        params.push({ key, value: url });
      } else {
        // keep default turbo_stream_listen attributes
        params.push({ key, value });
      }
    });

    if (params.length > 1) {
      this.createListener(params);
    }
  }

  createListener(params: Param[]) {
    const listener = document.createElement('div');
    params.forEach(({ key, value }) => {
      listener.setAttribute(key, value);
    });
    this.element.appendChild(listener);
  }
}

---

2: Finally use it in your template

templates/example.html.twig

<div {{ stimulus_controller('turbo-stream-auth', {
        token: 'email_preview'|hub_token,
        map: turbo_stream_listen('email_preview'),
    }) }}></div>

[dunglas]

This is very likely a misconfiguration of Symfony or of your web server.

If the domain name is used by the client and the server is configured properly, the bundle will be able to retrieve the proper domain.

Bad configuration can create other issues, while generating links in email for instance.