인프런 커뮤니티 질문&답변

우럭아왜우럭님의 프로필 이미지
우럭아왜우럭

작성한 질문수

모든 개발자를 위한 HTTP 웹 기본 지식

질문 있습니다...

작성

·

206

0

안녕하세요. 문득 다른분들께서 올려주신 질문들을 보다가  REST API를 사용하는 클라이언트에 대해 의문점이 생겨서 질문드립니다.

API를 사용하는 클라이언트(모바일 앱 또는 리액트나  뷰js)에서 API호출을 통해 필요한데이터를 받아 화면을 구성할때 모바일 앱은 앱 내에서(사용자가 바로) 필요한 데이터를 바로 API서버로부터 받아서 화면을 꾸리는구나 하고 이해를 하긴 했습니다.

그런데 만약 사용자가 웹브라우저를 통해서 프론트 UI서버에서 리액트나 뷰js를 사용한 화면을 받는다면,
일단 UI서버를 통해 화면에 대한 코드를 받고, 그 화면안에 필요한 데이터는 API를 통해서 얻어올탠데,..
그러면 API호출은 사용자(웹 브라우저)쪽에서 바로 불리는 것인가요???

데이터는 ajax같은걸로 받는다고 본 것 같습니다.
그러면 UI서버는 사용자가 처음 접속했을 때 화면에 대한 코드를 주는역할만 하면 쓰이지 않고, 나머지는 모두 사용자(웹 브라우저) 쪽에서 이루어지는지 의문이 듭니다.

API로 데이터를 받아오기 위해서는 API 서버 주소가 필요할탠데 UI서버가 그 주소까지 모두 사용자에게 준다면 주소가 노출되는건가요? 사용자 쪽에서 불리는게 아니면 사용자 쪽에서 API가 불리는게아니라 사용자에서 UI서버로, UI서버가 API서버로 (사용자<->UI서버<->API서버) 요청하는 흐름인건가요?

질문에 대한 의도전달을 정확히 드리고 싶은데,,, 어렵네요..ㅜㅜ
어떻게보면 사용자쪽에서 바로 불려지는 것 같기도 하고, 어떻게보면 중간에 UI서버를 거쳐가는것같기도하고...
API서버 주소를 사용자에게 바로 준다면 위험하지 않을까? 생각도 들고..

다시한번 간략히 정리??해서 예를 들어 질문드리자면,...

사용자(웹 브라우저)가 인프런에 접속해서(여기서 인프런은 프론트, 백엔드가 나눠지고 API를 통해서 통신하는걸로 가정) 로그인을하고, 김영한님을 검색해서 강의들을 구매해 보려고 합니다. 여기서 김영한님의 강의가 너무 많아 페이지가 여러개가 보입니다.

여기서 첫 페이지에서 2번째 페이지를 누르면 사용자(웹 브라우저)에서 프론트서버로, 프론트서버에서 API서버로 요청한 뒤, 프론트서버는 다시 사용자(웹 브라우저)에게 데이터를 주는건가요?

강사님 강의 질문의 답변중에 프론트와 백엔드가 나뉘어있어도 같이? 합쳐져서 동작하는 경우가 있다고도 본 것 같은데, 만약 제가 예시를 든것처럼 나뉘어져 있다면 프론트와 백엔드(API)의 주소가 분명히 다를탠데 모든 요청을 프론트가 일단 다 받는건가요?

아! 그리고 마지막으로,,, 중간에 UI서버가 낀 API 통신은 그러면 로그인유지를 위해서 세션?이 필요할탠데,
이 세션은 UI서버쪽에 유지되는건가요??

질문 자체가 이리저리 튀는것같네요... 궁금한데 이 궁금함의 느낌표현을 잘 못하겠습니다. ㅜㅜ

답변 2

1

자세한설명 감사합니다!

1

김영한님의 프로필 이미지
김영한
지식공유자

안녕하세요. 승빈님

프론트 UI에서 리엑트나 뷰를 사용하더라도 최초에 한번은 HTML로 응답을 받게됩니다.

그리고 HTML을 받으면서 필요한 CSS와 자바스크립트 소스코드도 함께 다운로드 받게 됩니다.

이후부터 자바스크립트를 활용해서 서버 API를 호출하는 것이지요.

여기에서 처음 HTML과 CSS, JS를 내려주는 서버와 API 서버는 같은 서버일 수도 있고, 서로 다른 서버일 수도 있습니다.

1. 다음과 같이 완전히 분리되어 있을 수도 있고,

사용자 -> UI 서버

사용자 -> API 서버1, API 서버2

2. 아니면 다음과 같이 구성되어 있을 수도 있습니다.

사용자 -> 중간서버(UI 제공, API 연동) -> API 서버1, API 서버2

1번의 경우 도메인이 다르다면 CORS 같은 부분을 신경써야 하고, 걱정하신 것 처럼 API가 모두 노출되기 때문에 이런 부분을 주의해야 합니다. 세션의 경우에도 문제가 될 수 있어서 별도의 세션 서버를 유지하고, 인증 토큰을 클라이언트가 서버에 항상 전달하고, UI 서버, API 서버1, API 서버2가 모두 전달받은 인증 토큰을 인증서버에 호출해서 인증을 검증해야 합니다.

2번의 경우 중간서버를 두기 때문에 API 서버의 모든 API가 다 노출되지는 않지만, 중간서버에서 노출하는 API 자체는 당연히 모두 공개됩니다. 그리고 세션은 중간 서버만 잘 유지하면 됩니다.

도움이 되셨길 바래요.

우럭아왜우럭님의 프로필 이미지
우럭아왜우럭

작성한 질문수

질문하기