CORS

CORS API를 사용하는 서버에서의 호출만 다뤘었다. 만약 프런트에서 호출한다면 어떻게 해야 할까?? CORS를 이용하여 처리하자. router.get('/', (req, res) => { res.render('main', {key: process.env.CLIENT_SECRET}); }); nodecat/routes/index.js 프런트 화면을 렌더링하는 라우터를 추가했다. 프런트 화면도 추가하자. nodecat/views/main.html clientSecret의 {{key}} 부분이 넌적스에 의해 실제 키로 치환돼서 렌더링된다. Access-Control-Allow-Origin이라는 헤더가 없다는 내용의 에러이다. 브라우터와 서버의 도메인이 일치하지 않으면, 기본적으로 요청이 차단된다. 이러한 ..

Data Flow client에서 원하는 요청을 보내면 서버에서 처리한 후 DB에 접근하여 응답을 보내는 구조이다. client가 없을 때는 postman을 사용하여 테스트해봤다. 이제 AXIOS를 이용하여 구현해 보자. 우선 axios를 설치하자. npm install axios --save 간단하게 LandingPage에서 확인해보자. import React, { useEffect } from 'react' import axios from 'axios' function LandingPage(){ useEffect(() => { axios.get('api/hello') }, []) return( LandingPage ) } export default LandingPage 엔드포인트를 api/hello로..