11일 차 (서버와 연결)

드디어 서버와 연결됐다.! 저번에 만들어둔 무한스크롤로 테스트 해봤다! 너무 잘됐다! 역시 통신을 시작하니 재미가 있어진다!

board를 작성할때 이미지를 첨부하면 서버에 post요청을 보내는 곳에서 에러가 발생했다. 500에러를 뱉어내길래 서버 문제인것 같았는데 ajax요청을 보낼때 데이터 타입의 문제로 발생하는 에러였다. formdata의 형태로 보냈어야하는데 기본으로 json형태로 전달하게 설정해둔 것을 까먹고 요청을 보내 에러가 발생한 것이다. 설정해둔 것을 주석 처리하고 다시 이미지 요청을 보내니 정상적으로 작동했다.

 

---

axios 기본 설정

이번에 하면서 알게된 것인데 axios의 url과 header를 일일이 적지 않고 path부분만 작성하면 되는 설정이 있었다.

import axios from "axios";

axios.defaults.baseURL = process.env.REACT_APP_BASE_URL; // (1)
axios.defaults.headers.post['Content-Type'] = 'application/json'; // (2)

(1)은 환경변수로 설정한 서버 url을 axios의 기본 url로 지정하겠다는 코드이고 (2)는 post를 보낼때 타입을 json타입으로 보내겠다는 코드이다.