21.4 Google Cloud 함수 만들기 및 구성

21.4.1 Google Cloud 기능 만들기

https://console.cloud.google.com/로 이동합니다. 클라우드 함수​로 이동합니다.

GCP

그러면 이게 보입니다. 프로젝트 만들기​를 클릭합니다.

GCP

프로젝트 이름​으로 Launch Server Side - GCP​를 사용하십시오.
위치​로 프로젝트를 저장할 위치를 선택합니다.

CREATE​을 클릭합니다.

GCP

그러면 프로젝트가 만들어집니다.

GCP

그런 다음 클라우드 함수를 만들 수 있습니다. 함수 만들기​를 클릭합니다.

GCP

그러면 이게 보입니다.

GCP

다음 옵션을 선택합니다.

  • 함수 이름:ldap-launch-ssf(ldap로 ldap 대체)
  • 지역:원하는 영역 선택
  • 트리거 유형:http 를 선택합니다.
  • 인증:인증되지 않은 호출 허용 선택

이제 이걸 가져가세요 저장​을 클릭합니다.

GCP

NEXT​를 클릭합니다.

GCP

그러면 다음 내용이 표시됩니다.

GCP

다음 옵션을 선택합니다.

  • 런타임:node. js 12 선택
  • 진입점:helloAEP 를 입력합니다.

GCP

ENABLE API 를 클릭하여 클라우드 빌드 API​를 활성화합니다. 그러면 새 창이 보입니다. 해당 새 창에서 활성화​를 다시 클릭합니다.

GCP

클라우드 빌드 API​가 활성화되면 이 메시지가 표시됩니다.

GCP

클라우드 함수​로 돌아갑니다.

GCP

클라우드 함수 인라인 편집기에서 다음 코드가 있는지 확인합니다.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
exports.helloAEP = (req, res) => {
  let message = req.query.message || req.body.message || 'Hello World!';
  res.status(200).send(message);
};

그런 다음 배포​를 클릭합니다.

그러면 이게 보입니다. 이제 클라우드 기능을 만들고 있습니다. 2분 정도 걸릴 수 있습니다.

GCP

함수가 생성되어 실행되면 이를 확인할 수 있습니다. 함수 이름을 클릭하여 엽니다.

GCP

그러면 이게 보입니다. TRIGGER​로 이동합니다. 그러면 Launch Server Side에서 끝점을 정의하는 데 사용할 트리거 URL​이 표시됩니다.

GCP

다음과 같은 트리거 URL을 복사합니다.https://us-central1-launch-server-side-gcp.cloudfunctions.net/vangeluw-launch-ssf

다음 단계에서는 페이지 보기​에 대한 특정 정보를 Google Cloud 함수에 스트리밍하도록 Adobe Experience Platform 데이터 수집 서버를 구성합니다. 전체 페이로드를 그대로 전달하는 대신 ECID, 타임스탬프페이지 이름​과 같은 것만 Google Cloud 함수에 보냅니다.

다음은 위에 언급된 변수를 필터링하기 위해 구문 분석해야 하는 페이로드의 예입니다.

{
  "events": [
    {
      "xdm": {
		  "eventType": "web.webpagedetails.pageViews",
		  "web": {
		    "webPageDetails": {
		      "URL": "https://public.aepdemo.net/index.html",
		      "name": "Luma Home"
		    },
		    "webReferrer": {
		      "URL": "https://public.aepdemo.net/admin.html"
		    }
		  },
		  "device": {
		    "screenHeight": 1080,
		    "screenWidth": 1920,
		    "screenOrientation": "landscape"
		  },
		  "environment": {
		    "type": "browser",
		    "browserDetails": {
		      "viewportWidth": 1920,
		      "viewportHeight": 507,
		      "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 11_1_0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.96 Safari/537.36",
		      "acceptLanguage": "en"
		    }
		  },
		  "placeContext": {
		    "localTime": "2021-01-29T15:45:26.815+01:00",
		    "localTimezoneOffset": -60
		  },
		  "timestamp": "2021-01-29T14:45:26.815Z",
		  "implementationDetails": {
		    "name": "https://ns.adobe.com/experience/alloy/reactor",
		    "version": "2.3.0+2.2.0",
		    "environment": "browser"
		  },
		  "_experienceplatform": {
		    "identification": {
		      "core": {
		        "ecid": "83249052138816938582105724584714316131"
		      }
		    },
		    "demoEnvironment": {
		      "tms": "Launch",
		      "ldap": "vangeluw",
		      "brandLogo": "https://parsefiles.back4app.com/hgJBdVOS2eff03JCn6qXXOxT5jJFzialLAHJixD9/d632e769791f0a4dbe0b84058d282d45_logo.png",
		      "brandName": "Luma",
		      "brandIndustry": "retail"
		    }
		  }
		}

다음은 구문 분석해야 하는 정보가 포함된 필드입니다.

  • ECID:events.xdm._experienceplatform.identification.core.ecid
  • timestamp:타임스탬프
  • 페이지 이름:events.xdm.web.webPageDetails.name

이제 Adobe Experience Platform 데이터 수집 서버로 이동하여 데이터 요소를 구성하면 됩니다.

21.4.2 Adobe Experience Platform 데이터 수집 서버 속성 업데이트:데이터 요소

https://experience.adobe.com/#/data-collection/로 이동합니다.

Adobe Experience Platform 데이터 수집 SSF

왼쪽 상단에서 클라이언트 측​을 클릭하고 드롭다운 메뉴에서 서버 측​을 클릭합니다. 사용 가능한 모든 Adobe Experience Platform 데이터 수집 서버 속성에 대한 개요를 볼 수 있습니다. 를 클릭하여 연습 21.1에서 만든 속성을 엽니다.

Adobe Experience Platform 데이터 수집 SSF

왼쪽 메뉴에서 데이터 요소​로 이동합니다. 데이터 요소 추가​를 클릭합니다.

Adobe Experience Platform 데이터 수집 SSF

그러면 구성할 새 데이터 요소가 표시됩니다.

Adobe Experience Platform 데이터 수집 SSF

다음을 선택합니다.

  • 이름​으로 customerECID​를 입력합니다.
  • 확장​으로 코어​를 선택합니다.
  • 데이터 요소 유형​으로 경로​를 선택합니다.
  • 경로​로 arc.event.xdm.--aepTenantId--.identification.core.ecid를 입력합니다. 이 경로를 입력하면 웹 사이트 또는 모바일 앱에서 Adobe Edge으로 보낸 이벤트 페이로드에서 ecid 필드를 필터링합니다.
노트

위 및 아래 경로에서 arc​에 대한 참조가 수행됩니다. ​arcmed는 Adobe 리소스 컨텍스트 ​를 의미하며, arcalway는 서버 측 컨텍스트에서 사용 가능한 가장 높은 개체를 의미합니다. 데이터 보강 및 변형을 Adobe Experience Platform 데이터 수집 서버 함수를 사용하여 arc 개체에 추가할 수 있습니다.

위의 및 아래 경로에서 event​에 대한 참조가 수행됩니다. ​이벤트는 고유 이벤트를 나타내고 Adobe Experience Platform 데이터 수집 서버는 항상 모든 이벤트를 개별적으로 평가합니다. 경우에 따라 웹 SDK 클라이언트측에서 보낸 페이로드에서 events​에 대한 참조가 표시될 수 있지만 Adobe Experience Platform 데이터 수집 서버에서 모든 이벤트가 개별적으로 평가됩니다.

이제 이걸로 하시겠어요 저장​을 클릭합니다.

Adobe Experience Platform 데이터 수집 SSF

데이터 요소 추가​를 클릭합니다.

Adobe Experience Platform 데이터 수집 SSF

그러면 구성할 새 데이터 요소가 표시됩니다.

Adobe Experience Platform 데이터 수집 SSF

다음을 선택합니다.

  • 이름​으로 eventTimestamp​를 입력합니다.
  • 확장​으로 코어​를 선택합니다.
  • 데이터 요소 유형​으로 경로​를 선택합니다.
  • 경로​로 arc.event.xdm.timestamp​를 입력합니다. 이 경로를 입력하면 웹 사이트 또는 모바일 앱에서 Adobe Edge으로 보낸 이벤트 페이로드의 필드 타임스탬프​을 필터링합니다.

이제 이걸로 하시겠어요 저장​을 클릭합니다.

Adobe Experience Platform 데이터 수집 SSF

데이터 요소 추가​를 클릭합니다.

Adobe Experience Platform 데이터 수집 SSF

그러면 구성할 새 데이터 요소가 표시됩니다.

Adobe Experience Platform 데이터 수집 SSF

다음을 선택합니다.

  • 이름​으로 pageName​을 입력합니다.
  • 확장​으로 코어​를 선택합니다.
  • 데이터 요소 유형​으로 경로​를 선택합니다.
  • 경로​로 arc.event.xdm.web.pageDetails.name​을 입력합니다. 이 경로를 입력하면 웹 사이트 또는 모바일 앱에서 Adobe Edge으로 보낸 이벤트 페이로드에서 name 필드를 필터링합니다.

이제 이걸로 하시겠어요 저장​을 클릭합니다.

Adobe Experience Platform 데이터 수집 SSF

이제 다음 데이터 요소를 만들었습니다.

Adobe Experience Platform 데이터 수집 SSF

21.4.3 Adobe Experience Platform 데이터 수집 서버 속성 업데이트:규칙 업데이트

왼쪽 메뉴에서 규칙​으로 이동합니다. 이전 연습에서는 모든 페이지 규칙을 만들었습니다. 해당 규칙을 클릭하여 엽니다.

Adobe Experience Platform 데이터 수집 SSF

그럼 이게 될 거야 작업 아래의 + 아이콘을 클릭하여 새 작업을 추가합니다.

Adobe Experience Platform 데이터 수집 SSF

그러면 이게 보입니다.

Adobe Experience Platform 데이터 수집 SSF

다음을 선택합니다.

  • 확장​을 선택합니다.Adobe 클라우드 커넥터.
  • 작업 유형​을 선택합니다.가져오기 호출​을 만듭니다.

이름​을 제공해야 합니다.Adobe 클라우드 커넥터 - 가져오기 호출 만들기. 이제 다음을 볼 수 있습니다.

Adobe Experience Platform 데이터 수집 SSF

다음으로, 다음을 구성합니다.

  • 요청 프로토콜을 GET에서 POST​로 변경합니다.
  • 다음과 같은 이전 단계 중 하나에서 만든 Google Cloud 함수의 URL을 입력합니다.https://us-central1-launch-server-side-gcp.cloudfunctions.net/vangeluw-launch-ssf

이제 이걸 가져가세요 다음으로 Body​로 이동합니다.

Adobe Experience Platform 데이터 수집 SSF

그러면 이게 보입니다. JSON​에 대한 라디오 단추를 클릭합니다.

Adobe Experience Platform 데이터 수집 SSF

Body​를 다음과 같이 구성하십시오.

customerECID {{customerECID}}
pageName {{pageName}}
eventTimestamp {{eventTimestamp}}

그러면 이게 보입니다. 변경사항 유지​를 클릭합니다.

Adobe Experience Platform 데이터 수집 SSF

그러면 이게 보입니다. 저장​을 클릭합니다.

Adobe Experience Platform 데이터 수집 SSF

이제 Adobe Experience Platform 데이터 수집 서버 속성에서 기존 규칙을 업데이트합니다. 게시 흐름​으로 이동하여 변경 사항을 게시합니다. 표시된 대로 편집​을 클릭하여 개발 라이브러리 v1​을 엽니다.

Adobe Experience Platform 데이터 수집 SSF

변경된 모든 리소스 추가 단추를 클릭하면 규칙 및 데이터 요소가 이 라이브러리에 표시됩니다. 그런 다음 개발을 위한 저장 및 구축​을 클릭합니다. 이제 변경 사항을 배포하고 있습니다.

Adobe Experience Platform 데이터 수집 SSF

몇 분 후에 배포가 완료되고 테스트를 받을 준비가 되었음을 알 수 있습니다.

Adobe Experience Platform 데이터 수집 SSF

21.3.4 구성 테스트

새로운 시크릿 브라우저 창을 열고 https://public.aepdemo.net로 이동합니다.

그러면 이게 보입니다.

Adobe Experience Platform 데이터 수집 설정

구성 ID를 입력하고 구성 로드​를 클릭합니다. 그런 다음 구성이 로드됩니다.

Adobe Experience Platform 데이터 수집 설정

아래로 스크롤하여 구성 저장​을 클릭합니다.

Adobe Experience Platform 데이터 수집 설정

그러면 Admin Homepage 로 리디렉션됩니다. LDAP​로 이동합니다. LDAP를 선택하고 저장​을 클릭합니다.

Adobe Experience Platform 데이터 수집 설정

그러면 Admin Homepage 로 리디렉션됩니다. Brand​로 이동하여 Luma 브랜드를 선택하고 Save​를 클릭합니다.

Adobe Experience Platform 데이터 수집 설정

그러면 Admin Homepage 로 리디렉션됩니다. Luma 로고를 클릭합니다.

Adobe Experience Platform 데이터 수집 설정

그러면 Luma 홈 페이지가 표시됩니다.

Adobe Experience Platform 데이터 수집 설정

브라우저 개발자 보기를 열면 아래에 표시된 대로 네트워크 요청을 검사할 수 있습니다. 필터 interact​를 사용하는 경우, Adobe Experience Platform 데이터 수집 클라이언트가 Adobe Edge에 보내는 네트워크 요청이 표시됩니다.

Adobe Experience Platform 데이터 수집 설정

보기를 Google Cloud 함수로 전환하고 LOGS​로 이동합니다. 이제 이 뷰와 유사한 보기가 있고 많은 로그 항목이 표시됩니다. 함수 실행이 시작​될 때마다 Google Cloud 함수에서 수신 트래픽이 수신되었음을 의미합니다.

Adobe Experience Platform 데이터 수집 설정

수신 데이터로 작업할 수 있도록 함수를 약간 업데이트하여 Adobe Experience Platform 데이터 수집 서버에서 수신한 정보를 표시하겠습니다. SOURCE 로 이동하고 EDIT​을 클릭합니다.

Adobe Experience Platform 데이터 수집 설정

다음 화면에서 NEXT​를 클릭합니다.

Adobe Experience Platform 데이터 수집 설정

다음과 같이 코드를 업데이트합니다.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
exports.helloAEP = (req, res) => {
  console.log('>>>>> Function has started. The following information was received from Launch Server Side:');
  console.log(req.body);

  let message = req.query.message || req.body.message || 'Hello World!';
  res.status(200).send(message);
};

그럼 이걸로 주세요 배포​를 클릭합니다.

Adobe Experience Platform 데이터 수집 설정

2분 후에 함수가 다시 배포됩니다. 함수 이름을 클릭하여 엽니다.

Adobe Experience Platform 데이터 수집 설정

데모 웹 사이트에서 Nadia Elements Shell 과 같은 제품으로 이동합니다.

Adobe Experience Platform 데이터 수집 설정

보기를 Google Cloud 함수로 전환하고 LOGS​로 이동합니다. 이제 이 뷰와 유사한 보기가 있고 많은 로그 항목이 표시됩니다.

이제 데모 웹 사이트의 모든 페이지 보기에 대해 수신된 정보를 표시하는 Google Cloud 함수의 로그에 새 로그 항목이 표시됩니다.

Adobe Experience Platform 데이터 수집 설정

이제 Adobe Experience Platform 데이터 수집에서 수집한 데이터를 실시간으로 Google Cloud 함수 종단점으로 전송했습니다. 여기에서 이 데이터는 저장 및 보고를 위한 BigQuery와 같은 모든 Google Cloud Platform 애플리케이션이나 기계 학습 사용 사례에 사용할 수 있습니다.

다음 단계:21.5 Microsoft Azure 함수 만들기 및 구성

모듈 21로 돌아가기

모든 모듈로 돌아가기

이 페이지에서는