전자상거래 결제용 주소 확인

목표

이 문서에서는 Place Autocomplete과 Address를 결합하는 방법을 설명합니다. 유효성 검사 API1, 전자상거래 결제의 지도 높은 품질의 주소를 캡처하는 데 사용됩니다.

기본 요건

Google에서는 다음 항목을 숙지할 것을 권장합니다.

  • Place Autocomplete JavaScript 개발자 문서를 참고하세요.
    • 기술적 관점에서 Place Autocomplete이 어떻게 구현되는지 이해 구현 옵션에 대해 알아보겠습니다.
  • 결제 구현 장소에 대한 가이드 자동 완성.
    • 다음에 대한 Place Autocomplete 구현 권장사항의 예: 전자상거래 결제
  • Address Validation API 제품 문서, 유효성 검사 구축에 로직입니다.
    • 기술적인 관점에서 Address Validation API 주소 품질을 결정하는 신호를 검토합니다.
를 통해 개인정보처리방침을 정의할 수 있습니다. <ph type="x-smartling-placeholder">

주소 확인이란 무엇인가요?

Address Validation API는 주소를 수락하는 서비스입니다. 주소 구성 요소를 식별하고 검증합니다. 또한 주소를 검색하고 해당 주소에 가장 잘 알려진 위도/경도 좌표를 찾습니다. 미국과 푸에르토리코 내 주소의 경우 선택적으로 코딩 정확도 지원 시스템 (CASSTM)

결제 시 주소 확인이 필요한 이유는 무엇인가요?

주문 과정에서 정확한 주소 수집:
이는 성공적인 배송을 촉진하고 정시에 요금을 늘리는 데 중요한 단계입니다. 처리 비용을 절감하고 값비싼 주소 수정 비용을 절감할 수 있습니다.

고객이 주소를 빠르고 정확하게 입력하도록 안내:
Place Autocomplete은 주소 입력 속도를 높이고 입력 오류를 줄여주므로 결제 단계를 간소화하는 방법을 살펴보겠습니다 주소 확인으로 의견 제공 표준화 및 개선과 같은 수정을 할 수 있도록 맞춤법 오류를 수정하고, 주거용 또는 오디오 녹음을 제공하는 등 광고 표시기 (일부 지역에서만 사용 가능) 리전을 참조하세요.

구현 개요

이 섹션에서는 전자상거래에 권장되는 주소 입력 워크플로를 간략히 설명합니다. 결제. 프로세스는 다음 세 단계로 구성됩니다.

  1. Place Autocomplete를 사용하여 처음에 주소를 캡처합니다.
  2. Address Validation API를 사용하여 입력된 주소를 확인합니다.
  3. 배달을 위해 입력한 주소의 위치를 지도에 표시합니다. 고객에게 확신을 제공할 수 있습니다

다음으로 각 단계를 개별적으로 자세히 살펴보겠습니다.

1단계: 주소 입력 흐름 - Place Autocomplete 서비스 사용

장소 자동 완성 을 입력합니다.

Place Autocomplete은 고객이 주소 세부정보 JavaScript API를 사용하여 구현하는 경우 주소 입력 양식 입력란 아래에 드롭다운이 표시되어 결과를 보여줍니다. 자동 완성 서비스에서 입력됩니다. 사용자가 주소를 찾기에 충분한 정보를 입력했다면, 드롭다운 메뉴에서 선택합니다. 이 작업을 수행하면 양식 입력란에 주소가 자동으로 채워집니다. 데이터입니다.

Place Autocomplete을 사용하여 사용자에게 두 가지 양식 항목 스타일을 제공할 수 있습니다. 모든 주소 필드가 있는 디스플레이 또는 단일 입력이 있는 디스플레이 필드를 확인합니다. 이 단일 입력란은 사용자가 입력하는 동시에 검색을 시작하라는 메시지를 표시하며 주소 구성 요소를 개별적으로 입력하는 것이 아니라 자동 완성 후 주소가 채워지면 워크플로에서 양식 입력란을 데이터를 검토 및 수정(예: 아파트 동수 또는 호수입니다.

다음은 단일 입력란을 사용하여 이 흐름이 표시되는 방식의 예입니다.

이미지

2단계: Address Validation API를 사용하여 주소 검증하기

사용자가 주소를 입력한 후 Google에서는 주소 확인 API 결제 시 주소가 올바르고 완전한지 확인합니다. 호출 트리거 사용자가 '다음' 또는 '계속' 버튼을 클릭하면 Address Validation API가 주소 양식을 제출해야 합니다. 이 버튼을 누르면 결제 페이지로 연결되는 경우가 많습니다.

모든 거래에 Address Validation API를 호출하는 것이 좋습니다.

다음 흐름 다이어그램은 Google Cloud Platform의 결제 시 Address Validation API

이미지

이 문서에서는 주소 수락 시나리오에 관해 나중에 설명합니다.

3단계: 시각적 확인 제공

주소 입력 후 사용자에게 배송 완료를 시각적으로 확인할 수 있는 기능을 제공합니다. 위치를 찾을 수 있습니다. 이렇게 하면 고객에게 주소가 올바른지 확인하고 배송 또는 수령 횟수를 줄인 경우 있습니다

지도는 결제 과정에서 표시되거나 거래 중에 전송될 수 있습니다. 확인 이메일. 이 두 가지 사용 사례는 모두 살펴보겠습니다

Maps JavaScript API는 사용자 위치를 표시하기 위한 대화형 지도를 제공합니다. Maps Static API를 사용하면 웹페이지 내 또는 이메일의 후반부에 이미지를 삽입할 수 있습니다.

심층 분석 - 주소 수락 시나리오

Address Validation API 응답은 다음과 같은 세 가지 주요 시나리오로 분류할 수 있습니다.

  • 수정: 주소의 품질이 낮습니다. 추가 정보를 입력하라는 메시지가 표시됩니다.
  • 확인: 주소의 품질이 우수하지만 변경사항을 가져올 수 있습니다. 다음과 같은 메시지를 표시할 수 있습니다. 확인.
  • 수락: 주소의 품질이 우수합니다. 다음을 수행할 수 있습니다. 제공된 주소를 수락합니다.

이 개념은 유효성 검사 빌드 로직 다음 섹션에서 각 시나리오에 대해 논의할 것입니다. 이 섹션에서 확인할 수 있습니다

수정

이미지

이 섹션에서는 주소 입력을 수정하는 방법을 보여줍니다. 특정 광고 소재에 대해 Address Validation API가 반환하는 신호는 낮은 품질을 나타냅니다 자세한 내용은 문제 해결 주소 유효성 검사 로직 빌드 문서를 참조하세요.

Address Validation API의 응답이 잘못된 주소를 나타내는 경우 고객이 입력한 데이터를 확인할 수 있도록 주소 입력 양식으로 리디렉션합니다. 주소가 수정되면 서비스가 해당 주소로 다시 보내야 합니다. Validation API를 통해 수정사항이 유효한지 확인합니다.

또한 신호를 사용하여 특정 주소 입력란 오류를 강조표시할 수 있습니다. addressComponents 수준에서 반환됩니다. 이에 대한 예는 볼 수 있습니다.


확인

이미지

이 섹션에서는 주소를 확인하는 방법을 설명합니다. 특정 광고 소재에 대해 Address Validation API가 반환하는 신호는 주소가 유효해야 함을 주소 유효성 검사 로직 빌드 문서를 참조하세요.

시스템에서 사용자에게 주소를 확인하라는 메시지를 표시하려고 하는 경우가 많습니다. 예를 들어 고객이 도시 이름을 잘못 입력하면 Address(주소)를 통해 수정됩니다. Validation API입니다. 고객에게 문제가 해결되었는지 확인해야 합니다. 이는 API에 의한 변경사항은 원래 사용하던 것을 근본적으로 입력합니다.

전면 광고 모달을 사용하여 고객에게 정보를 표시하여 다음 3가지 옵션이 있습니다.

  1. API에서 반환된 주소와 결제 프로세스 확인 올바른 주소로 계속 전송합니다.
  2. 원래 입력한 주소를 선택하고 Address Validation API 결제 프로세스는 정상적으로 계속될 수 있으며 귀하의 프로세스인 경우 배송 전 다운스트림 검토를 위해 주문이 신고될 수 있습니다. 허용하는 것입니다
  3. 고객이 모달을 취소하거나 취소하고 결제 절차의 주소 입력 단계에서 처음부터 전체 과정을 처음부터 다시 시작합니다.

오른쪽의 스크린샷에서 예시를 확인할 수 있습니다.


수락

이 섹션에서는 주소를 수락하는 방법을 설명합니다. 특정 광고 소재에 대해 Address Validation API가 반환하는 신호를 보내 주소가 양호함을 나타냅니다. 수락되어야 하는 경우 주소 유효성 검사 로직 빌드 문서를 참조하세요.

이 시나리오에서는 결제 프로세스가 다음 단계(예: 고객에게 품질 관련 메시지를 표시하지 않고 결제 캡처 API에서 고객이 입력한 주소의 품질이 우수함을 확인했습니다. 결과물입니다

Address Validation API에서 반환된 주소 데이터를 사용하는 것이 좋습니다. 사소한 수정 및 추가 내용이 포함될 수 있으므로 다음과 같습니다.

  • 대문자 사용(영문)
  • 형식 수정(예: <ph type="x-smartling-placeholder">
      </ph>
    • 스트리트-가
    • 주소 구성요소의 올바른 순서
  • 미국의 경우 ZIP+4로 인증됩니다.
를 통해 개인정보처리방침을 정의할 수 있습니다.

구현 관련 고려사항

주소 수락 로직을 작성할 때 구현 시 잘못된 주소를 입력하여 결제하는 것을 차단할 수 있습니다. 구성 API가 무한 루프가 될 가능성을 방지하는 방식으로 항목이 잘못되었음을 나타냅니다.

Google에서는 고객이 두 번째 시도에서 해당 참가자의 참가 신청서를 수락합니다. 확인합니다 두 번째 시도의 목표는 있습니다.

두 번째 시도를 수락하기 위해 권장되는 두 가지 방법은 다음과 같습니다.

  • 강제 진행: 고객에게 주소가 유효하지 않다고 설명하는 모달을 보여줍니다. 확인할 수 있지만 입력된 주소로 계속 진행할 수 있도록 허용합니다.
  • Silent Acceptance(자동 수락): 두 번째 시도를 자동으로 수락합니다. 확인 단계를 거쳐야 합니다.

가능하면 검증되지 않는 주소에 플래그를 지정하도록 시스템을 설계하여 고객 서비스 담당자가 주문 상품이 발송되기 전에 이를 검토할 수 있습니다. 이 실수를 잡아낼 수 있습니다

신규 건물 건설은 이 검사가 좋습니다. 새 건물을 건설하는 시점 사이에 건물의 주소가 우편 주소에 입력되면 살펴보겠습니다 고객은 유효하지 않은 경우에도 입력한 주소로 결제 페이지가 표시됩니다.

결제 세션이 완료되면 선택적으로 provideValidationFeedback 드림 메서드를 사용하여 특정 주소 확인 시도에 관한 의견을 Google에 전송합니다.

결론

이 문서에서는 Google 지도에서 자동 완성, 주소 확인, 시각적 확인 기능을 제공합니다. 사용 구현 설계를 위한 출발점으로 이 문서를 주소 입력 흐름을 개선하는 데 도움이 됩니다.

다음 단계

신뢰할 수 있는 주소로 결제, 배송, 운영 개선 백서 주소로 결제, 배송, 운영 개선 확인 웹 세미나.

추가 추천 자료:

참여자

헨릭 밸브 | 솔루션 엔지니어
토마스 앵글레렛 | 솔루션 엔지니어
사탁 강굴리 | 솔루션 엔지니어


  1. 미국 우편 서비스의 비독점 라이선스 수혜자. CASSTM, USPS®, DPV®의 상표는 United States Postal Service®에서 소유하고 허가 하에 사용되었습니다.