웹 API 샘플(클라이언트 쪽 JavaScript)

아티클
03/03/2017

게시 날짜: 2017년 1월

적용 대상: Dynamics 365 (online), Dynamics 365 (on-premises), Dynamics CRM 2016, Dynamics CRM Online

이 항목에서는 클라이언트 쪽 JavaScript를 사용하는 웹 API 샘플에 대한 일반적인 이해를 제공합니다. 각 샘플은 Microsoft Dynamics 365 웹 API의 다른 측면에 초점을 맞추고 있지만 모두 이 항목에서 설명하는 비슷한 프로세스와 구조를 따릅니다.

이 항목의 내용

클라이언트 쪽 JavaScript를 사용하는 웹 API 샘플

샘플 소스 코드를 다운로드하는 방법.

샘플을 포함하는 Dynamics 365 솔루션을 가져오는 방법.

실행 중인 스크립트를 보기 위해 샘플을 실행하는 방법

각 샘플의 일반 요소

클라이언트 쪽 JavaScript를 사용하는 웹 API 샘플

다음 샘플에서는 여기서 설명한 패턴을 사용합니다.

샘플	샘플 그룹	설명
웹 API 기본 작업 샘플(클라이언트 쪽 JavaScript)	웹 API 기본 작업 샘플	Dynamics 365 엔터티 레코드를 작성, 검색, 업데이트, 삭제, 연결, 연결 해제하는 방법을 보여줍니다.
웹 API 쿼리 데이터 샘플(클라이언트 쪽 JavaScript)	웹 API 쿼리 데이터 샘플	Microsoft Dynamics 365 쿼리 함수뿐만 아니라 OData v4 쿼리 구문과 함수를 사용하는 방법을 설명합니다. 미리 정의된 쿼리로 작업하고 FetchXML을 사용하여 쿼리를 수행하는 작업의 설명을 포함합니다.
웹 API 조건부 작업 샘플(클라이언트 쪽 JavaScript)	웹 API 조건부 작업 샘플	조건부 작업을 수행하는 방법을 보여줍니다. 이 작업의 동작은 지정한 조건에 따라 다릅니다.
웹 API 함수 및 동작 샘플(클라이언트 쪽 JavaScript)	웹 API 함수 및 동작 샘플	사용자 지정 동작을 포함하는 바운드 및 언바운드 함수 및 동작을 사용하는 방법을 보여줍니다.

샘플 소스 코드를 다운로드하는 방법.

각 샘플에 대한 소스 코드는 MSDN 코드 갤러리에서 사용할 수 있습니다. 이 샘플에 대한 각 페이지에는 각 샘플에 대한 다운로드 링크가 포함됩니다.

이 샘플을 다운로드한 후 압축 파일을 풉니다. 프로젝트는 빈 ASP.NET 웹 응용 프로그램 프로젝트이기 때문에 C# 폴더 내에서 각 샘플에 대한 Visual Studio 2015 솔루션을 찾습니다. 가져오고 실행할 수 있는 Dynamics 365 솔루션 다운로드도 제공됩니다.

참고

Microsoft Visual Studio 또는 ASP.NET 모두 Dynamics 365에 대한 클라이언트 쪽 JavaScript를 개발할 필요는 없지만 MSDN 코드 갤러리 사이트는 컨테이너 Microsoft Visual Studio에 파일을 포함해야 합니다. 그러나 Microsoft Visual Studio는 좋은 JavaScript 쓰기 작업 경험을 제공하지 않습니다.

샘플을 포함하는 Dynamics 365 솔루션을 가져오는 방법.

각 프로젝트 내에서 Microsoft Dynamics 365 관리형 솔루션 파일을 찾을 수 있습니다. 이 파일의 이름은 샘플의 프로젝트 이름에 따라 달라지지만 파일 이름은 _managed.zip으로 끝납니다.

Dynamics 365 솔루션을 Dynamics 365 서버에 가져오려면 다음을 수행합니다.

다운로드한 zip 파일의 압축을 풀고 역시 zip 파일인 Dynamics 365 솔루션 파일을 찾습니다. 예를 들어, Basic Operations 샘플을 다운로드했다면 WebAPIBasicOperations\WebAPIBasicOperations_1_0_0_0_managed.zip이라는 이름의 Dynamics 365 솔루션 zip 파일을 찾습니다.
Dynamics 365 UI에서 설정 > 솔루션으로 이동합니다. 이 페이지에서 Dynamics 365 서버의 모든 솔루션을 나열합니다. 이 솔루션을 가져오면 그 샘플의 솔루션 이름이 목록에 나타납니다(예: 웹 API 기본 작업).
가져오기를 클릭하고 가져오기 대화의 지시에 따라 작업을 완료합니다.

실행 중인 스크립트를 보기 위해 샘플을 실행하는 방법

샘플 프로그램은 Dynamics 365 내에서 웹 리소스로 실행됩니다. 가져온 솔루션은 샘플 데이터를 유지 또는 삭제하는 옵션과 샘플 프로그램을 시작하는 단추를 제공하는 구성 페이지를 제공합니다.Basic Operations 샘플에서 인터페이스는 다음과 같이 표시됩니다.

Dynamics 365 Web API Sample Configuration page

샘플을 실행하려면 다음을 수행합니다.

Dynamics 365의 모든 솔루션 페이지에서 솔루션 이름(예: 웹 API 기본 작업 링크)을 클릭합니다. 새 창에서 솔루션의 속성이 열립니다.
왼쪽 탐색 메뉴에서 구성을 클릭합니다.
시작 샘플 단추를 클릭하여 샘플 코드를 실행합니다.

각 샘플의 일반 요소

다음 목록에는 각 샘플에 있는 몇 가지 공통 요소를 표시합니다.

Sdk.startSample 함수는 사용자가 HTML 페이지에서 시작 샘플 단추를 클릭할 때 호출됩니다.Sdk.startSample 함수는 전역 변수를 초기화하고 체인에 있는 첫 번째 작업을 시작합니다.
프로그램의 출력 및 오류 메시지가 브라우저의 디버거 콘솔에 전송됩니다. 출력을 보려면 샘플을 실행하기 전에 먼저 콘솔 창을 엽니다.Windows Internet Explorer 및 Microsoft Edge 브라우저에서 F12를 눌러 콘솔 창에 있는 개발자 도구에 액세스합니다.
이러한 샘플은 이를 지원하는 최신 브라우저에 대해 기본 ES6-Promise 구현을 사용합니다.Internet Explorer 11의 경우 Internet Explorer 11은 이 기능에 대한 기본 지원이 없는 Microsoft Dynamics 365에서 지원하는 유일한 브라우저이기 때문에 이 샘플은 ES6-Promise polyfill을 사용합니다.

promise는 필요하지 않습니다. 콜백 함수를 사용하여 유사한 상호 작용을 수행할 수 있습니다. 자세한 내용은 Promise를 사용하여 재사용 가능한 함수 만들기을 참조하십시오.

Sdk.request 함수는 매개 변수로 전달된 정보에 따라 요청을 처리합니다. 각 샘플의 필요에 따라 전달된 매개 변수는 달라질 수 있습니다. 자세한 내용은 샘플의 소스 코드를 참조하십시오.

/**
 * @function request
 * @description Generic helper function to handle basic XMLHttpRequest calls.
 * @param {string} action - The request action. String is case-sensitive.
 * @param {string} uri - An absolute or relative URI. Relative URI starts with a "/".
 * @param {object} data - An object representing an entity. Required for create and update actions.
 * @returns {Promise} - A Promise that returns either the request object or an error object.
 */
Sdk.request = function (action, uri, data) {
    if (!RegExp(action, "g").test("POST PATCH PUT GET DELETE")) { // Expected action verbs.
        throw new Error("Sdk.request: action parameter must be one of the following: " +
            "POST, PATCH, PUT, GET, or DELETE.");
    }
    if (!typeof uri === "string") {
        throw new Error("Sdk.request: uri parameter must be a string.");
    }
    if ((RegExp(action, "g").test("POST PATCH PUT")) && (data === null || data === undefined)) {
        throw new Error("Sdk.request: data parameter must not be null for operations that create or modify data.");
    }

    // Construct a fully qualified URI if a relative URI is passed in.
    if (uri.charAt(0) === "/") {
        uri = clientUrl + webAPIPath + uri;
    }

    return new Promise(function (resolve, reject) {
        var request = new XMLHttpRequest();
        request.open(action, encodeURI(uri), true);
        request.setRequestHeader("OData-MaxVersion", "4.0");
        request.setRequestHeader("OData-Version", "4.0");
        request.setRequestHeader("Accept", "application/json");
        request.setRequestHeader("Content-Type", "application/json; charset=utf-8");
        request.onreadystatechange = function () {
            if (this.readyState === 4) {
                request.onreadystatechange = null;
                switch (this.status) {
                    case 200: // Success with content returned in response body.
                    case 204: // Success with no content returned in response body.
                        resolve(this);
                        break;
                    default: // All other statuses are unexpected so are treated like errors.
                        var error;
                        try {
                            error = JSON.parse(request.response).error;
                        } catch (e) {
                            error = new Error("Unexpected Error");
                        }
                        reject(error);
                        break;
                }

            }
        };
        request.send(JSON.stringify(data));
    });
};

Sdk.request 함수는 promise를 반환합니다. promise에 의해 래핑된 요청이 완료되면 promise가 해결되거나 거부됩니다. 이 문제가 해결될 경우 다음 then 메서드의 함수가 호출됩니다. 이 문제가 거부될 경우 다음 catch 메서드의 함수가 호출됩니다.then 메서드 내의 함수 자체가 promise를 반환하면 연속적인 then 메서드 내에서 일련의 작업을 계속할 수 있습니다. promise가 반환되면 전통적인 콜백 함수에 많은 개발자가 선호하는 방식으로 이러한 샘플 작업을 연결할 수 있습니다. promise에 대한 자세한 내용은 JavaScript promise를 참조하십시오.

참고 항목

Microsoft Dynamics 365 웹 API 사용
웹 API 샘플
웹 API 샘플(C#)
웹 API 기본 작업 샘플(클라이언트 쪽 JavaScript)
웹 API 쿼리 데이터 샘플(클라이언트 쪽 JavaScript)
웹 API 조건부 작업 샘플
웹 API 함수 및 동작 샘플(클라이언트 쪽 JavaScript)

Microsoft Dynamics 365

다음을 통해 공유

웹 API 샘플(클라이언트 쪽 JavaScript)

이 항목의 내용

클라이언트 쪽 JavaScript를 사용하는 웹 API 샘플

샘플 소스 코드를 다운로드하는 방법.

샘플을 포함하는 Dynamics 365 솔루션을 가져오는 방법.

실행 중인 스크립트를 보기 위해 샘플을 실행하는 방법

각 샘플의 일반 요소

참고 항목

추가 리소스