미리 구성된 서비스 에이전트를 통합하세요 ServiceNow

아티클
12/09/2024

기본 플랫폼의 상황 인식을 통해 미리 구성된 서비스 에이전트를 바탕 화면에 직접 내장할 수 있습니다. ServiceNow 이러한 통합은 애플리케이션이 더 나은 대응을 제공하는 데 도움이 되며, 상담원의 워크플로를 더욱 간소화하는 데 도움이 됩니다.

사전 요구 사항

시작하기 전에 다음과 같은 환경과 콘솔이 있어야 합니다.

ServiceNow 환경에 연결된 서비스용 Copilot 인스턴스.
ServiceNow 프로덕션 환경 또는 평가판 환경.

또한, 고객 서비스 담당자가 ServiceNow에서 에이전트를 사용할 수 있도록 하려면 해당 담당자에게 에이전트 역할을 할당해야 합니다. 이 역할을 에이전트에게 할당하는 방법에 대한 자세한 내용은 사용자에게 보안 역할 할당을 참조하세요.

서비스용 Copilot 인스턴스에 로그인하세요.
사이트맵에서 채널을 선택한 다음 ServiceNow를 선택합니다.
<iframe src= 다음에 시작하는 URL을 복사하세요. https://copilotforservice-test.azureedge.net/widget/index.html?dynamicsUrl=https://XXXXXX.crm10.dynamics.com을 예로 들 수 있습니다.
URL을 로컬에 저장하면 이후 단계에서 복사하여 붙여넣을 수 있습니다.

2단계: Knowledge API 플러그인 설치

ServiceNow 환경에서 모두를 선택하고 플러그인을 검색한 후 시스템 정의>플러그인을 선택합니다.
Knowledge API를 검색하세요. 시스템은 Knowledge API 플러그인(앱 ID: sn_km_api)을 반환해야 합니다.
Knowledge API 카드를 선택합니다.
설치를 선택한 후 최신 버전을 선택하세요.
지금 설치를 선택한 다음 Knowledge API 설치가 완료될 때까지 기다립니다.

3단계: Openframe API 플러그인 설치

ServiceNow 환경에서 모두를 선택하고 플러그인을 검색한 후 시스템 정의>플러그인을 선택합니다.
Openframe을 검색합니다. 시스템은 Openframe 플러그인(플러그인 ID: com.sn_openframe)을 반환해야 합니다.
설치를 선택하여 플러그인 설치를 시작합니다.
설치를 선택한 다음 설치가 완료될 때까지 기다립니다.

4단계: Customer Service 플러그인 설치

ServiceNow 환경에서 모두를 선택하고 플러그인을 검색한 후 시스템 정의>플러그인을 선택합니다.
com.sn_customerservice를 선택합니다. 시스템은 Customer Service 플러그인(플러그인 ID: com.sn_customerservice)을 반환해야 합니다.
설치를 선택하여 플러그인 설치를 시작합니다.
설치를 선택한 다음 설치가 완료될 때까지 기다립니다.

5단계: 작업 영역 탐색기용 UI 스크립트 추가

ServiceNow 환경에서 현재 전역 작업 영역에 있는지 확인합니다. 오른쪽 상단 모서리에 있는 지구본 아이콘을 선택한 다음애플리케이션 범위가 전역으로 설정되어 있는지 확인합니다.
모두를 선택한 후 UI 스크립트를 검색한 후 시스템 UI>UI 스크립트를 선택합니다.
새로 만들기를 선택하고 다음과 같이 양식을 작성합니다.
- API 이름: Copilot open 프레임 작업 공간 스크립트
- UI 유형: 모바일/서비스 포털
- 스크립트: 다음 스크립트의 내용을 복사하세요:

 (function () {
  try {
    var logMoniker = "Copilot Navigator UI script: ";

    if (!globalThis.copilotNavigationWorkspaceListenerAdded) {
      console.log(logMoniker + "loading workspace navigator....");
      var payload = {
        url: globalThis.window.location.href,
        source: "workspaceUIScript",
        sourceId: "b54abfa8-3d78-4aa0-ae3f-1e2ffbc56850",
        configType: "singleFrame"
      };
      var context = {
        payload: JSON.stringify(payload),
        method: "openframe_communication"
      };
      globalThis.CustomEvent.fireAll("openframe_request", context);

      globalThis.window.navigation.addEventListener("navigate", (event) => {
        console.log(
          logMoniker +
            "Workspace PAGE NAVIGATED: " +
            "\n Old Url: " +
            globalThis.window.location.href +
            "\n New url: " +
            event.destination.url
        );

        var payload = {
          url: event.destination.url,
          source: "workspaceUIScript",
          sourceId: "b54abfa8-3d78-4aa0-ae3f-1e2ffbc56850",
          configType: "singleFrame"
        };
        var context = {
          payload: JSON.stringify(payload),
          method: "openframe_communication"
        };
        globalThis.CustomEvent.fireAll("openframe_request", context);
      });

      globalThis.copilotNavigationWorkspaceListenerAdded = true;
    } else {
      console.log(logMoniker + "Workspace navigator already loaded....");
    }
  } catch (error) {
    console.error(logMoniker + "Workspace Navigator error");
    console.error(error);
  }

  function initialiseScript() {
    // do nothing
  }

  return initialiseScript;
})();

6단계: 클래식 UI 탐색기용 UI 스크립트 추가

ServiceNow 환경에서 현재 전역 작업 영역에 있는지 확인합니다. 오른쪽 상단 모서리에 있는 지구본 아이콘을 선택한 다음애플리케이션 범위가 전역으로 설정되어 있는지 확인합니다.
모두를 선택한 후 UI 스크립트를 검색한 후 시스템 UI>UI 스크립트를 선택합니다.
새로 만들기를 선택하고 다음과 같이 양식을 작성합니다.
- API 이름: Copilot open 프레임 바탕 화면 스크립트
- UI 유형: 바탕 화면
- 전역 확인란을 선택합니다.
- 스크립트: 다음 스크립트의 내용을 복사하세요:

 (function () {
  try {
    var logMoniker = "Copilot Navigator UI script: ";
    if (
      !window.parent.navigationListenerAdded &&
      !window.copilotNavigationClassicListenerAdded
    ) {
      console.log(logMoniker + "loading desktop navigator....");
      var payload = {
        url: window.location.href,
        source: "classicUIScript",
        sourceId: "b54abfa8-3d78-4aa0-ae3f-1e2ffbc56850",
        configType: "singleFrame"
      };
      var context = {
        payload: JSON.stringify(payload),
        method: "openframe_communication"
      };
      CustomEvent.fireAll("openframe_request", context);

      window.navigation.addEventListener("navigate", (event) => {
        console.log(
          logMoniker +
            "desktop PAGE NAVIGATED: " +
            "\n Old Url: " +
            window.location.href +
            "\n New url: " +
            event.destination.url
        );

        var payload = {
          url: event.destination.url,
          source: "classicUIScript",
          sourceId: "b54abfa8-3d78-4aa0-ae3f-1e2ffbc56850",
          configType: "singleFrame"
        };
        var context = {
          payload: JSON.stringify(payload),
          method: "openframe_communication"
        };
        CustomEvent.fireAll("openframe_request", context);
      });

      window.copilotNavigationClassicListenerAdded = true;
    } else {
      console.log(logMoniker + "Skipping desktop navigator load....");
    }
  } catch (error) {
    console.log(logMoniker + "Classic UI navigator error");
    console.log(error);
  }
})();

7단계: 테이블 연결을 위한 클라이언트 스크립트 추가

ServiceNow 환경에서 현재 전역 작업 영역에 있는지 확인합니다. 오른쪽 상단 모서리에 있는 지구본 아이콘을 선택한 다음애플리케이션 범위가 전역으로 설정되어 있는지 확인합니다.
모두를 선택한 후 클라이언트 스크립트를 검색한 후 시스템 정의>클라이언트 스크립트를 선택합니다.
새로 만들기를 선택하고 다음과 같이 양식을 작성합니다.
- 이름: Copilot open 프레임 인시던트 테이블 스크립트
- 표 사건[사건]
- UI 유형: 바탕 화면
- onLoad를 입력하세요
- 스크립트: 다음 스크립트의 내용을 복사하세요:

 function onLoad() {
  try {
    var tableName = g_form.getTableName();
    var id = g_form.getUniqueValue();
    var payload = {
      recordId: id,
      objectType: tableName,
      source: "classicClientScript",
      sourceId: "b54abfa8-3d78-4aa0-ae3f-1e2ffbc56850",
      configType: "singleFrame"
    };
    var context = {
      payload: JSON.stringify(payload),
      method: "openframe_communication"
    };
    CustomEvent.fireAll("openframe_request", context);
  } catch (error) {
    console.log(
      "Copilot Navigator UI script: CopilotClassicClientScriptCase navigator error"
    );
    console.log(error);
  }
}

새로 만들기를 다시 선택하고 다음과 같이 양식을 작성합니다.
- 이름: Copilot open 프레임 이메일 테이블 스크립트
- 표: 이메일 [sys_email]
- UI 유형: 바탕 화면
- onLoad를 입력하세요
- 스크립트: 다음 스크립트의 내용을 복사하세요.

  function onLoad() {
  try {
    var tableName = g_form.getTableName();
    var id = g_form.getUniqueValue();
    var payload = {
      recordId: id,
      objectType: tableName,
      source: "classicClientScript",
      sourceId: "b54abfa8-3d78-4aa0-ae3f-1e2ffbc56850",
      configType: "singleFrame"
    };
    var context = {
      payload: JSON.stringify(payload),
      method: "openframe_communication"
    };
    CustomEvent.fireAll("openframe_request", context);
  } catch (error) {
    console.log(
      "Copilot Navigator UI script: CopilotClassicClientScriptCase navigator error"
    );
    console.log(error);
  }
}

새로 만들기를 다시 선택하고 다음과 같이 양식을 작성합니다.
- 이름: Copilot open 프레임 케이스 테이블 스크립트
- 표: 사례 [sn_customerservice_case]
- UI 유형: 바탕 화면
- onLoad를 입력하세요
- 스크립트: 다음 스크립트의 내용을 복사하세요.

  function onLoad() {
  try {
    var tableName = g_form.getTableName();
    var id = g_form.getUniqueValue();
    var payload = {
      recordId: id,
      objectType: tableName,
      source: "classicClientScript",
      sourceId: "b54abfa8-3d78-4aa0-ae3f-1e2ffbc56850",
      configType: "singleFrame"
    };
    var context = {
      payload: JSON.stringify(payload),
      method: "openframe_communication"
    };
    CustomEvent.fireAll("openframe_request", context);
  } catch (error) {
    console.log(
      "Copilot Navigator UI script: CopilotClassicClientScriptCase navigator error"
    );
    console.log(error);
  }
}

새로 만들기를 다시 선택하고 다음과 같이 양식을 작성합니다.
- 이름: Copilot open 프레임 이메일 테이블 스크립트
- 표: 이메일 [sys_email]
- UI 유형: 바탕 화면
- onLoad를 입력하세요
- 스크립트: 다음 스크립트의 내용을 복사하세요:

 function onLoad() {
  try {
    var tableName = g_form.getTableName();
    var id = g_form.getUniqueValue();
    var payload = {
      recordId: id,
      objectType: tableName,
      source: "classicClientScript",
      sourceId: "b54abfa8-3d78-4aa0-ae3f-1e2ffbc56850",
      configType: "singleFrame"
    };
    var context = {
      payload: JSON.stringify(payload),
      method: "openframe_communication"
    };
    CustomEvent.fireAll("openframe_request", context);
  } catch (error) {
    console.log(
      "Copilot Navigator UI script: CopilotClassicClientScriptCase navigator error"
    );
    console.log(error);
  }
}

ServiceNow 환경에서 모두를 선택하고 OpenFrame을 검색한 후 OpenFrame>구성을 선택합니다.
우측 상단 코너의 새로 만들기를 선택합니다.
이름 및 제목으로 Microsoft Copilot을 입력합니다.
너비에 450을 입력하고 높이에 600을 입력합니다.
서비스용 Copilot을 활성화하려는 사용자 그룹을 선택합니다.
URL 필드 옆에 있는 자물쇠 아이콘을 선택하여 잠금을 해제한 다음 이전에 서비스용 Copilot 관리 페이지에서 저장한 서비스용 Copilot 위젯 URL을 붙여넣습니다.
제출을 선택합니다.
페이지를 새로 고칩니다. 서비스용 Copilot 위젯은 선택한 아이콘의 상단 탐색 모음에서 사용할 수 있습니다.
서비스용 Copilot을 열기 전에 ServiceNow 페이지에서 팝업을 허용했는지 확인합니다.

다음을 통해 공유