Интеграция iframe с ракетным чатом. Проблема с навигацией в браузере

Я столкнулся с той же проблемой при интеграции RocketChat, и у меня сработало следующее решение:

Проблема

1) при запуске iframe либо путем явной записи в html, либо путем добавления его в DOM через javascript, новая запись URL-адреса RocketChat помещается в стек истории браузера

2) Если вы отправляете токен из своего родительского приложения в чат Rocket в iframe для входа в систему, чат Rocket перенаправит вас, если вход будет успешным, с root_url на root_url/home, создав новую запись в стеке истории браузера.

3) Каждый раз, когда вы нажимаете тег привязки (входите в комнату и т. д.) в ракетном чате (внутри iframe), создается другая запись и помещается в стек истории браузера.

Теперь, когда приложение загружается, стек выглядит так, даже если iframe скрыт по умолчанию в начале

• Rocketchat_url/домашний

• ракетный чат_url

• app_url

теперь, если вы нажмете кнопку «Назад», браузер перейдет на rockchat_url, маршрут обнаружит, что токен уже присутствует в локальном хранилище, поэтому он снова перенаправит в /home, поэтому мы будем продолжать нажимать кнопку «Назад», и это не сработает.

Решение

Нам нужно избегать создания новой записи в стеке браузера для всех трех пунктов, упомянутых выше.

1 и 2) Вместо того, чтобы напрямую указывать URL-адрес iframe в html, мы можем сначала добавить пустой iframe, который создаст объект окна для этого iframe, теперь мы можем получить доступ к этому окну и использовать location.replace для установки URL-адреса, это заменит текущую запись в истории браузера вместо создания новой, это будет работать для первой точки, для второй точки мы можем напрямую указать URL-адрес «/home», чтобы ракетному чату не приходилось перенаправляться после входа в систему, если вы не вошли в систему, домашняя страница автоматически извлечет токен из вашего приложения, если вы используете postMessage для отправки токена.

$('body').append(`<iframe id="chat"></iframe>`);
$('iframe#chat')[0].contentWindow.location.replace(chat._baseUrl+'/home');

3) Добавление прослушивателя событий для всех тегов привязки в чате Rocket, который заменит текущую запись в стеке истории URL-адресом тега привязки, чтобы при выполнении щелчка и попытке браузера создать новую запись он находил ту же запись, которая уже присутствует на вершине стека и не создает новую запись

var anchors = document.getElementsByTagName('a');
        for (var i = 0; i < anchors.length; i++) {
            var anchor = anchors[i];
            anchor.addEventListener('click', function (event) {
                history.replaceState(null, null, anchor.href);
            }, false);
        }

^ приведенный выше код должен быть запущен внутри окна iframe

Надеюсь, это даст вам достаточно информации для решения проблемы.