Как удалить hashbang #!
из URL?
Я нашел возможность отключить hashbang в документации по маршрутизатору vue ( http://vuejs.github.io/vue-router/en/options.html ), но эта опция удаляет #!
и просто помещает#
Есть ли способ получить чистый URL?
Пример:
НЕ: #!/home
НО: /home
vue.js
vue-router
DokiCRO
источник
источник
const router = new VueRouter({ history: true })
{history: true}
работы для первой страницы, но остальные маршруты потерпели неудачу.Для vue.js 2 используйте следующее:
источник
Хэш - это режим по умолчанию для vue-router, он установлен потому, что с хэшем приложению не нужно подключаться к серверу для обслуживания URL. Чтобы изменить его, вы должны настроить свой сервер и установить режим в режим HTML5 History API.
Для настройки сервера это ссылка, которая поможет вам настроить серверы Apache, Nginx и Node.js:
https://router.vuejs.org/guide/essentials/history-mode.html
Затем вы должны убедиться, что режим vue router установлен следующим образом:
vue-router версия 2.x
Для ясности, это все режимы vue-router, которые вы можете выбрать: "hash" | "история" | "Аннотация".
источник
Для Vuejs 2.5 и vue-router 3.0 у меня ничего не получалось, однако, немного поиграв, кажется, работает следующее:
обратите внимание, что вам также нужно будет добавить универсальный путь.
источник
и сервер правильно настроен В apache вы должны написать переписать URL
источник
Цитирование документов.
источник
В
vue-router
использованииhash-mode
, в простых словах это то , что вы обычно ожидаете от ахора тега , как это.Чтобы хеш исчез
Warning
: Если у вас нет правильно настроенного сервера или вы используете клиентский SPA, пользователь может получить запрос,404 Error
если он попытается получить доступhttps://website.com/posts/3
напрямую из своего браузера. Vue Router Docsисточник
Режимом по умолчанию для vue-router является режим хеширования - он использует хеш URL для имитации полного URL, чтобы страница не перезагружалась при изменении URL. Чтобы избавиться от хэша, мы можем использовать режим истории маршрутизатора, который использует
history.pushState
API для достижения перехода по URL без перезагрузки страницы:Ссылка
источник
А если вы используете AWS Ampilify, ознакомьтесь с этой статьей о том, как настроить сервер: режим истории маршрутизатора Vue и AWS Amplify.
источник