지원 지원 문의 | 시스템 상태 시스템 상태
페이지 내용

    학습 안내서 : REST API 사용

    이 주제에서는 먼저 웹 애플리케이션에서 REST API를 사용하는 방법에 대한 고급 개요를 제공합니다. XMLHttpRequest() 그리고 프록시. 그런 다음이 문서의 뒷부분에서 예제 코드에 대해 자세히 설명합니다. 첫 번째 예는 Analytics API 검색 및 표시 Brightcove player 컨트롤 바 현재 비디오의 조회수 player 했다. 두 번째로 약간 더 복잡한 예제에서는 Analytics API 과 함께 Brightcove Player 카탈로그를 사용하여 계정에서 가장 인기있는 비디오를 검색하고 재생 목록에 표시하십시오. 이 문서의 코드 토론은 올바른 REST API에서 원하는 데이터를 가져 오는 데 중점을 둡니다.

    높은 수준의보기

    REST API를 사용하려면 몇 개의 조각이 있어야합니다. 간단히 말해, 그들은 다음과 같습니다 :

    • 클라이언트 코드: 클라이언트 코드는 특정 데이터를 요구 한 다음 애플리케이션 요구 사항에 따라 표시합니다. 클라이언트 코드는이 문서의 어느 부분에서 가장 자주 쓰게 될 것이므로 논의 될 것입니다.
    • 프록시 서버: 보안상의 이유로 REST API는 클라이언트에서 클라이언트 자격 증명과 같은 기밀 정보를 보내는 것이 권장되므로 클라이언트에서 직접 데이터 요청을 수락하지 않습니다. 즉, 프록시는 클라이언트와 REST API 사이의 중개자 역할을합니다. 예제에 사용 된 프록시는 PHP로 작성되었으며이 문서의 뒷부분에서 설명합니다. 프록시는 사용자가 제어 할 수있는 서버에 설치해야하며 원하는 언어로 작성할 수 있습니다. 제안 된 프록시 구성을 사용하면 API를 한 번 쓰고 사용할 수 있습니다.
    • REST API: Brightcove는 Brightcove 플랫폼을 사용자 정의, 확장 및 통합 할 수있는 포괄적 인 API 세트를 제공합니다. 참조 개요 : Video Cloud 아피스 자세한 내용은 문서를 참조하십시오.

    다음 다이어그램은 Brightcove의 REST API 중 하나에서 데이터를 검색하기위한 프로세스의 세 가지 핵심 엔티티 간 상호 작용을 보여줍니다.

    기본 조각 개요

    클라이언트 기능 개요

    클라이언트 측 코드는 데이터를 요청하는 API에 따라 크게 변경됩니다. 위에서 언급했듯이 프록시는 한 번만 작성되며 코드를 수정하지 않으며 API는 Brightcove에서 유지 관리합니다. 그렇기 때문에 문서 중 하나가 API 중 하나에서 원하는 데이터를 검색하도록 클라이언트 코드를 변경하는 방법을 배우는 데 중점을 둡니다.

    아래 다이어그램은 클라이언트 코드의 주요 부분에 초점을 맞추고 있습니다.

    • 이 기능은 HTTPRequest 프록시에게. 모호성을 피하기 위해 함수의 이름이 지정됩니다. makeRequest(). 아래 그림의 오른쪽에 그려져 있습니다.
    • 요청에 필요한 정보를 수집하는 코드입니다. 다이어그램의 왼쪽 상단에 그려져 있습니다. 이 코드는 대개 아주 직설적이며 프로그래머를 시작하는 사람에게도 잘 알려진 개념을 사용합니다.
    • 앞에서 언급 한 호출을 실행합니다. makeRequest() 기능. 다이어그램의 왼쪽 하단에 그려져 있습니다. 호출은에 함수를 전달합니다. makeRequest() 매개 변수로. 그런 다음 makeRequest() 그 함수가 호출됩니다. 이것은 익명으로 정의 된 예제입니다. 콜백 기능.

    다이어그램의 두 섹션이 표시됩니다. 비동기 활동. 다이어그램에서 서로 다른 두 위치로 표현되었지만 사실 이것은 비동기 활동과 동일하며 알 수없는 시간을 나타냅니다.

    • 클라이언트가 프록시에 요청을 보냅니다.
    • API에서 데이터를 요청하는 프록시입니다.
    • 결과 세트를 빌드하고이를 프록시로 리턴하는 API.
    • 클라이언트에 데이터를 반환하는 프록시입니다.

    호출하는 상자의 논리 흐름 화살표는 makeRequest() (왼쪽 아래 상자)는 코드가 두 개의 다른 시간에 실행된다는 것을 나타내는 것처럼 보입니다. 함수에 대한 호출이 이루어 지지만 콜백 함수는 다음과 같은 경우에만 실행됩니다. makeRequest() 작업을 완료하고 요청 된 데이터를 함수 호출 코드로 리턴하는 콜백 함수가 실행됩니다.

    클라이언트 기능 개요

    예제 코드 연습

    코드를 하나의 조각으로 보는 대신 섹션에서 제시하고 논의 할 것입니다. 섹션 중 일부는 위의 다이어그램과 관련됩니다.

    기본 player 암호

    이 코드 섹션에는 Brightcove Player 인 페이지 삽입 코드.

    • 11-21 라인 : 표준 Brightcove Player 코드 추가 id 속성이 추가되었습니다.
    	<!doctype html>
    	<html>
    	
    	<head>
    		<meta charset="UTF-8">
    		<title>Untitled Document</title>
    	</head>
    	
    	<body>
    	
    	<video-js id="myPlayerID"
    		data-video-id="3851380732001"
    		data-account="1752604059001"
    		data-player="HkAzSmB0l"
    		data-embed="default"
    		data-application-id
    		class="video-js"
    		controls
    		width="640"
    		height="360"></video-js>
    	<script src="https://players.brightcove.net/1752604059001/HkAzSmB0l_default/index.min.js"></script>

    전화 걸기 준비 중

    이 코드 섹션은 변수를 초기화하고에 대한 호출을 준비합니다. makeRequest(). 일반적으로 읽기 요청의 경우 다음 정보를 제공해야합니다.

    1. 예를 들어, 사용할 프록시의 URL (물론이 프록시는 사용자의 제어하에 있어야합니다.) :
      	https://solutions.brightcove.com/bcls/bcls-proxy/doc-samples-proxy-v2.php
    2. 일반적으로 동적으로 생성 된 실제 요청에 필요한 URL입니다.
      	https://analytics.api.brightcove.com/v1/alltime/accounts/1752604059001/videos/4825279519001
    3. HTTP 메소드 (예 : GET.

    예제는 다음과 같습니다.

    • Line 1 : 플레이어가 상호 작용할 준비가 될 때까지 대기하는 표준 코드.
    • 2-4 : 나중에 코드에 필요한 변수의 값을 만들고 설정합니다.
    • 7-12 행 : loadstart 이벤트 그래서 mediainfo 개체가 채워집니다. 변수를 할당하여 해당 변수에 필요한 값을 보유합니다. Analytics API 엔드 포인트.
    • Line 13 : 통화에 HTTP 메서드를 설정합니다.
    	videojs.getPlayer('myPlayerID').ready(function() {
    	  var myPlayer = this,
    		accountId = myPlayer.bcinfo.accountId,
    		options = {};
    	
    		// +++ Wait for loadstart event so can use mediainfo object +++
    		myPlayer.on('loadstart', function() {
    			var videoId = myPlayer.mediainfo.id,
    			baseURL = 'https://analytics.api.brightcove.com/v1/alltime/accounts/',
    			endPoint = accountId + '/videos/' + videoId;
    			options.proxyURL = "https://solutions.brightcove.com/bcls/bcls-proxy/doc-samples-proxy-v2.php";
    			options.url = baseURL + endPoint;
    			options.requestType = "GET";

    요구 makeRequest()

    이 코드 섹션은 makeRequest() 기능. 두 개의 매개 변수가 전달됩니다. 첫 번째는 끝점에 대한 정보를 보유하는 options 객체이고 두 번째는 콜백 함수입니다. 이것은 비동기 호출이므로 익명으로 정의 된 콜백 함수는 REST API에 의해 데이터가 반환 될 때까지 호출되지 않습니다. makeRequest() 기능.

    • 1 전화 : makeRequest() 함수에서 호출에 필요한 값을 전달합니다. options 목적. 이 경우 객체에는 다음이 포함됩니다.
      옵션 개체
    • 3-13 : 콜백 함수는 익명 함수 (노란색으로 강조 표시)로 정의됩니다. 이 함수는 매개 변수이며 여기서 호출되지는 않지만 나중에 코드에서 호출된다는 점을 기억하십시오.
    • 6, 8, 10 : console.log() 표시 문 :
      • API 호출에 의해 반환되는 원시 JSON 문자열입니다.
      • JSON 개체에 의해 생성 된 JSON 개체 JSON.parse() 문자열을 객체로 변환하는 메소드.
      • 단순한 방법을 사용하여 개체에서 추출한 실제 조회수입니다. object.property 표기법.
    • Line 12 : 컨트롤 막대의 뷰 수를 표시하는 함수를 호출합니다.

    다음 스크린 샷은 콘솔에서 실제 표시된 데이터를 보여줍니다. console.log 진술 :

    콜백 함수에서의 데이터 처리
    	// +++ Make the request to the Analytics API +++
    	// Extract views from data returned by Analytics API
    	makeRequest(options, function(viewsRaw) {
    	var viewsCount;
    	// Remove console.log command for production code
    	console.log('viewsRaw', viewsRaw);
    	viewsObject = JSON.parse(viewsRaw);
    	console.log('viewsObject', viewsObject);
    	viewsCount = viewsObject.alltime_video_views;
    	console.log('views', viewsCount);
    	// Call function to place data in controlbar
    	placeCountInControlbar(viewsCount);
    	});

    실제 makeRequest() 기능

    이 섹션에서는 실제로 코드를 정의하는 코드를 검토합니다. makeRequest() 함수. 함수를 정의하는 코드는 수정하지 않아도 그대로 반복해서 사용되는 방식으로 작성됩니다. 이것이 사실이 아닌 경우를 발견 할 수 있지만, 대부분의 경우이 코드를 수정하지 않아도됩니다.

    코드를 한 줄씩 토론하면 다음과 같습니다.

    • 1-6 : 함수 정의와 변수 생성. 요점은 새로운 XMLHttpRequest 개체가 생성됩니다.
    • 8, 26 : 이벤트 핸들러 함수를 정의합니다. readyState 변경.
    • 9, 23, 25 : try-catch 요청이 높은 수준에서 실패하는 경우
    • 10, 11 : 사용 if 요청이 완료되었는지 확인하는 명령문 (readyState 4)가 성공적으로 완료되면 상태는 200 범위에 있습니다. 다음은 콘솔 로그의 readyStatestatus 이벤트 처리기 정의의 값 :
      로깅 준비 상태 및 상태
    • Line 18 : 콜백 함수가 실행됩니다. 이렇게하면 반환 된 데이터가 API에서 콜백 함수로 전달됩니다. makeRequest ()를 호출하십시오. 섹션을 참조하십시오.
    • Line 33 : XNUMX에 대한 이벤트 핸들러를 설정합니다. XMLHttpRequest.onreadystatechange 행사.
    • Line 35 : 프록시에 대한 요청을 초기화합니다.
    • Line 38 : 비동기 요청을 보냅니다.
    	function makeRequest(options, callback) {
    	var httpRequest = new XMLHttpRequest(),
    	response,
    	requestParams,
    	dataString,
    	proxyURL = options.proxyURL,
    	// response handler
    	getResponse = function() {
    	try {
    		if (httpRequest.readyState === 4) {
    			if (httpRequest.status >= 200 && httpRequest.status < 300) {
    				response = httpRequest.responseText;
    				// some API requests return '{null}' for empty responses - breaks JSON.parse
    				if (response === '{null}') {
    					response = null;
    				}
    				// return the response
    				callback(response);
    			} else {
    				alert('There was a problem with the request. Request returned ' + httpRequest.status);
    			}
    		}
    	} catch (e) {
    		alert('Caught Exception: ' + e);
    	}
    	};
    	/**
    	* set up request data
    	* the proxy used here takes the following request body:
    	* JSON.stringify(options)
    	*/
    	// set response handler
    	httpRequest.onreadystatechange = getResponse;
    	// open the request
    	httpRequest.open('POST', proxyURL);
    	// set headers if there is a set header line, remove it
    	// open and send request
    	httpRequest.send(JSON.stringify(options));
    	}

    반환 된 데이터 표시

    이 코드는 반환 된 데이터를 컨트롤 막대에 배치하는 방법을 보여줍니다. 이 함수는 콜백 함수의 끝에 호출됩니다. makeRequest ()를 호출하십시오. 섹션을 참조하십시오.

    • 5, 16 : 함수를 정의하십시오.
    • 6 라인 : spacer 요소를 선택합니다.
    • Line 7 : 동적으로 div 요소입니다.
    • Line 9 : 레이블과 새롭게 생성 된 뷰의 값을 배치합니다. div 요소입니다.
    • 11 : JavaScript 사용 document.getElementsByClassName() 메소드를 얻기위한 메소드 spacer 요소입니다.
    • 13 : 스타일 spacer 오른쪽 뷰에서 합계 뷰를 표시하고 위쪽에서 10px를 내립니다. spacer.
    • Line 15 : 새로 생성되고 채워지고 스타일이 지정된 요소를 spacer.
    	/**
    	* Dynamically build a div that is then
    	* placed in the controlbar's spacer element
    	*/
    	function placeCountInControlbar(viewsCount) {
    	var spacer,
    	newElement = document.createElement('div');
    	//Place data in div
    	newElement.innerHTML = "Total Views: " + viewsCount;
    	//Get the spacer in the controlbar
    	spacer = document.getElementsByClassName('vjs-spacer')[0];
    	//Right justify content in the spacer and add top margin
    	spacer.setAttribute('style', 'justify-content: flex-end; margin-top: 10px');
    	//Add the dynamically built div to the spacer in the controlbar
    	spacer.appendChild(newElement);
    	}

    전체 코드 목록

    전체 기능 코드는이 GitHub 저장소에 있습니다. display-views-in-controlbar.html.

    간단한 디버깅

    보시다시피, REST API를 사용할 때 관련된 많은 부분이 있습니다. 앱이 제대로 작동하지 않을 때 문제가 발생할 수 있습니다. 어디에서 디버깅을 시작합니까?

    이 섹션에서는 몇 가지 간단한 제안을하고 디버깅 모험을 시작하기에 좋은 곳입니다. 다음 두 섹션에서는 필요한 가장 기본적인 정보, 전달하기 위해 전달되는 정보 및 반환되는 정보를 볼 수있는 방법을 제공합니다.

    통화 옵션 확인

    이 문서에서 설명하는 클라이언트 측 코드는 기본적으로 프록시 및 실제 API에서 사용할 올바른 옵션을 제공하는 것에 관한 것입니다. 따라서 옵션이 정확하다는 것이 올바른 코드 작동에 필수적이라는 것을 알고 있어야합니다. 이 작업을 수행하는 간단한 방법은 콘솔에 로그온하는 것입니다. options 그들은 객체에 전달되기 직전에 객체를 makeRequest 그들이 사용되는 함수 :

    디버깅 코드 로그 옵션

    옵션 오브젝트가 포함하는 것은 당신이하려고하는 것에 따라 다양하지만, 몇가지 기본은 항상있을 것입니다 :

    • 계정 ID. 별도의 속성이거나 API endPoint URL의 일부일 수 있습니다.
    • 프록시 URL은 프록시 저장 위치에 따라 달라집니다.
    • HTTP 메소드 유형입니다 (예 : GET, POST or PATCH.
    • API에서 실제 요청을하기 위해 프록시에서 사용하는 API 끝점 URL입니다. 예 :
      	https://players.api.brightcove.com/v2/accounts/57838016001/players
      	https://edge.api.brightcove.com/playback/v1/accounts/1752604059001/videos/5842800655001
      	https://analytics.api.brightcove.com/v1/alltime/accounts/1752604059001/videos/4093643993001

    API 요청에 따라 옵션 객체에 다른 속성이 필요할 수 있습니다. 다음은 모든 요청을하기 위해 옵션 개체를 기록 할 때 콘솔에 표시되는 예입니다. player특정 계정에서

    간단한 디버깅 옵션

    다음은 업데이트 할 때 사용되는 좀 더 복잡한 로그 옵션 개체입니다. players:

    디버깅 옵션

    반환 된 데이터보기

    반환되는 내용은 요청한 데이터와 오류가 반환되는 경우에 따라 달라집니다. 그러나 무엇이 반환되는지에 관계없이 반환되는 데이터를 확인하는 것이 가장 좋습니다. 이 작업을 수행하는 간단한 방법은 원시 콘솔에 로그온하는 것입니다. response 데이터를 호출 한 직후 makeRequest 기능:

    디버깅 코드 로그 옵션

    반환되는 것은 거의 무한한 가능성이 있지만 다음은 몇 가지 예입니다. 첫 번째는 모든 요청시 응답의 시작을 보여줍니다. player계정 :

    응답 디버깅 player의 요청

    플레이어를 업데이트 한 후 다음을 사용합니다. PATCH HTTP 메소드 :

    응답 디버깅 player 패치

    다음은 첫 번째 응답의 데이터 형식을보다 자세히 나타낸 것입니다.

    	{
    		"id": "1OHQdsTAr",
    		"preview_url": "http://preview-players.brightcove.net/v2/accounts/.../master/index.html",
    		"preview_embed_in_page": "http://preview-players.brightcove.net/v2/accounts/.../master/in_page.embed",
    		"preview_embed_code": "<iframe src='//preview-players.brightcove.net/v2/accounts/.../master/index.html' ...></iframe>"
    	}

    그리고 마지막으로, 여기에 오류가 발생했을 때 매우 귀중한 응답이 있습니다. 이 경우 올바른 자격 증명없이 계정이 사용되고있었습니다.

    오류시 디버깅 응답

    기타 문제 해결 팁

    문제가 있으면 여기를 찾아보십시오.

    응답 없음
    빈 응답을 받고 있는지 확인하는 방법은 두 가지가 있습니다.
    • API 참조를 확인하여 요청이 응답을 리턴하는지 확인하십시오. 일부는 내용이없는 201 또는 204 응답 만 반환합니다 (특히 DELETE 요청 만). 이 경우를 처리하기 위해 코드를 조정해야합니다.
    • 브라우저에서 개발자 도구의 네트워크 섹션을 확인하여 프록시 호출 성공 여부를 확인하십시오 (해당 서버를 일시적으로 사용할 수 없음).
      개발자 도구 네트워크 섹션
      개발자 도구 네트워크 섹션
    나는 응답을 보지만, 시도 할 때 JSON.parse() 그것, 나는 예외를 얻는다.
    여기에는 몇 가지 가능성이 있습니다.
    • 이전 항목보기 - 빈 스팅을 파싱하면 JSON 예외가 발생합니다.
    • 응답을보고 JSON 문자열인지 확인하십시오 ( { 또는 [). 요청이 JSON을 반환하지 않을 수도있는 몇 가지 경우가 있습니다. Analytics API 예를 들어, format 에 매개 변수 csv or xlxs. 다시 말하면 이러한 요청을하는 경우 비 JSON 응답을 처리하도록 코드를 조정해야합니다.

    • 대부분의 경우 API에서 반환되는 오류도 JSON 형식이지만 오류가 일반 텍스트 또는 HTML로 반환되는 경우는 예외입니다.

    프록시 코드

    앞에서 언급했듯이 프록시는 선택한 언어로 작성 될 수 있습니다. Brightcove API 설명서 예제는 PHP로 작성된 프록시를 사용합니다. 프록시 구현은 언어에 따라 다르므로 아래 PHP 코드는이 문서에서 자세히 분석되지 않습니다.

    프록시가 제공하는 기본 기능에는 다음이 포함되어야합니다.

    1. 클라이언트 요청을 수락하십시오.
    2. 를 얻을 수 인증 토큰 인사말 OAuth API.
    3. 인증 토큰 및 데이터 요청 (엔드 포인트)을 의도 된 API로 보냅니다.
    4. API에서 데이터를 수신합니다.
    5. 데이터를 클라이언트로 다시 보냅니다.
    	<?php
    	/**
    	 * proxy for Brightcove RESTful APIs
    	 * gets an access token, makes the request, and returns the response
    	 * Accessing:
    	 *     (note you should **always** access the proxy via HTTPS)
    	 *     Method: POST
    	 *     request body (accessed via php://input) is a JSON object with the following properties
    	 *
    	 * {string} url - the URL for the API request
    	 * {string} [requestType=GET] - HTTP method for the request
    	 * {string} [requestBody] - JSON data to be sent with write requests
    	 * {string} [client_id] - OAuth2 client id with sufficient permissions for the request
    	 * {string} [client_secret] - OAuth2 client secret with sufficient permissions for the request
    	 *
    	 * Example:
    	 * {
    	 *    "url": "https://cms.api.brightcove.com/v1/accounts/57838016001/video",
    	 *    "requestType": "PATCH",
    	 *    "client_id": "0072bebf-0616-442c-84de-7215bb176061",
    	 *    "client_secret": "7M0vMete8vP_Dmb9oIRdUN1S5lrqTvgtVvdfsasd",
    	 *    "requestBody": "{\"description\":\"Updated video description\"}"
    	 * }
    	 *
    	 * if client_id and client_secret are not included in the request, default values will be used
    	 *
    	 * @returns {string} $response - JSON response received from the API
    	 */
    	
    	// security checks
    	// if you want to do some basic security checks, such as checking the origin of the
    	// the request against some white list, this would be a good place to do it
    	// CORS enablement and other headers
    	header("Access-Control-Allow-Origin: *");
    	header("Content-type: application/json");
    	header("X-Content-Type-Options: nosniff");
    	header("X-XSS-Protection");
    	
    	// default account values
    	// if you work on one Brightcove account, put in the values below
    	// if you do not provide defaults, the client id, and client secret must
    	// be sent in the request body for each request
    	$default_client_id     = 'YOUR_CLIENT_ID';
    	$default_client_secret = 'YOUR_CLIENT_SECRET';
    	
    	// get request body
    	$requestData = json_decode(file_get_contents('php://input'));
    	
    	// set up access token request
    	// check to see if client id and secret were passed with the request
    	// and if so, use them instead of defaults
    	if (isset($requestData->client_id)) {
    			$client_id = $requestData->client_id;
    	}
    	
    	if (isset($requestData->client_secret)) {
    			$client_secret = $requestData->client_secret;
    	}
    	
    	$auth_string = "{$client_id}:{$client_secret}";
    	
    	// make the request to get an access token
    	$request = "https://oauth.brightcove.com/v4/access_token?grant_type=client_credentials";
    	$curl          = curl_init($request);
    	curl_setopt($curl, CURLOPT_USERPWD, $auth_string);
    	curl_setopt($curl, CURLOPT_POST, TRUE);
    	curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);
    	curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE);
    	curl_setopt($curl, CURLOPT_HTTPHEADER, array(
    		'Content-type: application/x-www-form-urlencoded',
    	));
    	
    	$response = curl_exec($curl);
    	$curl_info = curl_getinfo($curl);
    	$php_log = array(
    		"php_error_info" => $curl_info
    	);
    	$curl_error = curl_error($curl);
    	
    	curl_close($curl);
    	
    	// Check for errors
    	// it's useful to log as much info as possible for debugging
    	if ($response === FALSE) {
    		log_error($php_log, $curl_error);
    	}
    	
    	// Decode the response and get access token
    	$responseData = json_decode($response, TRUE);
    	$access_token = $responseData["access_token"];
    	// get request type or default to GET
    	$method = "GET";
    	if ($requestData->requestType) {
    			$method = $requestData->requestType;
    	}
    	
    	// get the URL and authorization info from the form data
    	$request = $requestData->url;
    	// check for a request body sent with the request
    	if (isset($requestData->requestBody)) {
    		$data = $requestData->requestBody;
    	}
    		$curl = curl_init($request);
    		curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);
    		curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE);
    		curl_setopt($curl, CURLOPT_HTTPHEADER, array(
    			'Content-type: application/json',
    			"Authorization: Bearer {$access_token}"
    		));
    		switch ($method)
    			{
    				case "POST":
    					curl_setopt($curl, CURLOPT_POST, TRUE);
    					if ($requestData->requestBody) {
    						curl_setopt($curl, CURLOPT_POSTFIELDS, $data);
    					}
    					break;
    				case "PUT":
    					// don't use CURLOPT_PUT; it is not reliable
    					curl_setopt($curl, CURLOPT_CUSTOMREQUEST, $method);
    					if ($requestData->requestBody) {
    						curl_setopt($curl, CURLOPT_POSTFIELDS, $data);
    					}
    					break;
    				case "PATCH":
    					curl_setopt($curl, CURLOPT_CUSTOMREQUEST, $method);
    					if ($requestData->requestBody) {
    						curl_setopt($curl, CURLOPT_POSTFIELDS, $data);
    					}
    					break;
    				case "DELETE":
    					curl_setopt($curl, CURLOPT_CUSTOMREQUEST, $method);
    					if ($requestData->requestBody) {
    						curl_setopt($curl, CURLOPT_POSTFIELDS, $data);
    					}
    					break;
    				default:
    					// GET request, nothing to do;
    			}
    		$response = curl_exec($curl);
    		$curl_info = curl_getinfo($curl);
    		$php_log = array(
    			"php_error_info" => $curl_info
    		);
    		$curl_error = curl_error($curl);
    		curl_close($curl);
    	
    	// Check for errors and log them if any
    	// note that logging will fail unless
    	// the file log.txt exists in the same
    	// directory as the proxy and is writable
    	
    	if ($response === FALSE) {
    		log_error($php_log, $curl_error);
    	}
    	
    	function log_error($php_log, $curl_error) {
    		$logEntry = "\nError:\n". "\n".date("Y-m-d H:i:s"). " UTC \n" .$curl_error. "\n".json_encode($php_log, JSON_PRETTY_PRINT);
    		$logFileLocation = "log.txt";
    		$fileHandle      = fopen($logFileLocation, 'a') or die("-1");
    		fwrite($fileHandle, $logEntry);
    		fclose($fileHandle);
    		echo "Error: there was a problem with your API call"+
    		die(json_encode($php_log, JSON_PRETTY_PRINT));
    	}
    	
    	// return the response to the AJAX caller
    	echo $response;
    	?>

    위 코드는 프록시 서버의 전체 코드이지만 GitHub 저장소에도 있습니다. sample-proxy-apps 에서 PHP는 폴더에 있습니다.

    예제 2

    이 두 번째 예제는 앞에서 설명한 것보다 더 복잡합니다. 이 예는 재생 목록에있는 계정의 10 가장 인기있는 동영상을 표시합니다. 코드의 주요 단계는 다음과 같습니다.

    1. 요청 Analytics API 계정에서 가장 많은 조회수를 가진 10 동영상 이 단계에는 콜백 함수를 사용하는 비동기 호출이 포함됩니다.
    2. 반환 된 것에서 Analytics API 데이터를 추출하고 비디오 ID 만 추출하여 배열에 배치하십시오. 반환 된 데이터에서 ID 추출을 수행하는 도우미 함수가 작성됩니다.
    3. 배열의 ID 목록에있는 각 동영상에 대한 전체 동영상 개체를 요청합니다. 이 단계에서는 배열을 반복하고 비디오 객체를 요청합니다. player.catalog.getVideo(). 물론이 작업에는 여러 비동기 호출이 포함됩니다. catalog. 헬퍼 함수는 ID를 기반으로 비디오 객체를 검색하고 객체를 배열에 배치하기 위해 작성됩니다.
    4. 재생 목록을 사용하도록 동영상 개체 배열을 재생 목록에 배치 player.

    이제는 API를 호출하는 방법에 대한 많은 개념과 특정 코드에 익숙하므로 코드를 호출하는 코드 만 makeRequest() 기능이 자세히 설명되어 있습니다.

    • 2 전화 : makeRequest() 함수는 익명으로 정의 된 콜백 함수 (노란색으로 강조 표시된)와 함께 성공적인 REST API 호출에 필요한 옵션을 인수로 전달합니다. 위에서 익숙하게 들릴 것입니다. 매우 중요한 것은 makeRequest() 함수는 이전 예제에서 사용 된 것과 똑같은 함수입니다. 코드에서 동일한 작업을 수행 할 수 있습니다. 그만큼 makeRequest() 이 함수는 Brightcove REST API를 호출 할 때 재사용되도록 작성되었습니다.
    • Line 3 : 구문 분석 된 JSON 반환 데이터를 보관할 변수를 만듭니다.
    • Line 5 : 문자열에서 객체로 if를 변환하기 위해 반환 된 데이터를 파싱합니다.
    • Line 7 : 도우미 함수를 사용하여 반환 된 데이터에서 비디오 ID를 추출합니다. 불행히도 Analytics API 전체 비디오 객체를 반환하지 않으므로 전체 객체에 액세스하려면 ID가 필요합니다.
    • 9-12 : getVideoData 콜백 함수를 사용하여 함수를 채우는 도우미 함수 videoObjects 전달 된 ID를 기반으로 배열.
    • Line 11 : 비디오 객체 배열로 재생 목록을 채 웁니다.
    	// +++ Make the CMS API request to get matching video IDs +++
    	makeRequest(options, function(mostWatchedVideos) {
    		var JSONmostWatchedVideos;
    		// Convert response string into JSON
    		JSONmostWatchedVideos = JSON.parse(mostWatchedVideos);
    		// Extract the needed video IDs into an array
    		videoData = extractVideoData(JSONmostWatchedVideos);
    		// Get video objects based on array of video IDs
    		getVideoData(videoData, function(videoObjects) {
    			// Add the most watched videos list to the player as a playlist
    			myPlayer.playlist(videoObjects);
    		});
    	});

    전체 코드 목록

    완전한 기능을 갖춘 예제는이 CodePen에 있습니다. 재생 목록에서 가장 많이 본 동영상.


    페이지 최종 업데이트 28 Sep 2020