इस रेफ़रंस पेज में, इंटरमीडिएट iframe API के बारे में बताया गया है. इसका इस्तेमाल, iframe का इस्तेमाल करके वेब पेजों में One Tap प्रॉम्प्ट को एम्बेड करने के लिए किया जाता है.
इंटरमीडिएट iframe के साथ काम करने के बारे में ज़्यादा जानने के लिए, iframe का इस्तेमाल करके 'एक टैप से साइन इन करें' सुविधा को इंटिग्रेट करना लेख पढ़ें.
इंटरमीडिएट iframe JavaScript लाइब्रेरी लोड करना
नीचे दिए गए कोड स्निपेट को उन एचटीएमएल पेजों में डालें जिन पर आपको Google One टैप करके दिखाने की सुविधा चाहिए:
<script src="https://accounts.google.com/gsi/intermediate"></script>
HTML API
g_id_intermediate_iframe
पर सेट किए गए आईडी एट्रिब्यूट वाले एचटीएमएल एलिमेंट को शामिल करके, इंटरमीडिएट 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 |
आपके One Tap इंटरमीडिएट iframe का यूआरआई |
data-done |
यह JavaScript का कॉलबैक मैथड है. इसे तब ट्रिगर किया जाता है, जब एक टैप वाला यूज़र एक्सपीरियंस पूरा हो जाता है. |
data-src
यह एट्रिब्यूट, आपके One Tap इंटरमीडिएट iframe का यूआरआई है. ज़्यादा जानकारी के लिए, यहां दी गई टेबल देखें:
टाइप | ज़रूरी है | उदाहरण |
---|---|---|
स्ट्रिंग | हां | data-src="https://example.com/onetap_iframe.html" |
data-done
यह एट्रिब्यूट, JavaScript का कॉलबैक तरीका है. यह तब ट्रिगर होता है, जब एक बार टैप करके साइन इन करने की सुविधा का इस्तेमाल किया जाता है.
डिफ़ॉल्ट रूप से, One Tap UX पूरा होने पर कॉन्टेंट पेज फिर से लोड हो जाता है. डिफ़ॉल्ट तरीके को बदला जा सकता है. इसके लिए, आपको अपना 'हो गया' कॉलबैक देना होगा. ज़्यादा जानकारी के लिए, यहां दी गई टेबल देखें:
टाइप | ज़रूरी है | उदाहरण |
---|---|---|
फ़ंक्शन | वैकल्पिक | data-done="onOneTapSuccess" |
JavaScript API
JavaScript तरीके को कॉल करके, इंटरमीडिएट iframe को लोड किया जा सकता है.
तरीका: google.accounts.id.initializeIntermediate
google.accounts.id.initializeIntermediate
वाला तरीका, कॉन्फ़िगरेशन ऑब्जेक्ट के आधार पर इंटरमीडिएट iframe लोड करता है. इस तरीके का कोड उदाहरण यहां दिया गया है:
google.accounts.id.initializeIntermediate(IntermediateConfig)
यहां दिए गए कोड के उदाहरण में, onload
फ़ंक्शन के साथ google.accounts.id.initializeIntermediate
तरीके को लागू करने का तरीका बताया गया है:
<script>
window.onload = function () {
google.accounts.id.initializeIntermediate({
src: 'https://example.com/intermediate'
});
};
</script>
डेटा टाइप: IntermediateConfig
यहां दी गई टेबल में, फ़ील्ड और उनके ब्यौरे दिए गए हैं:
फ़ील्ड | |
---|---|
src |
आपके One Tap इंटरमीडिएट iframe का यूआरआई |
done |
यह JavaScript का कॉलबैक फ़ंक्शन है. इसे तब ट्रिगर किया जाता है, जब One Tap UX चालू हो. |
स्रोत
यह फ़ील्ड, आपके One Tap इंटरमीडिएट iframe का यूआरआई है. ज़्यादा जानकारी के लिए, यहां दी गई टेबल देखें:
टाइप | ज़रूरी है | उदाहरण |
---|---|---|
स्ट्रिंग | हां | src: "https://example.com/onetap_iframe.html" |
done
यह फ़ील्ड, JavaScript का कॉलबैक तरीका है. इसे तब ट्रिगर किया जाता है, जब One Tap UX पूरा हो जाता है.
डिफ़ॉल्ट रूप से, One Tap UX पूरा होने पर कॉन्टेंट पेज फिर से लोड हो जाता है. डिफ़ॉल्ट तरीके को बदला जा सकता है. इसके लिए, आपको अपना 'हो गया' कॉलबैक देना होगा. ज़्यादा जानकारी के लिए, यहां दी गई टेबल देखें:
टाइप | ज़रूरी है | उदाहरण |
---|---|---|
फ़ंक्शन | वैकल्पिक | done: onOneTapSuccess |