หน้านี้ได้รับการแปลโดย Cloud Translation API

เอกสารอ้างอิง API คอมโพเนนต์ที่ไม่ใช่ AMP

หน้าอ้างอิงนี้อธิบายวิธีโหลด iframe ระดับกลางลงในหน้า HTML

โหลดไลบรารี JavaScript Iframe กลาง

วางข้อมูลโค้ดต่อไปนี้ลงในหน้า HTML ที่ต้องการไปยัง Google One แตะเพื่อแสดง

<script src="https://accounts.google.com/gsi/intermediate"></script>

API แบบ HTML

คุณโหลด iframe ระดับกลางได้โดยใส่องค์ประกอบ HTML ที่ตั้งแอตทริบิวต์รหัสเป็น g_id_intermediate_iframe ดูตัวอย่างข้อมูลโค้ดต่อไปนี้

<script src="https://accounts.google.com/gsi/intermediate"></script>
...
<div id="g_id_intermediate_iframe"
        data-src = "https://example.com/onetap_iframe.html">
</div>

องค์ประกอบที่มีรหัส "g_id_intermediate_iframe"

คุณจะใส่แอตทริบิวต์ข้อมูล iframe ระดับกลางไว้ในองค์ประกอบที่มองเห็นหรือมองไม่เห็น เช่น <div> และ <span> ข้อกําหนดอย่างเดียวคือการตั้งค่ารหัสองค์ประกอบเป็น g_id_intermediate_iframe อย่าใส่รหัสนี้ในองค์ประกอบหลายรายการ

ตารางต่อไปนี้แสดงแอตทริบิวต์ข้อมูลพร้อมคําอธิบาย

แอตทริบิวต์
`data-src`	URI ของ iframe สื่อกลางแบบ One Tap
`data-done`	เมธอดเรียก JavaScript ที่จะทริกเกอร์เมื่อเสร็จสิ้น One Tap UX

data-src

แอตทริบิวต์นี้คือ URI ของ iframe สื่อกลางแบบ One Tap โปรดดูข้อมูลเพิ่มเติมในตารางต่อไปนี้

ประเภท	จำเป็น	ตัวอย่าง
สตริง	ได้	`data-src="https://example.com/onetap_iframe.html"`

ข้อมูลเสร็จสิ้น

แอตทริบิวต์นี้เป็นวิธีเรียกกลับของ JavaScript ที่จะทํางานเมื่อเสร็จสิ้นการแตะ UX ครั้งเดียว

ระบบจะโหลดหน้าเนื้อหาซ้ําเมื่อ One Tap UX เสร็จสิ้น คุณลบล้างลักษณะการทํางานเริ่มต้นได้โดยการระบุโค้ดเรียกกลับของคุณเอง โปรดดูข้อมูลเพิ่มเติมในตารางต่อไปนี้

ประเภท	จำเป็น	ตัวอย่าง
การทำงาน	ไม่บังคับ	`data-done="onOneTapSuccess"`

JavaScript API

คุณโหลด iframe ระดับกลางได้โดยเรียกใช้เมธอด JavaScript

เมธอด: google.accounts.id.initializeIntermediate

เมธอด google.accounts.id.initializeIntermediate จะโหลด iframe ระหว่างกลางตามออบเจ็กต์การกําหนดค่า ดูตัวอย่างโค้ดต่อไปนี้ของเมธอด

google.accounts.id.initializeIntermediate(IntermediateConfig)

ตัวอย่างโค้ดต่อไปนี้ใช้เมธอด google.accounts.id.initializeIntermediate ที่มีฟังก์ชัน onload

<script>
  window.onload = function () {
    google.accounts.initializeIntermediate({
      src: 'https://example.com/intermediate'
    });
  };
</script>

ประเภทข้อมูล: IntermediateConfig

ตารางต่อไปนี้จะแสดงช่องพร้อมคําอธิบาย

ช่อง
`src`	URI ของ iframe สื่อกลางแบบ One Tap
`done`	เมธอดเรียก JavaScript ที่จะทริกเกอร์เมื่อ One Tap UX มีการเรียกใช้

src

ช่องนี้คือ URI ของ iframe สื่อกลางแบบ One Tap โปรดดูข้อมูลเพิ่มเติมในตารางต่อไปนี้

ประเภท	จำเป็น	ตัวอย่าง
สตริง	ได้	`src: "https://example.com/onetap_iframe.html"`

เสร็จสิ้น

ช่องนี้เป็นวิธีเรียก JavaScript ที่จะทริกเกอร์เมื่อเสร็จสิ้นการแตะ One UX

ประเภท	จำเป็น	ตัวอย่าง
การทำงาน	ไม่บังคับ	`done: onOneTapSuccess`