คู่มือการติดตั้งใช้งานการลงชื่อสมัครใช้ที่ได้รับการยืนยันฉบับย่อ

ภาพรวม

เว็บ iOS API

Google Maps Platform มีให้บริการบนเว็บ (JS, TS), Android และ iOS และยังมี API ของบริการเว็บสำหรับการรับข้อมูลเกี่ยวกับสถานที่ เส้นทาง และระยะทางอีกด้วย ตัวอย่างในคู่มือนี้เขียนขึ้นสำหรับแพลตฟอร์มหนึ่ง แต่จะมีลิงก์เอกสารประกอบสำหรับการใช้งานบนแพลตฟอร์มอื่นๆ

สร้างเลย!

เครื่องมือสร้างด่วนใน Google Cloud Console ช่วยให้คุณสร้างการเติมข้อความอัตโนมัติในแบบฟอร์มที่อยู่โดยใช้ UI แบบอินเทอร์แอกทีฟที่สร้างโค้ด JavaScript ให้คุณได้

ผู้ใช้เริ่มคุ้นเคยกับการใช้ชีวิตและการดำเนินงานในโลกดิจิทัลที่ความสะดวก ความเร็ว และความปลอดภัยเป็นความคาดหวังพื้นฐาน เมื่อสมัครขอบางสิ่ง เช่น บัตรเครดิต บัญชีธนาคาร หรือสินเชื่อ พวกเขาคาดหวังว่ากระบวนการนี้จะรวดเร็วและง่ายดาย

ยิ่งผู้ใช้ต้องพิมพ์หรือป้อนข้อมูลที่ซ้ำกันมากเท่าไหร่ คุณก็ยิ่งรักษาผู้ใช้ไว้ในฐานะลูกค้าไว้ได้น้อยลงเท่านั้น การสร้างประสบการณ์การลงชื่อสมัครใช้ที่ง่ายและรวดเร็ว และได้รับการรับรองจะช่วยปรับปรุงประสบการณ์ของผู้ใช้ในขณะที่มอบโอกาสอันดีในการคงผู้ใช้ไว้ในไซต์ต่อไป

ที่อยู่ที่ป้อนด้วยตนเองอาจทำให้เกิด Conversion ที่ลดลง, ข้อมูล CRM ที่ผิดพลาด และข้อผิดพลาดในการนำส่งซึ่งมีค่าใช้จ่ายสูง การลงชื่อสมัครใช้แบบรวดเร็วและผ่านการยืนยันทำให้ลงชื่อสมัครใช้ได้เร็วขึ้น โดยแนะนำที่อยู่ในบริเวณใกล้เคียงได้ทันทีเพียงแตะเพียงไม่กี่ครั้ง และแสดงที่อยู่ที่ป้อนไว้เพื่อใช้ในการยืนยันด้วยภาพ ช่วยให้ผู้ใช้มั่นใจว่าได้ป้อนที่อยู่ที่ถูกต้องแล้ว การยืนยันที่อยู่ของผู้ใช้โดยใช้ตำแหน่งปัจจุบันยังช่วยป้องกันการประพฤติมิชอบ และเสริมสร้างความมั่นใจให้กับผู้ใช้ในผลิตภัณฑ์และบริการของคุณ การยืนยันยังเพิ่มความมั่นใจให้คุณในการให้บริการ ธนาคารเสมือนและบัตรเครดิตได้ทันที

หัวข้อนี้ให้คำแนะนำในการติดตั้งใช้งานสำหรับการสร้างฟีเจอร์การลงชื่อสมัครใช้แบบด่วนและยืนยันแล้วด้วย Google Maps Platform เนื่องจากผู้ใช้มีแนวโน้มที่จะลงชื่อสมัครใช้ในอุปกรณ์เคลื่อนที่ ตัวอย่างการใช้งานส่วนใหญ่ในหัวข้อนี้จึงจะมุ่งเน้นที่ Android (ดูแหล่งที่มาตัวอย่างแบบเต็มได้ที่นี่) คุณยังสามารถใช้ iOS SDK เพื่อทำงานเดียวกันนี้ได้ด้วย

แผนภาพต่อไปนี้แสดง API หลักที่เกี่ยวข้องในการสร้างโซลูชัน (คลิกเพื่อขยาย)

กำลังเปิดใช้ API

หากต้องการใช้คำแนะนำเหล่านี้ คุณต้องเปิดใช้ API ต่อไปนี้ใน Google Cloud Console

สำหรับข้อมูลเพิ่มเติมเกี่ยวกับการตั้งค่า โปรดดูการเริ่มต้นใช้งาน Google Maps Platform

ส่วนแนวทางปฏิบัติแนะนำ

ต่อไปนี้เป็นแนวทางปฏิบัติและการปรับแต่งที่เราจะกล่าวถึงในหัวข้อนี้

  • แนวทางปฏิบัติแนะนำหลักคือไอคอนเครื่องหมายถูก
  • ไอคอนดาวเป็นการปรับแต่งที่ไม่บังคับแต่แนะนำให้ปรับแต่งเพื่อเพิ่มประสิทธิภาพโซลูชัน
การเพิ่มการเติมข้อความอัตโนมัติในช่องป้อนข้อมูล ป้อนข้อมูลแบบฟอร์มที่อยู่โดยอัตโนมัติ เพิ่มฟังก์ชัน "พิมพ์ขณะใช้งาน" เพื่อปรับปรุงประสบการณ์ของผู้ใช้ในทุกแพลตฟอร์มและปรับปรุงความถูกต้องของที่อยู่ด้วยการกดแป้นพิมพ์ขั้นต่ำ
ให้ภาพยืนยันของที่อยู่ ให้ผู้ใช้เห็นที่อยู่ของตนในแผนที่โดยเป็นภาพประกอบยืนยันว่าได้ป้อนที่อยู่ที่ถูกต้องแล้ว
การเปรียบเทียบที่อยู่ที่ผู้ใช้ป้อนกับตำแหน่งของอุปกรณ์ เปรียบเทียบที่อยู่ที่เลือกหรือกรอกของผู้ใช้กับตำแหน่งปัจจุบันของอุปกรณ์เพื่อช่วยระบุว่าผู้ใช้อยู่ ณ ที่อยู่ที่ระบุไว้ (ผู้ใช้ควรอยู่ที่บ้านเมื่อลงชื่อสมัครใช้จึงจะใช้งานได้)
เคล็ดลับในการเพิ่มประสิทธิภาพฟีเจอร์ลงชื่อสมัครใช้แบบด่วนและยืนยันแล้วให้ดียิ่งขึ้น คุณจะปรับปรุงรายการที่อยู่ให้ดียิ่งขึ้นได้ด้วยส่วนเพิ่มเติม เช่น การปรับแต่งรูปลักษณ์ของวิดเจ็ตการเติมข้อความอัตโนมัติ หรือให้ผู้ใช้เลือกชื่อธุรกิจหรือจุดสังเกตเป็นที่อยู่

การเพิ่มการเติมข้อความอัตโนมัติในช่องป้อนข้อมูล

ตัวอย่างนี้ใช้ Places SDK สำหรับ Android วิธีที่พร้อมใช้งาน: iOS | JavaScript

ฟีเจอร์เติมข้อความอัตโนมัติช่วยให้การป้อนที่อยู่ในแอปพลิเคชันของคุณง่ายขึ้น ซึ่งนำไปสู่อัตรา Conversion ที่สูงขึ้น และประสบการณ์ใช้งานที่ราบรื่นสำหรับลูกค้าของคุณ การเติมข้อความอัตโนมัติมีช่องป้อนข้อความด่วนช่องเดียวพร้อมการคาดคะเนที่อยู่แบบ "พิมพ์ล่วงหน้า" ซึ่งใช้เพื่อสร้างแบบฟอร์มที่อยู่การลงชื่อสมัครใช้โดยอัตโนมัติได้ เมื่อคุณรวมการเติมข้อมูลสถานที่อัตโนมัติไว้ในขั้นตอนการลงชื่อสมัครใช้ของคุณ คุณจะสามารถทำสิ่งต่อไปนี้ได้

  • ลดข้อผิดพลาดในการป้อนที่อยู่
  • ลดจำนวนขั้นตอนในการลงชื่อสมัครใช้
  • ลดความซับซ้อนในการป้อนข้อมูลอีเมลบนอุปกรณ์เคลื่อนที่หรืออุปกรณ์ที่สวมใส่ได้
  • ลดการกดแป้นพิมพ์และเวลาทั้งหมดที่จำเป็นสำหรับการลงชื่อสมัครใช้ของลูกค้าลงได้อย่างมาก

เมื่อผู้ใช้เลือกช่องเติมข้อความอัตโนมัติและเริ่มพิมพ์ รายการการคาดคะเนที่อยู่จะปรากฏขึ้น

เมื่อผู้ใช้เลือกที่อยู่จากรายการการคาดการณ์ คุณจะใช้การตอบกลับเพื่อยืนยันที่อยู่และรับตำแหน่งได้ จากนั้นใบสมัครของคุณจะสามารถป้อนข้อมูลในฟิลด์ที่ถูกต้องของแบบฟอร์มป้อนที่อยู่ ดังที่แสดงในรูปต่อไปนี้

วิดีโอ: ปรับปรุงแบบฟอร์มที่อยู่ด้วยการเติมข้อความอัตโนมัติในสถานที่

แบบฟอร์มที่อยู่

Android

iOS

เว็บไซต์

Google Maps Platform มีวิดเจ็ตการเติมข้อความอัตโนมัติในสถานที่สำหรับแพลตฟอร์มอุปกรณ์เคลื่อนที่และเว็บ วิดเจ็ตที่แสดงในรูปก่อนหน้าจะมีกล่องโต้ตอบการค้นหาพร้อมฟังก์ชันเติมข้อความอัตโนมัติในตัว ซึ่งคุณสามารถเพิ่มประสิทธิภาพสำหรับการค้นหาที่กําหนดขอบเขตระดับสถานที่ตั้งได้ด้วย

ส่วนนี้จะอธิบายวิธีใช้การเติมข้อความอัตโนมัติในสถานที่สำหรับการลงชื่อสมัครใช้แบบด่วนและยืนยันแล้ว

การเพิ่มวิดเจ็ตเติมข้อความอัตโนมัติของสถานที่

ใน Android คุณสามารถเพิ่มวิดเจ็ตการเติมข้อความอัตโนมัติโดยใช้เติมข้อความอัตโนมัติตามความตั้งใจ ซึ่งเปิดการเติมข้อความอัตโนมัติจากสถานที่ในช่องป้อนข้อมูลที่อยู่บรรทัดที่ 1 ซึ่งผู้ใช้จะเริ่มต้นป้อนที่อยู่ เมื่อเริ่มพิมพ์ นักเรียนจะสามารถเลือกที่อยู่ได้จากรายการการคาดคะเนจากการเติมข้อความอัตโนมัติ

ก่อนอื่น ให้เตรียมตัวเปิดกิจกรรมโดยใช้ ActivityResultLauncher ซึ่งจะฟังผลลัพธ์จากกิจกรรมที่เปิดขึ้นมา การเรียกกลับด้วยผลลัพธ์จะมีออบเจ็กต์ Place ที่ตรงกับที่อยู่ที่ผู้ใช้เลือกจากการคาดคะเนจากการเติมข้อความอัตโนมัติ

    private final ActivityResultLauncher<Intent> startAutocomplete = registerForActivityResult(
            new ActivityResultContracts.StartActivityForResult(),
            result -> {
                if (result.getResultCode() == Activity.RESULT_OK) {
                    Intent intent = result.getData();
                    if (intent != null) {
                        Place place = Autocomplete.getPlaceFromIntent(intent);

                        // Write a method to read the address components from the Place
                        // and populate the form with the address components
                        Log.d(TAG, "Place: " + place.getAddressComponents());
                        fillInAddress(place);
                    }
                } else if (result.getResultCode() == Activity.RESULT_CANCELED) {
                    // The user canceled the operation.
                    Log.i(TAG, "User canceled autocomplete");
                }
            });

จากนั้นกำหนดพร็อพเพอร์ตี้ของช่อง ตำแหน่ง และประเภท ของ Intent การเติมข้อความอัตโนมัติในการวางตำแหน่ง แล้วสร้างด้วย Autocomplete.IntentBuilder สุดท้าย ให้เปิด Intent โดยใช้ ActivityResultLauncher ที่กำหนดไว้ในตัวอย่างโค้ดก่อนหน้า

    private void startAutocompleteIntent() {

        // Set the fields to specify which types of place data to
        // return after the user has made a selection.
        List<Place.Field> fields = Arrays.asList(Place.Field.ADDRESS_COMPONENTS,
                Place.Field.LAT_LNG, Place.Field.VIEWPORT);

        // Build the autocomplete intent with field, country, and type filters applied
        Intent intent = new Autocomplete.IntentBuilder(AutocompleteActivityMode.OVERLAY, fields)
                .setCountries(Arrays.asList("US"))
                .setTypesFilter(new ArrayList<String>() {{
                    add(TypeFilter.ADDRESS.toString().toLowerCase());
                }})
                .build(this);
        startAutocomplete.launch(intent);
    }

การจัดการที่อยู่ที่ส่งกลับโดยการเติมข้อความอัตโนมัติในสถานที่

การกำหนด ActivityResultLauncher ก่อนหน้านี้ยังกำหนดการดำเนินการที่ควรทำเมื่อมีการแสดงผลของกิจกรรมใน Callback ด้วย หากผู้ใช้เลือกการคาดการณ์ ระบบจะส่งการคาดการณ์ใน Intent ที่มีอยู่ในออบเจ็กต์ผลลัพธ์ เนื่องจาก Intent สร้างขึ้นโดย Autocomplete.IntentBuilder เมธอด Autocomplete.getPlaceFromIntent() จึงสามารถดึงออบเจ็กต์ Place ออกมาได้

    private final ActivityResultLauncher<Intent> startAutocomplete = registerForActivityResult(
            new ActivityResultContracts.StartActivityForResult(),
            result -> {
                if (result.getResultCode() == Activity.RESULT_OK) {
                    Intent intent = result.getData();
                    if (intent != null) {
                        Place place = Autocomplete.getPlaceFromIntent(intent);

                        // Write a method to read the address components from the Place
                        // and populate the form with the address components
                        Log.d(TAG, "Place: " + place.getAddressComponents());
                        fillInAddress(place);
                    }
                } else if (result.getResultCode() == Activity.RESULT_CANCELED) {
                    // The user canceled the operation.
                    Log.i(TAG, "User canceled autocomplete");
                }
            });

จากนั้น ให้เรียก Place.getAddressComponents() และจับคู่คอมโพเนนต์ที่อยู่แต่ละรายการกับช่องป้อนข้อมูลที่เกี่ยวข้องในแบบฟอร์มที่อยู่ ใส่ค่าจากสถานที่ที่ผู้ใช้เลือกไว้ในช่อง

การบันทึกข้อมูลที่อยู่จากการคาดคะเนแทนที่อยู่ที่ป้อนด้วยตนเองช่วยรับประกันความถูกต้องของที่อยู่ ทำให้มั่นใจได้ว่าระบบรู้จักที่อยู่และนำส่งข้อมูลถึงปลายทางได้ รวมถึงช่วยลดการกดแป้นพิมพ์ของผู้ใช้

ข้อควรพิจารณาเมื่อใช้การเติมข้อมูลสถานที่อัตโนมัติ

ฟีเจอร์เติมข้อความอัตโนมัติมีตัวเลือกมากมายที่ช่วยให้การใช้งานมีความยืดหยุ่น หากคุณไม่ต้องการใช้เพียงวิดเจ็ต คุณสามารถใช้บริการต่างๆ ร่วมกันเพื่อดูข้อมูลที่คุณต้องการจับคู่สถานที่ได้อย่างถูกต้อง

  • สำหรับแบบฟอร์ม ADDRESS ให้ตั้งค่าพารามิเตอร์ประเภทเป็น address เพื่อจำกัดการจับคู่กับที่อยู่แบบเต็ม ดูข้อมูลเพิ่มเติมเกี่ยวกับประเภทที่รองรับในคำขอเติมข้อมูลอัตโนมัติเกี่ยวกับสถานที่

  • กำหนดข้อจำกัดและอคติที่เหมาะสม หากคุณไม่ต้องการค้นหาทั่วโลก มีพารามิเตอร์จำนวนมากที่สามารถใช้เพื่อให้น้ำหนักหรือจำกัดการจับคู่ที่ตรงกันกับภูมิภาคที่เฉพาะเจาะจงเท่านั้น

    • ใช้ RectangularBounds เพื่อกำหนดขอบเขตรูปสี่เหลี่ยมเพื่อจำกัดพื้นที่ ใช้ setLocationRestriction() เพื่อให้แน่ใจว่าระบบจะแสดงผลเฉพาะที่อยู่ในพื้นที่เหล่านั้น

    • ใช้ setCountries() เพื่อจำกัดคำตอบไว้ในบางประเทศ

  • ปล่อยให้ช่องต่างๆ แก้ไขได้ในกรณีที่ไม่มีบางช่องที่ตรงกัน และอนุญาตให้ลูกค้าอัปเดตที่อยู่ได้หากจำเป็น เนื่องจากที่อยู่ส่วนใหญ่ที่แสดงโดยการเติมข้อความอัตโนมัติสถานที่ไม่มีหมายเลขสถานที่ย่อย เช่น เลขที่อพาร์ตเมนต์ เลขที่ห้อง หรือหมายเลขห้อง คุณสามารถย้ายโฟกัสไปที่ที่อยู่บรรทัดที่ 2 เพื่อกระตุ้นให้ผู้ใช้กรอกข้อมูลนั้นหากจำเป็น

ให้ภาพยืนยันของที่อยู่

ตัวอย่างนี้ใช้สิ่งต่อไปนี้ Maps SDK สำหรับ Android วิธีที่พร้อมใช้งาน: iOS | JavaScript

แสดงการยืนยันที่อยู่บนแผนที่ด้วยภาพเพื่อเป็นส่วนหนึ่งของรายการที่อยู่ ซึ่งทำให้ผู้ใช้มั่นใจมากขึ้นว่าที่อยู่นั้นถูกต้อง

รูปต่อไปนี้แสดงแผนที่ใต้ที่อยู่พร้อมกับหมุดตามที่อยู่ที่ป้อน

ตัวอย่างต่อไปนี้ทำตามขั้นตอนพื้นฐานในการเพิ่มแผนที่ใน Android โปรดดูรายละเอียดเพิ่มเติมในเอกสารประกอบ

กำลังเพิ่ม SupportMapFragment

ก่อนอื่นให้เพิ่มส่วนย่อย SupportMapFragment ลงในไฟล์ XML ของเลย์เอาต์

    <fragment
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:id="@+id/confirmation_map"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

จากนั้นเพิ่มส่วนย่อยแบบเป็นโปรแกรมหากยังไม่มี

    private void showMap(Place place) {
        coordinates = place.getLatLng();

        // It isn't possible to set a fragment's id programmatically so we set a tag instead and
        // search for it using that.
        mapFragment = (SupportMapFragment)
                getSupportFragmentManager().findFragmentByTag(MAP_FRAGMENT_TAG);

        // We only create a fragment if it doesn't already exist.
        if (mapFragment == null) {
            mapPanel = ((ViewStub) findViewById(R.id.stub_map)).inflate();
            GoogleMapOptions mapOptions = new GoogleMapOptions();
            mapOptions.mapToolbarEnabled(false);

            // To programmatically add the map, we first create a SupportMapFragment.
            mapFragment = SupportMapFragment.newInstance(mapOptions);

            // Then we add it using a FragmentTransaction.
            getSupportFragmentManager()
                    .beginTransaction()
                    .add(R.id.confirmation_map, mapFragment, MAP_FRAGMENT_TAG)
                    .commit();
            mapFragment.getMapAsync(this);
        } else {
            updateMap(coordinates);
        }
    }

การรับแฮนเดิลลงในส่วนย่อยและการลงทะเบียน Callback

  1. หากต้องการรับแฮนเดิลลงในแฟรกเมนต์ ให้เรียกเมธอด FragmentManager.findFragmentById แล้วส่งต่อรหัสทรัพยากรของแฟรกเมนต์นั้นในไฟล์เลย์เอาต์ หากเพิ่มส่วนย่อยแบบไดนามิก ให้ข้ามขั้นตอนนี้เนื่องจากคุณได้ดึงข้อมูลแฮนเดิลแล้ว

  2. เรียกเมธอด getMapAsync เพื่อตั้งค่าการเรียกกลับในส่วนย่อย

เช่น หากคุณเพิ่มส่วนย่อยแบบคงที่ ให้ทำดังนี้

Kotlin



val mapFragment = supportFragmentManager
    .findFragmentById(R.id.map) as SupportMapFragment
mapFragment.getMapAsync(this)

      

Java


SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
    .findFragmentById(R.id.map);
mapFragment.getMapAsync(this);

      

การจัดรูปแบบและการเพิ่มเครื่องหมายลงในแผนที่

เมื่อแผนที่พร้อมแล้ว ให้กำหนดรูปแบบ ตั้งกล้องไว้ตรงกลาง และเพิ่มเครื่องหมายที่พิกัดของที่อยู่ที่ป้อน โค้ดต่อไปนี้ใช้การจัดรูปแบบที่กำหนดไว้ในออบเจ็กต์ JSON หรือคุณจะโหลดรหัสแผนที่ซึ่งกำหนดไว้ด้วยการจัดรูปแบบ Maps ในระบบคลาวด์ก็ได้

    @Override
    public void onMapReady(@NonNull GoogleMap googleMap) {
        map = googleMap;
        try {
            // Customise the styling of the base map using a JSON object defined
            // in a string resource.
            boolean success = map.setMapStyle(
                    MapStyleOptions.loadRawResourceStyle(this, R.raw.style_json));

            if (!success) {
                Log.e(TAG, "Style parsing failed.");
            }
        } catch (Resources.NotFoundException e) {
            Log.e(TAG, "Can't find style. Error: ", e);
        }
        map.moveCamera(CameraUpdateFactory.newLatLngZoom(coordinates, 15f));
        marker = map.addMarker(new MarkerOptions().position(coordinates));
    }

(ดูตัวอย่างโค้ดแบบเต็ม)

กำลังปิดใช้งานการควบคุมแผนที่

เพื่อให้แผนที่เป็นเรื่องง่ายด้วยการแสดงตำแหน่งโดยไม่ต้องมีตัวควบคุมแผนที่เพิ่มเติม (เช่น เข็มทิศ แถบเครื่องมือ หรือฟีเจอร์อื่นๆ ที่มีในตัว) ให้พิจารณาปิดใช้ตัวควบคุมที่ไม่จำเป็น อีกทางเลือกหนึ่งบน Android คือการเปิดใช้โหมด Lite เพื่อจำกัดจำนวนการโต้ตอบ

การเปรียบเทียบที่อยู่ที่ผู้ใช้ป้อนกับตำแหน่งของอุปกรณ์

การขอหลักฐานแสดงที่อยู่อาจทำให้มั่นใจได้ว่าผู้ใช้อยู่ ณ ที่อยู่ที่ป้อนนั้นอาจซับซ้อนตามปัจจัยต่างๆ เช่น สถานที่ตั้งของผู้ใช้ที่อยู่ห่างไกล ผู้ใช้ที่ย้ายไปยังที่อยู่ใหม่ หรือธุรกิจดิจิทัล (เช่น ธนาคารดิจิทัล) ที่ไม่มีสถานที่ตั้งจริงที่ผู้ใช้เข้าชมได้ เพื่อแสดงหลักฐานแสดงที่อยู่พร้อมใบเรียกเก็บเงินค่าสาธารณูปโภคหรือเอกสารประกอบอื่นๆ การระบุวิธีดิจิทัลในการยืนยันที่อยู่ของผู้ใช้ช่วยให้คุณ มอบประสบการณ์ลงชื่อสมัครใช้ที่รวดเร็วและราบรื่น

การรักษาความปลอดภัยเป็นสิ่งสำคัญที่สุดในการเข้ารับการตรวจสอบที่อยู่ โดยเฉพาะอย่างยิ่งในกระบวนการลงชื่อสมัครใช้แบบดิจิทัล ส่วนนี้จะให้คำแนะนำและตัวอย่างสำหรับการตรวจสอบว่าสถานที่ตั้งของผู้ใช้ในระหว่างลงชื่อสมัครใช้ตรงกับที่อยู่ที่ผู้ใช้ป้อนหรือไม่

กระบวนการเปรียบเทียบที่อยู่ที่ป้อนกับตำแหน่งของอุปกรณ์มีขั้นตอนต่อไปนี้

  1. การแปลงที่อยู่ที่ผู้ใช้ป้อนเป็นพิกัดทางภูมิศาสตร์
  2. การแจ้งผู้ใช้เพื่อขอสิทธิ์ในการรับตำแหน่งอุปกรณ์
  3. การคำนวณระยะห่างระหว่างที่อยู่ที่ป้อนกับตำแหน่งอุปกรณ์ คุณจะได้กำหนดระยะทางสูงสุดที่นับรวมสำหรับการจับคู่ตำแหน่งที่อยู่

ภาพต่อไปนี้เป็นตัวอย่างวิธีที่คุณจะแจ้งให้ผู้ใช้เปรียบเทียบที่อยู่ที่ผู้ใช้ป้อนกับตำแหน่งปัจจุบัน

การแปลงที่อยู่ที่ผู้ใช้ป้อนเป็นพิกัดทางภูมิศาสตร์

ตัวอย่างนี้ใช้ Places SDK สำหรับ Android นอกจากนี้ยังมี: iOS | JavaScript | Geocoding API

หลังจากผู้ใช้ยอมรับการยืนยันที่อยู่ (โดยแตะ "ยืนยันว่าฉันอยู่ที่นี่แล้ว" ในภาพก่อนหน้า) ขั้นตอนแรกในการเปรียบเทียบที่อยู่กับตำแหน่งปัจจุบันคือการแปลงที่อยู่ที่ป้อนให้เป็นพิกัดทางภูมิศาสตร์

หากผู้ใช้เลือกที่อยู่ด้วยการเติมข้อความอัตโนมัติ โปรดส่งคำขอ Place.Field.LAT_LNG ในรายการช่องเติมข้อความอัตโนมัติที่แสดงในข้อมูลโค้ดการเพิ่มวิดเจ็ตเติมข้อความอัตโนมัติของสถานที่ และเรียกใช้เมธอด Place.getLatLng() เพื่อรับพิกัดทางภูมิศาสตร์ของที่อยู่ที่เลือก

coordinates = place.getLatLng();

หากผู้ใช้ป้อนที่อยู่ด้วยตนเองหรือแก้ไขหลังจากวางการเติมข้อความอัตโนมัติในช่องแล้ว ให้ใช้บริการ Android Geocoder หรือ Geocoding API เพื่อค้นหาพิกัดที่ตรงกับที่อยู่นั้น

ตัวอย่าง

https://maps.googleapis.com/maps/api/geocode/json?address=1600%20Amphitheatre%2BParkway%2C%20Mountain%20View%2C%20CA%2094043&key=YOUR_API_KEY

โปรดตรวจสอบว่าได้เข้ารหัส URL การเรียกไปยัง Geocoding API แล้ว

ข้อมูลอ้างอิงด่วนในการเข้ารหัส URL: %20 = เว้นวรรค, %2B = + (บวก), %2C = , (คอมมา)

การแจ้งให้ผู้ใช้ขอสิทธิ์ในการรับตำแหน่งของอุปกรณ์

คุณต้องขอสิทธิ์จากผู้ใช้เพื่อเปิดใช้บริการตำแหน่งเพื่อดูตำแหน่งอุปกรณ์ของผู้ใช้ ทำตามคำแนะนำในเอกสารประกอบของ Android เกี่ยวกับการสร้างแอปที่รับรู้ตำแหน่งเพื่อนำขั้นตอนต่อไปนี้ไปใช้

  • ขอสิทธิ์เข้าถึงตำแหน่งเป็นการให้สิทธิ์แบบครั้งเดียวในระดับสูง (ACCESS_FINE_LOCATION)

  • หากผู้ใช้ให้สิทธิ์เข้าถึงตำแหน่ง ให้รับข้อมูลตำแหน่งของผู้ใช้

  • หากผู้ใช้ปฏิเสธการเข้าถึงตำแหน่ง ให้จัดการการปฏิเสธอย่างสุภาพ ตัวอย่างเช่น คุณสามารถแสดงข้อความประเภทต่อไปนี้ (โดยสมมติว่าคุณไม่ได้จัดเก็บตำแหน่งปัจจุบันของผู้ใช้)

    "หากคุณไม่แจ้งให้แอปทราบตำแหน่งที่แน่นอน คุณจะต้องยืนยันทางไปรษณีย์เพื่อเปิดใช้งานบัญชี [ตกลง]"

รูปต่อไปนี้แสดงตัวอย่างพรอมต์ให้ผู้ใช้อนุญาตในการรับตำแหน่งของอุปกรณ์

หากต้องการตรวจสอบสิทธิ์เข้าถึงตำแหน่ง ให้เตรียมตัวเปิดกิจกรรมที่จะฟังผลลัพธ์จากกิจกรรมที่เปิดตัวด้วย ActivityResultLauncher ผลลัพธ์ Callback จะมีสตริงที่ระบุว่าผู้ใช้อนุญาตหรือปฏิเสธสิทธิ์ที่ร้องขอ

    // Register the permissions callback, which handles the user's response to the
    // system permissions dialog. Save the return value, an instance of
    // ActivityResultLauncher, as an instance variable.
    private final ActivityResultLauncher<String> requestPermissionLauncher =
            registerForActivityResult(new ActivityResultContracts.RequestPermission(), isGranted -> {
                if (isGranted) {
                    // Since ACCESS_FINE_LOCATION is the only permission in this sample,
                    // run the location comparison task once permission is granted.
                    // Otherwise, check which permission is granted.
                    getAndCompareLocations();
                } else {
                    // Fallback behavior if user denies permission
                    Log.d(TAG, "User denied permission");
                }
            });

จากนั้นตรวจสอบว่าแอปมีสิทธิ์ ACCESS_FINE_LOCATION หรือไม่ ไม่เช่นนั้น ให้ขอสิทธิ์จากผู้ใช้โดยเปิดกิจกรรมขอสิทธิ์โดยใช้ Launcher ที่ระบุไว้ในขั้นตอนก่อนหน้า

    private void checkLocationPermissions() {
        if (ContextCompat.checkSelfPermission(this, ACCESS_FINE_LOCATION)
                == PackageManager.PERMISSION_GRANTED) {
            getAndCompareLocations();
        } else {
            requestPermissionLauncher.launch(
                    ACCESS_FINE_LOCATION);
        }
    }

เมื่อได้รับสิทธิ์ ACCESS_FINE_LOCATION แล้ว ให้ใช้ผู้ให้บริการ Fused Location เพื่อดูตำแหน่งสุดท้ายที่ทราบของอุปกรณ์และสร้างออบเจ็กต์ LatLng จากอุปกรณ์

        FusedLocationProviderClient fusedLocationClient =
                LocationServices.getFusedLocationProviderClient(this);

        fusedLocationClient.getLastLocation()
                .addOnSuccessListener(this, location -> {
                    // Got last known location. In some rare situations this can be null.
                    if (location == null) {
                        return;
                    }

                    deviceLocation = new LatLng(location.getLatitude(), location.getLongitude());
                    // ...
                });
    }

กำลังคำนวณระยะห่างระหว่างที่อยู่ที่ป้อนกับตำแหน่งของอุปกรณ์

ใช้คณิตศาสตร์เพื่อคำนวณระยะห่างระหว่างพิกัดละติจูด/ลองจิจูด 2 รายการ (ที่อยู่ที่ป้อนและตำแหน่งของอุปกรณ์) Maps SDK สำหรับไลบรารียูทิลิตีของ Android แบบโอเพนซอร์สมีวิธีคำนวณระยะทางแบบทรงกลมระหว่าง 2 จุดบนโลกที่มีประโยชน์

ก่อนอื่น ให้ติดตั้ง Maps SDK สำหรับไลบรารียูทิลิตีของ Android โดยเพิ่ม Dependency ต่อไปนี้ลงในไฟล์ build.gradle ของแอป

dependencies {


    // Utility Library for Maps SDK for Android
    // You do not need to add a separate dependency for the Maps SDK for Android
    // since this library builds in the compatible version of the Maps SDK.
    implementation 'com.google.maps.android:android-maps-utils:3.8.0'
}

จากนั้นกลับไปที่ไฟล์กิจกรรมหลังจากได้ตำแหน่งอุปกรณ์ที่ทราบแล้ว ให้กำหนดรัศมีเป็นเมตรเพื่อพิจารณาทั้ง 2 ตำแหน่งว่า "ตรงกัน" รัศมีควรมีขนาดใหญ่พอที่จะทำให้เกิดความแปรปรวนในความแม่นยำของ GPS และขนาดของสถานที่ที่อยู่ที่ผู้ใช้ป้อน เช่น

private static final double acceptableProximity = 150;

จากนั้นใช้วิธีการไลบรารียูทิลิตี computeDistanceBetween() เพื่อคำนวณระยะห่างระหว่างตำแหน่งอุปกรณ์และตำแหน่งที่อยู่ที่ผู้ใช้ป้อน หากระยะทางอยู่ภายในรัศมีที่กำหนดไว้ด้านบน ให้พิจารณาสถานที่ที่ตรงกัน

// Use the computeDistanceBetween function in the Maps SDK for Android Utility Library
// to use spherical geometry to compute the distance between two Lat/Lng points.
double distanceInMeters = computeDistanceBetween(deviceLocation, enteredLocation);
if (distanceInMeters <= acceptedProximity) {
    Log.d(TAG, "location matched");
    // TODO: Display UI based on the locations matching
} else {
    Log.d(TAG, "location not matched");
    // TODO: Display UI based on the locations not matching
}

(ดูตัวอย่างโค้ดแบบเต็ม)

หากที่อยู่และสถานที่ตั้งตรงกัน ให้แสดงการยืนยันในแอปตามที่แสดงในรูปต่อไปนี้

เคล็ดลับเพื่อยกระดับการลงชื่อสมัครใช้แบบด่วนและยืนยันแล้ว

อนุญาตให้ผู้ใช้ป้อนที่อยู่ตามชื่อธุรกิจหรือจุดสนใจ บริการการคาดคะเน "พิมพ์ล่วงหน้า" ไม่เพียงใช้ได้กับที่อยู่เท่านั้น แต่คุณยังเลือกอนุญาตให้ผู้ใช้ป้อนชื่อธุรกิจหรือจุดสังเกตได้อีกด้วย หากต้องการอนุญาตให้ป้อนทั้งที่อยู่และชื่อสถานประกอบการ ให้นำพร็อพเพอร์ตี้ types ออกจากคำจำกัดความของการเติมข้อความอัตโนมัติ

ปรับแต่งรูปลักษณ์ของช่องเติมข้อมูลอัตโนมัติของสถานที่ให้ตรงกับรูปแบบเว็บไซต์ของคุณ หากคุณต้องการควบคุมรูปลักษณ์ของสถานที่ เติมข้อความอัตโนมัติในแอปแทนที่จะใช้วิดเจ็ตของ Google คุณสามารถใช้ เติมข้อความอัตโนมัติด้วยโปรแกรม เพื่อขับเคลื่อน UI ที่คุณสร้างด้วยบริการเติมข้อความอัตโนมัติในสถานที่