วัดการมีส่วนร่วมของผู้ใช้

Sebastian Benz

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

แท็บที่กำหนดเองมีโค้ดเรียกกลับที่แตกต่างกัน 2 แบบสำหรับวัดการมีส่วนร่วมของผู้ใช้ ดังนี้

• CustomTabsCallback สำหรับการติดตามเหตุการณ์การนำทางพื้นฐาน เช่น "NAVIGATION_STARTED" หรือ "NAVIGATION_FINISHED"
• EngagementSignalsCallback สำหรับติดตามการมีส่วนร่วมของผู้ใช้ที่เจาะจงในหน้า เช่น ทิศทางการเลื่อนหรือเปอร์เซ็นต์การเลื่อน

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

หากต้องการวัดการมีส่วนร่วมของผู้ใช้ ให้สร้าง CustomTabsCallback และอินสแตนซ์ EngagementSignalsCallback ก่อน CustomTabsCallback จะได้รับ navigationEvent อย่างต่อเนื่องซึ่งอธิบายว่ามีการนำทางประเภทใดเกิดขึ้น ดังนี้

private CustomTabsCallback mCustomTabsCallback = new CustomTabsCallback() {
    @Override
    public void onNavigationEvent(int navigationEvent, @Nullable Bundle extras) {
        String event;
        switch (navigationEvent) {
            case CustomTabsCallback.NAVIGATION_ABORTED:
                event = "NAVIGATION_ABORTED";
                break;
            case CustomTabsCallback.NAVIGATION_FAILED:
                event = "NAVIGATION_FAILED";
                break;
            case CustomTabsCallback.NAVIGATION_FINISHED:
                event = "NAVIGATION_FINISHED";
                break;
            case CustomTabsCallback.NAVIGATION_STARTED:
                event = "NAVIGATION_STARTED";
                break;
            case CustomTabsCallback.TAB_SHOWN:
                event = "TAB_SHOWN";
                break;
            case CustomTabsCallback.TAB_HIDDEN:
                event = "TAB_HIDDEN";
                break;
            default:
                event = String.valueOf(navigationEvent);
        }
        Log.d(TAG, "onNavigationEvent (navigationEvent=" + event + ')');
        mTextNavigation.setText("onNavigationEvent " + event);
    }
};

EngagementSignalsCallback รองรับโค้ดเรียกกลับที่แตกต่างกัน 3 แบบดังนี้

onVerticalScrollEvent()

เรียกใช้ทุกครั้งที่ผู้ใช้เปลี่ยนทิศทางการเลื่อน โดย isDirectionUp (อาร์กิวเมนต์แรก) แสดงทิศทาง

1. onGreatestScrollPercentageIncreased: ความลึกในการเลื่อนของสัญญาณแท็บที่กําหนดเองเป็นช่วง 5% สูงสุด 100% เมื่อผู้ใช้ไปถึงด้านล่างของหน้า จะมีการเรียกใช้การติดต่อกลับเมื่อผู้ใช้หยุดเลื่อนเท่านั้น ค่าจะรีเซ็ตเป็น 0% ทุกครั้งที่ไปยังส่วนต่างๆ
2. onSessionEnded: แท็บที่กำหนดเองจะเริ่มการทำงานของเหตุการณ์นี้เมื่อหยุดส่งสัญญาณการมีส่วนร่วม (เช่น หลังจากที่ผู้ใช้ปิดแท็บที่กำหนดเองแล้ว) didUserInteract จะเป็นจริงหากผู้ใช้โต้ตอบกับหน้าเว็บในลักษณะใดก็ตาม (การเลื่อน การคลิกปุ่ม ฯลฯ)

private EngagementSignalsCallback mEngagementSignalsCallback = new EngagementSignalsCallback() {
    @Override
    public void onVerticalScrollEvent(boolean isDirectionUp, @NonNull Bundle extras) {
        Log.d(TAG, "onVerticalScrollEvent (isDirectionUp=" + isDirectionUp + ')');
        mTextVerticalScroll.setText("vertical scroll " + (isDirectionUp ? "UP️" : "DOWN"));
    }

    @Override
    public void onGreatestScrollPercentageIncreased(int scrollPercentage, @NonNull Bundle extras) {
        Log.d(TAG, "scroll percentage: " + scrollPercentage + "%");
        mTextGreatestPercentage.setText("scroll percentage: " + scrollPercentage + "%");
    }

    @Override
    public void onSessionEnded(boolean didUserInteract, @NonNull Bundle extras) {
        Log.d(TAG, "onSessionEnded (didUserInteract=" + didUserInteract + ')');
        mTextSessionEnd.setText(didUserInteract ? "session ended with user interaction" : "session ended without user interaction");
    }
};

ทั้ง CustomTabsCallback และ EngagementSignalsCallback ต้องมีการเชื่อมต่อบริการแท็บที่กำหนดเองที่ใช้งานอยู่ เมื่อเชื่อมต่อบริการแล้ว คุณจะสร้าง CustomTabsSession ใหม่ได้โดยโทรไปที่ CustomTabsClient.newSession() และส่งCustomTabsCallback

หลังจากนั้นคุณควรเรียกใช้ isEngagementSignalsApiAvailable() เพื่อตรวจสอบว่าเบราว์เซอร์ปัจจุบันรองรับสัญญาณการมีส่วนร่วมหรือไม่ หากระบบรองรับ คุณจะลงทะเบียน EngagementSignalsCallback ผ่าน CustomTabsSession.setEngagementSignalsCallback() ได้

private CustomTabsClient mCustomTabsClient;
private CustomTabsSession mCustomTabsSession;

private final CustomTabsServiceConnection mServiceConnectionCallback = new CustomTabsServiceConnection() {

    @Override
    public void onCustomTabsServiceConnected(@NonNull ComponentName name, @NonNull CustomTabsClient client) {
        mCustomTabsClient = client;
        mCustomTabsSession = mCustomTabsClient.newSession(mCustomTabsCallback);
        try {
            boolean engagementSignalsApiAvailable = mCustomTabsSession.isEngagementSignalsApiAvailable(Bundle.EMPTY);
            if (!engagementSignalsApiAvailable) {
                Log.d(TAG, "CustomTab Engagement signals not available, make sure to use the " +
                        "latest Chrome version and enable via chrome://flags/#cct-real-time-engagement-signals");
                return;
            }
            mCustomTabsSession.setEngagementSignalsCallback(mEngagementSignalsCallback, Bundle.EMPTY);
        } catch (RemoteException e) {
            Log.w(TAG, "The Service died while responding to the request.", e);
        } catch (UnsupportedOperationException e) {
            Log.w(TAG, "Engagement Signals API isn't supported by the browser.", e);
        }
    }

    @Override
    public void onServiceDisconnected(ComponentName name) {
        mCustomTabsClient = null;
        mConnection = null;
        mCustomTabsSession = null;
    }
};

สิ่งเดียวที่ต้องทำก็คือการเชื่อมโยง CustomTabsService:

@Override
protected void onStart() {
    super.onStart();
    bindCustomTabsService();
}

private void bindCustomTabsService() {
    String packageName = CustomTabsHelper.getPackageNameToUse(this);
    if (packageName == null) return;
    CustomTabsClient.bindCustomTabsService(this, packageName, mConnection);
}