왜 jsonp는 get 요청만 사용할 수 있나요? get 이유나 post 이유 또는 다른 이유 때문인가요? 문서를 확인해보니 '기술 자체의 특성에 따라 결정됩니다'라고 나와 있습니다. 이것에 대해 말해 보세요. 특성 자체가 무엇을 가리키는지 자세히 설명해 주실 수 있나요? 정말 감사합니다!
闭关修行中......
JSONP는 【JS 스크립트를 요청하고 이 스크립트의 실행 결과를 데이터로 사용】 방식입니다.
그럼 스크립트 태그를 통해 소개된 스크립트를 POST해 주실 수 있나요?
(JSONP 라이브러리의 소스코드를 읽어보신 분이라면 공통 구현 코드가 실제로 document.createElement('script')스크립트 태그를 생성하여 본문에 삽입한다는 것을 아실 겁니다. 여기서는 요청 형식을 설정할 공간이 없습니다.)
document.createElement('script')
도메인 이름 A의 JS 코드 AJAX는 도메인 이름 B의 서버 데이터를 요청합니다. 이는 기본적으로 불가능한 도메인 간 AJAX 요청입니다.
그러나 HTML에는 img 스크립트 태그와 같이 도메인 간 요청이 이루어질 수 있는 위치가 있습니다. 해당 src 속성은 도메인 이름 A에 속하지 않는 주소(즉, 크로스 도메인)를 가리킵니다.
그런데 누군가는 위의 특성을 이용하여 도메인 전반에 걸쳐 콘텐츠를 얻을 수 있는 스크립트의 src 기능을 선택하고 JSONP와 같은 해킹 프로토콜을 개발했습니다. (src의 요청은 모두 GET입니다)
JSONP 요청이 다음과 같다고 가정합니다.
비하인드 스토리:
스크립트 태그 <script src="http://path/to/server/b?A=a&B=b&callbackFunctionName=myCallback"></script>를 연결하여 지정된 주소에 대한 GET 요청을 트리거합니다
<script src="http://path/to/server/b?A=a&B=b&callbackFunctionName=myCallback"></script>
서버는 이 GET 요청을 처리하고 "myCallback('응답 값')" 문자열을 반환합니다
프런트엔드 스크립트가 로드된 후 실제로 스크립트에서 실행됩니다myCallback('response value')
myCallback('response value')
교차 도메인 요청이 완료되었나요?
GET
페이지에 js 코드를 동적으로 추가하는 것과 유사하게 js 파일을 게시할 수 있다고 생각하시나요?
요청한 주소가 다음과 같은 웹페이지를 반환한다고 가정해 보세요.
브라우저는 이 웹페이지를 가져온 후 구문 분석하고
이 코드 줄을 작성할 때 여기에 js 파일이 필요하다는 것을 알고 있으므로 이 js 파일을 가져오기 위한 요청을 시작합니다. 이 요청은 POST가 아닌 GET 메서드만 사용할 수 있습니다. 브라우저 주소 표시줄에 Enter를 눌러 입력하는 것과 같습니다.
JSONP의 구현 원리는 스크립트 태그를 생성한 후 src에 요청해야 하는 API 주소를 넣는 것이므로 GET만 가능합니다.
<script> 태그 때문에 GET만 지원됩니다
JSONP는
【JS 스크립트를 요청하고 이 스크립트의 실행 결과를 데이터로 사용】
방식입니다.
그럼 스크립트 태그를 통해 소개된 스크립트를 POST해 주실 수 있나요?
(JSONP 라이브러리의 소스코드를 읽어보신 분이라면 공통 구현 코드가 실제로
document.createElement('script')
스크립트 태그를 생성하여 본문에 삽입한다는 것을 아실 겁니다. 여기서는 요청 형식을 설정할 공간이 없습니다.)도메인 이름 A의 JS 코드 AJAX는 도메인 이름 B의 서버 데이터를 요청합니다. 이는 기본적으로 불가능한 도메인 간 AJAX 요청입니다.
그러나 HTML에는 img 스크립트 태그와 같이 도메인 간 요청이 이루어질 수 있는 위치가 있습니다. 해당 src 속성은 도메인 이름 A에 속하지 않는 주소(즉, 크로스 도메인)를 가리킵니다.
그런데 누군가는 위의 특성을 이용하여 도메인 전반에 걸쳐 콘텐츠를 얻을 수 있는 스크립트의 src 기능을 선택하고 JSONP와 같은 해킹 프로토콜을 개발했습니다. (src의 요청은 모두 GET입니다)
JSONP 요청이 다음과 같다고 가정합니다.
으아악비하인드 스토리:
스크립트 태그
<script src="http://path/to/server/b?A=a&B=b&callbackFunctionName=myCallback"></script>
를 연결하여 지정된 주소에 대한 GET 요청을 트리거합니다서버는 이 GET 요청을 처리하고 "myCallback('응답 값')" 문자열을 반환합니다
프런트엔드 스크립트가 로드된 후 실제로 스크립트에서 실행됩니다
myCallback('response value')
교차 도메인 요청이 완료되었나요?
GET
페이지에 js 코드를 동적으로 추가하는 것과 유사하게 js 파일을 게시할 수 있다고 생각하시나요?
요청한 주소가 다음과 같은 웹페이지를 반환한다고 가정해 보세요.
으아악브라우저는 이 웹페이지를 가져온 후 구문 분석하고
로 구문 분석해야 합니다. 으아악이 코드 줄을 작성할 때 여기에 js 파일이 필요하다는 것을 알고 있으므로 이 js 파일을 가져오기 위한 요청을 시작합니다. 이 요청은 POST가 아닌 GET 메서드만 사용할 수 있습니다. 브라우저 주소 표시줄에 Enter를 눌러 입력하는 것과 같습니다.
JSONP의 구현 원리는 스크립트 태그를 생성한 후 src에 요청해야 하는 API 주소를 넣는 것이므로 GET만 가능합니다.
<script> 태그 때문에 GET만 지원됩니다