SO 커뮤니티

기존 Vue 2 애플리케이션에 외부 인증을 추가하려고 합니다. 내가 겪고 있는 문제는 외부 IdP가 /redirect 경로를 사용하여 Vue 애플리케이션으로 다시 리디렉션할 때 Vue Router가 업데이트된 경로를 존중하지 않고 올바른 구성 요소로 경로를 지정하는 것 같다는 것입니다. . 즉, Vue Router는 /redirect 구성요소 대신 / 구성요소로 라우팅합니다.

Vue Router는 mode: 'history'를 설정하고 Webpack은 historyApiFallback: true를 설정합니다.

현재 동작:

技术细节：

Vue - 2.5.15

루로由器视图 - 3.0.0

웹팩 - 4.17.1

웹팩 开发服务器 - 3.1.4

webpack.dev.js

devServer: { HistoryApiFallback: true,

router.js

const router = new VueRouter({ 모드: '역사', 경로: [ ... { 경로: '/리디렉션', 구성 요소: 리디렉션, }, { 길: '/', 리디렉션: () => { }, ... router.beforeEach((to, from, next) => { const 사용자 = store.state.user.authorizedUser const toPath = to.path if (toPath === '/redirect') 반환 });

App.vue

new Vue({ 엘: '#로그인', 렌더링: h => h(로그인), 가게, })

登录.vue

mounted() { if (window.location.pathname === '/redirect') router.push({ 경로: '/redirect' }); }

请告诉我是否需要提供任何其他细节或代码。提前感谢您的帮助。