설정하기 headers.Authorization에 jwt 요청 마다 인증을 값을 넣어 백서버와 서로 인증을 할 수 있게 할것이다. 먼저 인증절차가 끝난 경로와 인증절차를 해야하는 경로 두개로 나누어 url.js파일을 만든다. 인증절차가 끝난 경로는 계속해서 인증값을 전달해주어야 하는데 이때 Interceptor 를 사용한다. 파일 구성은 이렇게 한다. 구성 interceptor.js //store에 저장된 토큰을 import하기 위함 import store from '../../store/storeIndex' export function setInterceptors (instance) { instance.interceptors.request.use( function (config) { //Authoriz..

1. .env 파일은 package.json 파일과 동일 위치 있어야 한다. 2. local, build 모드 각각 환경변수값을 설정하고 싶다면 .env 파일 뒤에 .(해당 모드 이름) 으로 작성한다. ex) .env.local .env.build 3. 정의 할 때는 VUE_APP_ 꼭 먼저 써준 후 사용한 변수 이름 써준다. = 값 형식으로 써주어야 한다. ex) VUE_APP_TEST = 테스트 입니다. *뒤에 모드 이름이 붙여지지 않은 .env 파일은 모든 모드에서 적용

submit에 .prevent를 붙혀서 실행하면 해결이 된다.

Vue에서 없는 URL에 접근하면 해당 화면이 오류도 뜨지않고 없어진다. 해결하는 방법은 router에서 *로 모든페이지를 설정해서 notFoundPage라는 vue파일을 만들어 출력하면된다.

* 환경 : vue-cli 4.x 버전을 사용한 환경이며 vue2 입니다. ./router/router.js파일을 만들어 페이지 별 view를 import 하여 띄어준다. 보통 라우터에서 모든 views에서 파일을 import 하여 가져와 실행한다. 그러면 view에서 전부 import해야해서 브라우저에서 다운받는 속도가 느려진다 해결하기위해 코드 스플리팅을 한다. * 코드 스플리팅 : 페이지 수가 많은 사이트 일 때 한번 유저가 전체 앱을 다운 받으면 속도가 느려져 사용유저의 불편함이 생기기 때문에 url에 접속시 페이지를 다운 받아 사용하도록 하는 기술 방법 : import를 위에서 따로 해주지않고 component에서 바로 해주어 유저가 접속하는것만 import하게 해준다.

v-for을 사용할때 v-for="news in news" :key="news" 로 하면 정상 작동은 되지만 경고창이 같이 뜬다 해결하려면 v-for="(news,idx) in news" :key="idx" idx 인덱스를 값을 만들어 키로 설정해 주면 경고창이 없어진다.