Хэши/якоря удаляются из URL на мобильных устройствах. Как это исправить?

Поддержка
1

Когда я нажимаю на ссылку с якорем на рабочем столе, она прокручивается туда. Однако на мобильных устройствах (Android, FF и Chrome) якорь удаляется из URL, поэтому прокрутки к этому месту не происходит.

Что я пытаюсь сделать:

У нас есть длинный документ с рекомендациями и FAQ, который должен содержать ссылки на заголовки. Поскольку Discourse удаляет параметры id, я создал простой компонент темы, который использует пользовательские атрибуты данных в целевом документе и отслеживает якоря в URL для прокрутки к элементу с соответствующим атрибутом данных.

Это работает на рабочем столе!

Однако на мобильных устройствах якоря, похоже, удаляются, так что когда вы переходите на целевую страницу, прокрутки к нужному элементу не происходит. И, конечно же, в длинном документе именно на мобильных устройствах такая навигация нужна больше всего.

Теперь я обнаружил, что якоря, созданные компонентом «Содержание», работают, когда открываются в новой ссылке. Они не удаляются из URL, и браузер прокручивается к нужному месту.

Как я могу заставить это работать?

2

Небольшое обновление…

Кто-то предложил использовать вместо этого параметры запроса. Похоже, что на мобильных устройствах они не удаляются. Но удивительно, что на настольных компьютерах они удаляются.

3

Вот несколько связанных сообщений, хотя они и не затрагивают конкретную проблему удаления URL-адресов…

4

я не использую android, поэтому не могу это протестировать, но я много раз использовал ссылки на заголовки, и на моем iphone они работают отлично. мне интересно, почему вы используете id-якоря вместо того, чтобы просто ссылаться на нужный заголовок?

например, работает ли у вас эта ссылка? cloudflare R2 configuration

можете привести пример того, как выглядит ваша якорная ссылка? возможно, я неправильно понимаю, чего вы пытаетесь достичь.

5

Потому что такие ссылки на заголовки крайне ненадёжны. Вот как выглядит та, которую вы привели:

https://meta.discourse.org/t/-/148916#p-738234-cloudflare-r2-13

Видите -13 в конце? Он там потому, что это тринадцатый заголовок. Как только вы добавите новый заголовок выше по тексту, ссылка перестанет работать. И, разумеется, она сломается, если вы измените текст самого заголовка.

Под «сломается» я имею в виду изменения в целевом документе. Насколько я понимаю, такие якоря генерируются динамически при загрузке страницы. Поэтому, если вы используете плагин TOC (содержание), изменение документа не станет проблемой.

В нашем случае это ссылка на FAQ. Поэтому добавление новых вопросов/заголовков — дело нередкое.

Но вы правы в том, что Discourse, кажется, распознаёт паттерн таких якорей и пропускает их. Однако если он не соответствует ожидаемому паттерну, якорь удаляется.

Это обычные буквенно-цифровые идентификаторы. Так что, если бы я хотел создать якорь для вашего примера выше, я бы просто использовал cloudflare-r2.

6

Подойдет ли вам что-то вроде этого?

<a name="cloudflare-r2"></a>
## Настройка Cloudflare R2

Это позволяет разделить якорь и заголовок, и вы можете добавить #cloudflare-r2 в конец URL-адреса, чтобы создать ссылку на него.