ผสานรวม maio กับสื่อกลาง AdMob

คู่มือนี้จะแสดงวิธีใช้ Google Mobile Ads SDK for React Native เพื่อโหลดและแสดงโฆษณาจาก maio โดยใช้สื่อกลาง ซึ่งครอบคลุมการผสานรวม Waterfall โดยจะครอบคลุมวิธีเพิ่ม maio ลงในการกำหนดค่าสื่อกลางของหน่วยโฆษณา และวิธีผสานรวม SDK และอะแดปเตอร์ของ maio เข้ากับแอป React Native

อินเทอร์เฟซแดชบอร์ดของ maio ใช้ข้อความภาษาญี่ปุ่นสำหรับป้ายกำกับ ปุ่ม และคำอธิบาย และภาพหน้าจอในคู่มือนี้ยังไม่ได้แปล อย่างไรก็ตาม ในคำอธิบายและวิธีการที่นี่ ป้ายกำกับและปุ่มจะอ้างอิงตามภาษาอังกฤษที่เทียบเท่า "URL スキーム," for example, is "URL Scheme,".

การผสานรวมและรูปแบบโฆษณาที่รองรับ

อะแดปเตอร์สื่อกลางสำหรับ maio มีความสามารถดังต่อไปนี้

การผสานรวม
การเสนอราคา
การแสดงวิดีโอตามลำดับขั้น
รูปแบบ
โฆษณาเปิดแอป
แบนเนอร์
โฆษณาคั่นระหว่างหน้า
ได้รับรางวัลแล้ว
โฆษณาคั่นระหว่างหน้าที่มีการให้รางวัล
เนทีฟ

ข้อกำหนดเบื้องต้น

โปรดตรวจสอบสิ่งต่อไปนี้ก่อนดำเนินการต่อ

  • Google Mobile Ads SDK for React Native เวอร์ชันล่าสุด
  • เฟรมเวิร์ก React Native เวอร์ชัน 0.85.0 ขึ้นไป
  • วิธีติดตั้งใช้งานใน Android
    • Android API ระดับ 24 ขึ้นไป
  • วิธีติดตั้งใช้งานใน iOS
    • เป้าหมายการติดตั้งใช้งาน iOS เวอร์ชัน 15.0 ขึ้นไป
  • โปรเจ็กต์ React Native ที่ใช้งานได้ซึ่งกำหนดค่าด้วย Google Mobile Ads SDK for React Native ดูรายละเอียดได้ที่หัวข้อตั้งค่า Google Mobile Ads SDK for React Native
    • ตรวจสอบว่าคุณได้ดาวน์โหลดและแตกโฟลเดอร์ adapters จากโฟลเดอร์ gma-sdk-react-native แล้ว หากไม่มีโฟลเดอร์ adapters ให้ทำตามขั้นตอนที่ 1, 2 และ 3 ในหัวข้อติดตั้ง Google Mobile Ads SDK for React Native
  • ตั้งค่าสื่อกลาง AdMob

ขั้นตอนที่ 1: ตั้งค่าการกำหนดค่าใน UI ของ maio

ก่อนอื่น ให้ลงชื่อสมัครใช้หรือเข้าสู่ระบบบัญชี maio คลิกปุ่มการจัดการแอปพลิเคชันในแถบด้านข้างทางซ้าย แล้วคลิกแอปใหม่

เลือกแท็บที่ตรงกับประเภทโฆษณาที่ต้องการ

โฆษณาคั่นระหว่างหน้า

ป้อนชื่อแอป เลือกแพลตฟอร์ม และระบุ URL ของแอป เลือกโฆษณาคั่นระหว่างหน้าแบบวิดีโอเป็นประเภทโฆษณา แล้วคลิกอัปเดต

Android

iOS

ได้รับรางวัลแล้ว

ป้อนชื่อแอป เลือกแพลตฟอร์ม และระบุ URL ของแอป เลือกรางวัลจากวิดีโอเป็นประเภทโฆษณา แล้วคลิกอัปเดต

Android

iOS

ในหน้าการจัดการแอปพลิเคชัน ให้จดบันทึกรหัสสื่อไว้ คุณต้องใช้รหัสนี้เพื่อตั้งค่าหน่วยโฆษณา AdMob ในส่วนถัดไป

Android

iOS

ในหน้าการจัดการโซน ให้จดรหัสโซนไว้ นอกจากนี้ คุณยังต้องใช้รหัสนี้เพื่อตั้งค่าหน่วยโฆษณา AdMob ในส่วนถัดไป

Android

iOS

(Waterfall เท่านั้น) นอกจากรหัสสื่อและรหัสโซนแล้ว คุณจะต้องใช้รหัส API และคีย์ API เพื่อตั้งค่ารหัสหน่วยโฆษณาสำหรับสื่อกลาง ในหน้า Reporting API ให้จดบันทึก API ID และคีย์ API

ขั้นตอนที่ 2: ตั้งค่าดีมานด์ maio ใน UI ของ AdMob

กำหนดการตั้งค่าสื่อกลางสำหรับหน่วยโฆษณา

Android

ดูวิธีการได้ที่ขั้นตอนที่ 2 ในคู่มือสำหรับ Android

iOS

ดูวิธีการได้ที่ขั้นตอนที่ 2 ในคู่มือสำหรับ iOS

ขั้นตอนที่ 3: นำเข้า SDK และอะแดปเตอร์ maio

ในไดเรกทอรีรากของโปรเจ็กต์ ให้ติดตั้งGoogle Mobile Ads SDK for React Native อะแดปเตอร์สื่อกลางสำหรับ maio ดำเนินการต่อไปนี้ให้เสร็จสมบูรณ์

  1. คัดลอกไฟล์ tar ของอะแดปเตอร์ Google Mobile Ads SDK for React Native จากไดเรกทอรี gma-sdk-react-native/adapters/maio/ ไปยังไดเรกทอรี local_packages/ ของโปรเจ็กต์ หากไม่มีโฟลเดอร์ adapters โปรดดูข้อกำหนดเบื้องต้น

    mkdir -p local_packages
    cp EXTRACT_DIR/gma-sdk-react-native/adapters/maio/gma-mediation-maio-0.1.0.tgz local_packages/
    

    แทนที่ EXTRACT_DIR ด้วยเส้นทางไปยังไดเรกทอรีที่คุณแตกไฟล์เก็บถาวร

  2. ติดตั้งแพ็กเกจอะแดปเตอร์โดยใช้เครื่องมือจัดการแพ็กเกจที่ต้องการ ดังนี้

    npm

    npm install ./local_packages/gma-mediation-maio-0.1.0.tgz
    

    ไหมพรม

    yarn add ./local_packages/gma-mediation-maio-0.1.0.tgz
    

  3. หากคุณกำลังสร้างสำหรับ Android ให้เพิ่มที่เก็บต่อไปนี้ลงในไฟล์ build.gradle ในไดเรกทอรี android ของโปรเจ็กต์

    repositories {
        google()
        mavenCentral()
        maven {
            url = uri("https://imobile-maio.github.io/maven")
        }
    }
    

ขั้นตอนที่ 4: เพิ่มโค้ดที่จำเป็น

Android

ไม่จำเป็นต้องใช้โค้ดเพิ่มเติมสำหรับการผสานรวม maio

iOS

การผสานรวม SKAdNetwork

ทำตามเอกสารประกอบของ maio เพื่อเพิ่มตัวระบุ SKAdNetwork ลงในไฟล์ Info.plist ของโปรเจ็กต์

ขั้นตอนที่ 5: ทดสอบการติดตั้งใช้งาน

เปิดใช้โฆษณาทดสอบ

ตรวจสอบว่าคุณได้ลงทะเบียนอุปกรณ์ทดสอบสำหรับ AdMob แล้ว

ผู้เผยแพร่โฆษณาที่ใช้ Google Mobile Ads SDK for React Native เวอร์ชัน 7.26.0 ขึ้นไปจะได้รับโฆษณาทดสอบจาก maio โดยอัตโนมัติในโทรศัพท์และแท็บเล็ตที่ลงทะเบียนเป็นอุปกรณ์ทดสอบเมื่อส่งคำขอ

ยืนยันโฆษณาทดสอบ

หากต้องการยืนยันว่าคุณได้รับโฆษณาทดสอบจาก maio ให้เปิดใช้การทดสอบแหล่งที่มาของโฆษณาแหล่งเดียว ในเครื่องมือตรวจสอบโฆษณาโดยใช้แหล่งที่มาของโฆษณา maio (Waterfall)

รหัสข้อผิดพลาด

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

Android

รูปแบบ ชื่อประเภท
โฆษณาคั่นระหว่างหน้า jp.maio.sdk.android.mediation.admob.adapter.Interstitial
ได้รับรางวัลแล้ว jp.maio.sdk.android.mediation.admob.adapter.Rewarded

iOS

รูปแบบ ชื่อประเภท
โฆษณาคั่นระหว่างหน้า GADMMaioInterstitialAdapter
ได้รับรางวัลแล้ว GADMMaioRewardedAdapter

ต่อไปนี้คือรหัสและข้อความที่แสดงโดยอะแดปเตอร์ maio เมื่อโหลดโฆษณาไม่สำเร็จ

Android

รหัสข้อผิดพลาด เหตุผล
0-10 maio แสดงข้อผิดพลาดเฉพาะ SDK ดูรายละเอียดเพิ่มเติมได้ที่โค้ดและเอกสารประกอบของ maio
101 Maio ไม่มีโฆษณาที่พร้อมใช้งาน
102 พารามิเตอร์เซิร์ฟเวอร์ไม่ถูกต้อง (เช่น ไม่มีรหัสตำแหน่งโฆษณา)
103 บริบทที่ใช้ในการโหลดโฆษณาไม่ใช่ `Activity` อินสแตนซ์

iOS

รหัสข้อผิดพลาด เหตุผล
0-10 maio แสดงข้อผิดพลาดเฉพาะ SDK ดูรายละเอียดเพิ่มเติมได้ที่โค้ดของ maio
101 maio ยังไม่มีโฆษณาที่พร้อมใช้งาน
102 พารามิเตอร์เซิร์ฟเวอร์ไม่ถูกต้อง (เช่น ไม่มีรหัสตำแหน่งโฆษณา)
103 อะแดปเตอร์ maio ไม่รองรับรูปแบบโฆษณาที่ขอ
104 มีการโหลดโฆษณาสำหรับการกำหนดค่าเครือข่ายนี้แล้ว

เวอร์ชัน 0.1.0

  • การเผยแพร่ครั้งแรก