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

Sebastian Benz

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

เดโมสัญญาณการมีส่วนร่วมของแท็บที่กำหนดเอง

ข้อควรระวัง: ฟีเจอร์นี้ต้องใช้ androidx.browser:browser:1.6.0-alpha01 ขึ้นไป groovy dependencies { … implementation 'androidx.browser:browser:1.6.0-alpha02' }

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

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

โดยทั้ง 2 รายการต้องใช้ 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");
    }
};

ประเด็นสำคัญ: หากต้องการให้เหตุการณ์ onGreatestScrollPercentageIncreased รีเซ็ต จะต้องมีการนำทางใหม่ในเฟรมหลักไปยังเอกสารใหม่ กล่าวคือ ระบบจะไม่รีเซ็ตระดับการเลื่อนสำหรับการไปยังส่วนต่างๆ ภายในแอปพลิเคชันหน้าเว็บเดียวหรือไปยังจุดยึด

ทั้ง 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);
}