Google I/O से जुड़े रहने के लिए धन्यवाद! मांग पर वीडियो देखें.

पैसे चुकाने का तरीका सेट अप करना

वेब पेमेंट्स का इस्तेमाल करके पेमेंट का लेन-देन, आपके पेमेंट ऐप्लिकेशन की खोज से शुरू होता है. पेमेंट का तरीका सेट अप करने और पेमेंट ऐप्लिकेशन को कारोबारियों, कंपनियों, और खरीदारों के लिए पेमेंट करने के लिए तैयार करने का तरीका जानें.

Eiji Kitamura

पब्लिश होने की तारीख: 27 सितंबर, 2017, पिछले अपडेट की तारीख: 1 जुलाई, 2025

Payment Request API के साथ इस्तेमाल करने के लिए, पेमेंट ऐप्लिकेशन को पेमेंट के तरीके के आइडेंटिफ़ायर से जुड़ा होना चाहिए. जिन कारोबारियों या कंपनियों को पेमेंट ऐप्लिकेशन के साथ इंटिग्रेट करना है वे पेमेंट के तरीके के आइडेंटिफ़ायर का इस्तेमाल करके, ब्राउज़र को यह जानकारी देंगी. इस लेख में बताया गया है कि पेमेंट ऐप्लिकेशन को खोजने की सुविधा कैसे काम करती है. साथ ही, इसमें यह भी बताया गया है कि ब्राउज़र से पेमेंट ऐप्लिकेशन को सही तरीके से खोजने और चालू करने के लिए, उसे कैसे कॉन्फ़िगर करें.

अगर आपको वेब पेमेंट या पेमेंट ऐप्लिकेशन के ज़रिए पेमेंट के लेन-देन के काम करने के तरीके के बारे में नहीं पता है, तो पहले ये लेख पढ़ें:

ब्राउज़र समर्थन

वेब पेमेंट्स में कई तरह की टेक्नोलॉजी शामिल होती हैं. साथ ही, यह सुविधा काम करती है या नहीं, यह ब्राउज़र पर निर्भर करता है.

	Chromium		Safari		Firefox
	डेस्कटॉप	Android	डेस्कटॉप	मोबाइल	डेस्कटॉप/मोबाइल
Payment Request API	✔	✔	✔	✔
वेब पर काम करने वाला Payment Handler API	✔	✔
iOS/Android पेमेंट ऐप्लिकेशन	✔	✔	✔*	✔*

कोई ब्राउज़र, पेमेंट ऐप्लिकेशन का पता कैसे लगाता है

हर पेमेंट ऐप्लिकेशन को यह जानकारी देनी होगी:

यूआरएल के आधार पर पेमेंट के तरीके की पहचान करने वाला आईडी
पेमेंट के तरीके का मेनिफ़ेस्ट (सिर्फ़ तब, जब पेमेंट के तरीके का आइडेंटिफ़ायर किसी तीसरे पक्ष ने दिया हो)
वेब ऐप्लिकेशन मेनिफ़ेस्ट

डायग्राम: यूआरएल पर आधारित पेमेंट के तरीके के आइडेंटिफ़ायर से ब्राउज़र, पेमेंट ऐप्लिकेशन का पता कैसे लगाता है

कारोबारी या कंपनी के खाते की खोज की प्रोसेस तब शुरू होती है, जब कोई कारोबारी या कंपनी लेन-देन शुरू करती है:

ब्राउज़र, पेमेंट के तरीके की पहचान करने वाले यूआरएल को अनुरोध भेजता है और पेमेंट के तरीके का मेनिफ़ेस्ट फ़ेच करता है.
ब्राउज़र, पेमेंट के तरीके के मेनिफ़ेस्ट से वेब ऐप्लिकेशन के मेनिफ़ेस्ट का यूआरएल तय करता है और वेब ऐप्लिकेशन के मेनिफ़ेस्ट को फ़ेच करता है.
ब्राउज़र यह तय करता है कि वेब ऐप्लिकेशन मेनिफ़ेस्ट से, ओएस पेमेंट ऐप्लिकेशन या वेब पर आधारित पेमेंट ऐप्लिकेशन को लॉन्च करना है या नहीं.

अगले सेक्शन में, पेमेंट का तरीका सेट अप करने के बारे में विस्तार से बताया गया है, ताकि ब्राउज़र इसे ढूंढ सकें.

पहला चरण: पेमेंट के तरीके का आइडेंटिफ़ायर देना

पेमेंट के तरीके का आइडेंटिफ़ायर, यूआरएल पर आधारित स्ट्रिंग होती है. उदाहरण के लिए, Google Pay का आइडेंटिफ़ायर https://google.com/pay है. पेमेंट ऐप्लिकेशन के डेवलपर, किसी भी यूआरएल को पेमेंट के तरीके के आइडेंटिफ़ायर के तौर पर चुन सकते हैं. हालांकि, इसके लिए ज़रूरी है कि उनके पास उस यूआरएल का कंट्रोल हो. साथ ही, वे उस पर कोई भी कॉन्टेंट और एचटीटीपी हेडर दिखा सकें. इस लेख में, हम पेमेंट के तरीके के आइडेंटिफ़ायर के तौर पर https://bobbucks.dev/pay का इस्तेमाल करेंगे.

कारोबारी या कंपनियां, पेमेंट के तरीके के आइडेंटिफ़ायर का इस्तेमाल कैसे करती हैं

PaymentRequest ऑब्जेक्ट को पेमेंट के तरीके के आइडेंटिफ़ायर की सूची के साथ बनाया जाता है. इससे उन पेमेंट ऐप्लिकेशन की पहचान होती है जिन्हें कारोबारी या कंपनी स्वीकार करती है. पेमेंट के तरीके के आइडेंटिफ़ायर, supportedMethods प्रॉपर्टी की वैल्यू के तौर पर सेट किए जाते हैं. उदाहरण के लिए:

[merchant] requests payment:

const request = new PaymentRequest([{
  supportedMethods: 'https://bobbucks.dev/pay'
}], {
  total: {
    label: 'total',
    amount: { value: '10', currency: 'USD' }
  }
});

दूसरा चरण: पेमेंट के तरीके का मेनिफ़ेस्ट दिखाना

पेमेंट के तरीके का मेनिफ़ेस्ट एक JSON फ़ाइल होती है. इसमें यह तय किया जाता है कि कौनसी पेमेंट ऐप्लिकेशन इस पेमेंट के तरीके का इस्तेमाल कर सकती है.

पेमेंट के तरीके का मेनिफ़ेस्ट उपलब्ध कराना

जब कोई कारोबारी या कंपनी पेमेंट का लेन-देन शुरू करती है, तो ब्राउज़र, पेमेंट के तरीके की पहचान करने वाले यूआरएल को एचटीटीपी HEAD अनुरोध भेजता है. पेमेंट के तरीके के आइडेंटिफ़ायर यूआरएल से, Link एचटीटीपी हेडर मिलता है. यह हेडर उस यूआरएल की ओर ले जाता है जहां ब्राउज़र, पेमेंट के तरीके का मेनिफ़ेस्ट फ़ेच कर सकता है.

पेमेंट के तरीके के सर्वर को इस तरह कॉन्फ़िगर करें कि वह rel="payment-method-manifest" एट्रिब्यूट और पेमेंट के तरीके के मेनिफ़ेस्ट यूआरएल के साथ, एचटीटीपी Link हेडर के तौर पर जवाब दे. उदाहरण के लिए, अगर मेनिफ़ेस्ट https://bobbucks.dev/pay/payment-manifest.json पर है, तो रिस्पॉन्स हेडर में यह शामिल होगा:

Link: <https://bobbucks.dev/pay/payment-manifest.json>; rel="payment-method-manifest"

यूआरएल, पूरी तरह से क्वालिफ़ाइड डोमेन नेम या रिलेटिव पाथ हो सकता है. उदाहरण देखने के लिए, नेटवर्क ट्रैफ़िक के लिए https://bobbucks.dev/pay देखें. curl कमांड का भी इस्तेमाल किया जा सकता है:

curl --include https://bobbucks.dev/pay

इसके बाद, ब्राउज़र, पेमेंट के तरीके के मेनिफ़ेस्ट यूआरएल पर एचटीटीपी GET अनुरोध भेजता है. सर्वर, पेमेंट के तरीके के मेनिफ़ेस्ट की बॉडी के साथ जवाब देता है.

पेमेंट के तरीके के मेनिफ़ेस्ट में दो फ़ील्ड होते हैं, default_applications और supported_origins.

पेमेंट के तरीके के मेनिफ़ेस्ट फ़ील्ड
प्रॉपर्टी का नाम	ब्यौरा
`default_applications` (ज़रूरी)	यूआरएल का ऐसा कलेक्शन जो उन वेब ऐप्लिकेशन मेनिफ़ेस्ट की ओर ले जाता है जहां पेमेंट ऐप्लिकेशन होस्ट किए जाते हैं. (यूआरएल रिलेटिव हो सकता है). इस ऐरे में, डेवलपमेंट मेनिफ़ेस्ट, प्रोडक्शन मेनिफ़ेस्ट वगैरह का रेफ़रंस होना चाहिए.
`supported_origins`	यूआरएल का ऐसा कलेक्शन जो उन ऑरिजिन की ओर ले जाता है जो तीसरे पक्ष के ऐसे पेमेंट ऐप्लिकेशन होस्ट कर सकते हैं जो पेमेंट के एक ही तरीके का इस्तेमाल करते हैं. ध्यान दें कि पेमेंट के किसी तरीके को कई पेमेंट ऐप्लिकेशन लागू कर सकते हैं.

पेमेंट के तरीके की मेनिफ़ेस्ट फ़ाइल ऐसी दिखनी चाहिए:

[payment handler] /payment-manifest.json:

{
  "default_applications": ["https://bobbucks.dev/manifest.json"],
  "supported_origins": [
    "https://alicepay.friendsofalice.example"
  ]
}

जब ब्राउज़र default_applications फ़ील्ड को पढ़ता है, तो उसे पेमेंट की सुविधा देने वाले ऐप्लिकेशन के वेब ऐप्लिकेशन मेनिफ़ेस्ट के लिंक की सूची मिलती है.

तीसरा चरण: वेब ऐप्लिकेशन मेनिफ़ेस्ट दिखाना

वेब ऐप्लिकेशन मेनिफ़ेस्ट का इस्तेमाल, वेब ऐप्लिकेशन को तय करने के लिए किया जाता है. यह एक ऐसी मेनिफ़ेस्ट फ़ाइल है जिसका इस्तेमाल बड़े पैमाने पर किया जाता है. इसका इस्तेमाल प्रोग्रेसिव वेब ऐप्लिकेशन (PWA) को तय करने के लिए किया जाता है.

सामान्य वेब ऐप्लिकेशन मेनिफ़ेस्ट कुछ ऐसा दिखेगा:

[payment handler] /manifest.json:

{
  "name": "Pay with Bobpay",
  "short_name": "Bobpay",
  "description": "This is an example of the Payment Handler API.",
  "icons": [
    {
      "src": "images/manifest/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "images/manifest/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "serviceworker": {
    "src": "service-worker.js",
    "scope": "/",
    "use_cache": false
  },
  "start_url": "/",
  "display": "standalone",
  "theme_color": "#3f51b5",
  "background_color": "#3f51b5",
  "related_applications": [
    {
      "platform": "play",
      "id": "com.example.android.samplepay",
      "min_version": "1",
      "fingerprints": [
        {
          "type": "sha256_cert",
          "value": "4C:FC:14:C6:97:DE:66:4E:66:97:50:C0:24:CE:5F:27:00:92:EE:F3:7F:18:B3:DA:77:66:84:CD:9D:E9:D2:CB"
        }
      ]
    }
  ]
}

वेब ऐप्लिकेशन मेनिफ़ेस्ट में दी गई जानकारी का इस्तेमाल यह तय करने के लिए भी किया जाता है कि पेमेंट अनुरोध के यूज़र इंटरफ़ेस (यूआई) में पेमेंट ऐप्लिकेशन कैसा दिखेगा.

वेब ऐप्लिकेशन मेनिफ़ेस्ट के ज़रूरी फ़ील्ड
प्रॉपर्टी का नाम	ब्यौरा
`name` (ज़रूरी)	इसका इस्तेमाल पेमेंट ऐप्लिकेशन के नाम के तौर पर किया जाता है.
`icons` (ज़रूरी)	इसका इस्तेमाल पेमेंट ऐप्लिकेशन के आइकॉन के तौर पर किया जाता है. इन आइकॉन का इस्तेमाल सिर्फ़ Chrome करता है. अगर आपने पेमेंट के तरीके के तौर पर इन्हें नहीं चुना है, तो अन्य ब्राउज़र इन्हें फ़ॉलबैक आइकॉन के तौर पर इस्तेमाल कर सकते हैं.
`serviceworker`	इस कुकी का इस्तेमाल, वेब पर आधारित पेमेंट ऐप्लिकेशन के तौर पर काम करने वाले सर्विस वर्कर का पता लगाने के लिए किया जाता है.
`serviceworker.src`	वह यूआरएल जहां से सर्विस वर्कर स्क्रिप्ट डाउनलोड की जा सकती है.
`serviceworker.scope`	यह एक स्ट्रिंग होती है, जो ऐसे यूआरएल को दिखाती है जो सर्विस वर्कर के रजिस्ट्रेशन स्कोप को तय करता है.
`serviceworker.use_cache`	वह यूआरएल जहां से सर्विस वर्कर स्क्रिप्ट डाउनलोड की जा सकती है.
`related_applications`	इस कुकी का इस्तेमाल, ओएस के ज़रिए उपलब्ध कराए गए पेमेंट ऐप्लिकेशन के तौर पर काम करने वाले ऐप्लिकेशन का पता लगाने के लिए किया जाता है. ज़्यादा जानकारी के लिए, Android पेमेंट ऐप्लिकेशन के लिए डेवलपर गाइड पर जाएं.
`prefer_related_applications`	इस कुकी का इस्तेमाल यह तय करने के लिए किया जाता है कि ओएस की ओर से उपलब्ध कराए गए पेमेंट ऐप्लिकेशन और वेब पर आधारित पेमेंट ऐप्लिकेशन, दोनों के उपलब्ध होने पर कौनसा पेमेंट ऐप्लिकेशन लॉन्च किया जाए.

वेब ऐप्लिकेशन मेनिफ़ेस्ट की name प्रॉपर्टी का इस्तेमाल, पेमेंट ऐप्लिकेशन के नाम के तौर पर किया जाता है. साथ ही, icons प्रॉपर्टी का इस्तेमाल, पेमेंट ऐप्लिकेशन के आइकॉन के तौर पर किया जाता है.

Chrome यह कैसे तय करता है कि कौनसे पेमेंट ऐप्लिकेशन को लॉन्च करना है

किसी प्लैटफ़ॉर्म के लिए पेमेंट ऐप्लिकेशन लॉन्च करना

किसी प्लैटफ़ॉर्म के लिए पेमेंट ऐप्लिकेशन लॉन्च करने के लिए, ये शर्तें पूरी करना ज़रूरी है:

related_applications फ़ील्ड, वेब ऐप्लिकेशन मेनिफ़ेस्ट में दिया गया है और:
- इंस्टॉल किए गए ऐप्लिकेशन का पैकेज आईडी और हस्ताक्षर मेल खाते हों. साथ ही, वेब ऐप्लिकेशन के मेनिफ़ेस्ट में मौजूद कम से कम वर्शन (min_version), इंस्टॉल किए गए ऐप्लिकेशन के वर्शन के बराबर या उससे कम हो.
prefer_related_applications फ़ील्ड true है.
प्लैटफ़ॉर्म के हिसाब से पेमेंट ऐप्लिकेशन इंस्टॉल किया गया हो और उसमें:
- org.chromium.action.PAY का इंटेंट फ़िल्टर.
- पेमेंट के तरीके का आइडेंटिफ़ायर, जिसे org.chromium.default_payment_method_name प्रॉपर्टी की वैल्यू के तौर पर तय किया गया है.

इन्हें सेट अप करने के तरीके के बारे में ज़्यादा जानने के लिए, Android पेमेंट ऐप्लिकेशन: डेवलपर गाइड देखें.

[payment handler] /manifest.json

"prefer_related_applications": true,
"related_applications": [{
  "platform": "play",
  "id": "xyz.bobpay.app",
  "min_version": "1",
  "fingerprints": [{
    "type": "sha256_cert",
    "value": "92:5A:39:05:C5:B9:EA:BC:71:48:5F:F2:05:0A:1E:57:5F:23:40:E9:E3:87:14:EC:6D:A2:04:21:E0:FD:3B:D1"
  }]
}]

अगर ब्राउज़र को यह पता चलता है कि प्लैटफ़ॉर्म के हिसाब से पेमेंट ऐप्लिकेशन उपलब्ध है, तो यहां डिस्कवरी फ़्लो बंद हो जाता है. अगर ऐसा नहीं होता है, तो यह अगले चरण पर चला जाता है. यानी, वेब पर काम करने वाले पेमेंट ऐप्लिकेशन को लॉन्च करना.

वेब पर काम करने वाले पेमेंट ऐप्लिकेशन को लॉन्च करना

वेब पर आधारित पेमेंट ऐप्लिकेशन को वेब ऐप्लिकेशन मेनिफ़ेस्ट के serviceworker फ़ील्ड में बताया जाना चाहिए.

[payment handler] /manifest.json:

"serviceworker": {
  "src": "payment-handler.js"
}

ब्राउज़र, वेब पर आधारित पेमेंट ऐप्लिकेशन लॉन्च करता है. इसके लिए, वह सर्विस वर्कर को paymentrequest इवेंट भेजता है. सर्विस वर्कर को पहले से रजिस्टर करने की ज़रूरत नहीं है. इसे तुरंत रजिस्टर किया जा सकता है.

खास ऑप्टिमाइज़ेशन के बारे में जानकारी

ब्राउज़र, पेमेंट के अनुरोध वाले यूज़र इंटरफ़ेस (यूआई) को कैसे स्किप कर सकते हैं और सीधे पेमेंट ऐप्लिकेशन को लॉन्च कर सकते हैं

Chrome में, जब show() PaymentRequest का तरीका इस्तेमाल किया जाता है, तब PaymentRequest API, ब्राउज़र की ओर से उपलब्ध कराया गया यूज़र इंटरफ़ेस (यूआई) दिखाता है. इसे "पेमेंट का अनुरोध करने वाला यूज़र इंटरफ़ेस (यूआई)" कहा जाता है. इस यूज़र इंटरफ़ेस (यूआई) की मदद से, उपयोगकर्ता पेमेंट ऐप्लिकेशन चुन सकते हैं. पेमेंट के अनुरोध वाले यूज़र इंटरफ़ेस (यूआई) में मौजूद जारी रखें बटन दबाने के बाद, चुना गया पेमेंट ऐप्लिकेशन लॉन्च हो जाता है.

पेमेंट ऐप्लिकेशन लॉन्च करने से पहले, पेमेंट का अनुरोध करने वाला यूज़र इंटरफ़ेस (यूआई) दिखता है.

पेमेंट ऐप्लिकेशन लॉन्च करने से पहले पेमेंट का अनुरोध करने वाले यूज़र इंटरफ़ेस (यूआई) को दिखाने से, उपयोगकर्ता को पेमेंट पूरा करने के लिए ज़्यादा चरणों से गुज़रना पड़ता है. इस प्रोसेस को ऑप्टिमाइज़ करने के लिए, ब्राउज़र उस जानकारी को पेमेंट ऐप्लिकेशन को सौंप सकता है. साथ ही, show() को कॉल किए जाने पर, पेमेंट रिक्वेस्ट यूज़र इंटरफ़ेस (यूआई) दिखाए बिना सीधे पेमेंट ऐप्लिकेशन को लॉन्च कर सकता है.

पेमेंट के अनुरोध वाले यूज़र इंटरफ़ेस (यूआई) को स्किप करें और सीधे पेमेंट ऐप्लिकेशन लॉन्च करें.

पेमेंट ऐप्लिकेशन को सीधे तौर पर लॉन्च करने के लिए, ये शर्तें पूरी होनी चाहिए:

show() को उपयोगकर्ता के जेस्चर (उदाहरण के लिए, माउस क्लिक) से ट्रिगर किया जाता है.
सिर्फ़ एक पेमेंट ऐप्लिकेशन है, जो:
- यह अनुरोध किए गए पेमेंट के तरीके के आइडेंटिफ़ायर के साथ काम करता है.

वेब पर आधारित पेमेंट ऐप्लिकेशन को जस्ट-इन-टाइम (जेआईटी) के तौर पर कब रजिस्टर किया जाता है?

वेब पर आधारित पेमेंट ऐप्लिकेशन को लॉन्च करने के लिए, उपयोगकर्ता को पेमेंट ऐप्लिकेशन की वेबसाइट पर पहले से जाने और सर्विस वर्कर को रजिस्टर करने की ज़रूरत नहीं होती. जब उपयोगकर्ता वेब पर आधारित पेमेंट ऐप्लिकेशन से पेमेंट करने का विकल्प चुनता है, तब सर्विस वर्कर को तुरंत रजिस्टर किया जा सकता है. रजिस्ट्रेशन के समय के लिए दो विकल्प उपलब्ध हैं:

अगर उपयोगकर्ता को पेमेंट का अनुरोध करने वाला यूज़र इंटरफ़ेस (यूआई) दिखाया जाता है, तो ऐप्लिकेशन को तुरंत रजिस्टर किया जाता है. साथ ही, जब उपयोगकर्ता जारी रखें पर क्लिक करता है, तब इसे लॉन्च किया जाता है.
अगर पेमेंट के अनुरोध वाले यूज़र इंटरफ़ेस (यूआई) को स्किप किया जाता है, तो पेमेंट ऐप्लिकेशन को तुरंत रजिस्टर किया जाता है और सीधे लॉन्च किया जाता है. पेमेंट का अनुरोध करने वाले यूज़र इंटरफ़ेस (यूआई) को स्किप करके, तुरंत रजिस्टर किए गए ऐप्लिकेशन को लॉन्च करने के लिए, उपयोगकर्ता के जेस्चर की ज़रूरत होती है. इससे, अलग-अलग ऑरिजिन के सर्विस वर्कर के अनचाहे रजिस्ट्रेशन को रोका जा सकता है.

अगले चरण

अब जब आपका पेमेंट ऐप्लिकेशन खोजा जा सकता है, तो प्लैटफ़ॉर्म के हिसाब से पेमेंट ऐप्लिकेशन और वेब पर काम करने वाला पेमेंट ऐप्लिकेशन बनाने का तरीका जानें.