>  기사  >  백엔드 개발  >  php jsonp는 json 데이터를 변환합니다

php jsonp는 json 데이터를 변환합니다

王林
王林원래의
2023-05-28 17:50:08805검색

모바일 인터넷의 급속한 발전으로 인해 Web API를 사용하여 데이터 서비스를 제공하는 웹 사이트가 점점 더 많아지고 있습니다. Web API를 사용하여 프런트 엔드에서 데이터를 얻을 때 일반적으로 AJAX를 사용하여 비동기 요청을 합니다. 그러나 브라우저의 동일 출처 정책 제한으로 인해 AJAX는 동일 출처 서버에서만 데이터를 요청할 수 있으며, 이로 인해 프런트 엔드의 데이터 획득 기능 범위가 제한됩니다.

크로스 도메인 문제를 해결하기 위해 jsonP 기술이 탄생했습니다. 프런트엔드 데이터 수집에 jsonP를 적용하는 방법에 대해 자세히 알아 보겠습니다.

1. JSONP 원칙

JSONP(JSON with padding)는 도메인 간 데이터 전송 방법이며, 스크립트 태그를 동적으로 추가하여 JSON 데이터를 가져옵니다. 프론트엔드에서 JSONP를 사용하는 원칙은 다음과 같습니다.

먼저 프론트엔드는 서버에 JSONP 요청을 시작하며, 요청 주소는 크로스 도메인 주소입니다. JSONP 요청의 URL에는 콜백 매개변수가 포함되어야 합니다. 백엔드는 이 매개변수를 기반으로 응답 JSON 데이터를 생성하고 이를 함수 호출 형식으로 프런트엔드에 반환합니다. 그런 다음 프런트엔드는 응답 데이터를 구문 분석하고 처리합니다.

구체적인 프로세스는 아래 그림과 같습니다.

2. 서버가 JSONP 요청에 응답합니다

현재 끝은 JSONP 요청을 시작하며 서버는 요청에 올바르게 응답해야 합니다. JSONP 요청의 경우 서버는 지정된 이름의 JavaScript 함수를 반환하고 함수가 호출될 때 서버에서 생성된 JSON 데이터를 호출해야 합니다. 다음은 JSONP 응답의 예입니다.

요약하자면 서버는 다음 사항을 구현해야 합니다.

  1. 프런트 엔드 요청을 수신하고 콜백 매개변수를 기반으로 JSON 데이터를 생성합니다.
  2. JSON 데이터를 다음과 같이 전달합니다. 지정된 이름을 가진 JavaScript 함수에 대한 매개변수
  3. 전체 응답을 HTTP 응답 본문에 작성합니다.

3. JSONP 응답을 프런트엔드에서 처리

서버가 JSONP 요청에 올바르게 응답하면 프런트엔드에서 응답 데이터를 올바르게 처리해야 합니다. 프런트엔드에서 해야 할 일은 다음과 같습니다.

  1. 콜백 매개변수로 지정된 함수 이름을 기반으로 동일한 이름의 함수를 생성합니다.
  2. 응답 JSON 데이터를 가져오고 JSON 데이터를 이전에 매개변수로 전달합니다. 같은 이름의 함수를 만들었습니다.

다음은 JSONP 처리 예시입니다.

마지막으로 주의할 점은 JSONP 요청 시 반환된 데이터에 JavaScript 문이 포함된 경우 응답 데이터가 JavaScript 형식으로 반환되기 때문입니다. , 이스케이프 처리가 필요합니다. 그렇지 않으면 프런트 엔드 코드 실행에 영향을 미칩니다. 일반적인 이스케이프 함수에는 jQuery의 $.parseJSON() 함수와 JavaScript의 JSON.parse() 함수가 포함됩니다.

계속...

위 내용은 php jsonp는 json 데이터를 변환합니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.