vue.js/vue.js 2
79. SPA 호스팅시에 서버에 추가해줘야 하는 설정
DEV-Front
2022. 10. 2. 17:46
반응형
VUE CLI 공식 문서에 들어가면 Netlify 칸이 있다.
Netlify 칸에서 _redirects 설정 안내를 확인할 수 있다.
Single-page application 란?
특정 페이지의 정보를 서버에서 받아오는것이 아니라
미리 갖고있다가 필요시에 그 페이지로 (Javascript로) 전환 하는것
그랬을때 특정 주소(path)를 </ask, /news > 서버에서 알 길이 없다.
이 페이지에 대한 정보는 브라우저에 있기 때문에 클라이언트 정보를 알 수가 없어서 서버에 path를 알려줘야할 필요가 있다.
(Netlify로 배포 시 웹사이트 처음 시작할때만 발생하는 에러 - 첫 화면부터 라우팅이 걸려있을때)
그걸 해결하기 위해
특정 도메인 뒤에 오는 URL들을 "_redirects" 라는 파일로 모든 접근에 대해서 index.html로 돌리겠단 설정을 서버마다 해줘야한다.
이렇게 해주면 웹사이트 처음 접속시에 vue 라우팅이 적용되어 있어도 index.html로 redirect 해주기 때문에 404에러가 안뜬다
설정 해주기 전 URL 끝에 /news가 붙어있을땐 Page Not Found화면이 뜬다
설정 후엔 URL 끝에 /news 가 붙어있어도 정상사용가능
반응형