{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-guides/sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":["cards","card"]},"type":"markdown"},"seo":{"title":"Google Pay","description":"Shift4 Payment Platform REST API."},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"google-pay","__idx":0},"children":["Google Pay"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Google Pay is triggered via a wallet button component: shift4.js renders the official Google Pay button. There is no ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["continue()"]}," call — the payment flow starts when the customer taps the button, and the customer's email (and, when the Checkout Session collects them, billing/shipping addresses) is extracted from the wallet response automatically."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"requirements","__idx":1},"children":["Requirements"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"business-eligibility","__idx":2},"children":["Business eligibility"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Google restricts certain business categories — see the ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"https://payments.developers.google.com/terms/aup"},"children":["Google Pay Acceptable Use Policy"]},". If your merchant category code falls into one, the wallet is suppressed and no button is shown."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"content-security-policy","__idx":3},"children":["Content Security Policy"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["In addition to the ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/core-concepts/checkout/payment-components#content-security-policy"},"children":["baseline Payment components policy"]},", Google Pay needs Google's script and frame allowed:"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"header":{"controls":{"copy":{}}},"source":"script-src https://pay.google.com\nframe-src  https://pay.google.com\n"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"3d-secure","__idx":4},"children":["3D Secure"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["3D Secure runs automatically whenever it is needed. If the token returned by the wallet already carries strong authentication data, no additional verification takes place; otherwise the verification step happens automatically after the wallet returns its token. Either way, there is nothing for you to trigger or handle."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"example","__idx":5},"children":["Example"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"html","header":{"controls":{"copy":{}}},"source":"<script src=\"https://js.shift4.com/v1/shift4.js\"></script>\n\n<div id=\"google-pay-button\"></div>\n<div id=\"result\"></div>\n<div id=\"error\"></div>\n\n<script>\n  (async function () {\n    var shift4 = Shift4('pk_sandbox_XXXXXXXXXXXXXXXXXXXX');\n    var checkout = await shift4.createCheckout('{{clientSecret}}');\n\n    checkout.addEventListener('checkout_session.succeeded', function () {\n      document.getElementById('result').textContent = 'Payment successful';\n    });\n    checkout.addEventListener('payment.failed', function (event) {\n      document.getElementById('error').textContent = event.error.message;\n    });\n\n    checkout.createComponent('google-pay-button').mount('#google-pay-button');\n  })();\n</script>\n","lang":"html"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"if-the-customer-dismisses-the-sheet","__idx":6},"children":["If the customer dismisses the sheet"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The wallet SDK manages its own confirmation sheet. If the customer dismisses it without authorising, no payment is initiated and no event fires — the checkout stays mounted and they can try again. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/core-concepts/checkout/payment-components/events-and-errors"},"children":["Events & error handling"]}," for the full interruption matrix."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"next-steps","__idx":7},"children":["Next steps"]},{"$$mdtype":"Tag","name":"Cards","attributes":{"columns":3,"cardMinWidth":240},"children":[{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Apple Pay","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/guides/core-concepts/checkout/payment-components/apple-pay"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Add the Apple Pay button — requirements and example."]}]},{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Events & error handling","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/guides/core-concepts/checkout/payment-components/events-and-errors"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The event model and how to handle interruptions and failures."]}]},{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Confirm the payment","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/guides/core-concepts/checkout/confirm-payment"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Verify the Checkout Session server-side before you fulfil."]}]}]}]},"headings":[{"value":"Google Pay","id":"google-pay","depth":1},{"value":"Requirements","id":"requirements","depth":2},{"value":"Business eligibility","id":"business-eligibility","depth":3},{"value":"Content Security Policy","id":"content-security-policy","depth":3},{"value":"3D Secure","id":"3d-secure","depth":2},{"value":"Example","id":"example","depth":2},{"value":"If the customer dismisses the sheet","id":"if-the-customer-dismisses-the-sheet","depth":2},{"value":"Next steps","id":"next-steps","depth":2}],"frontmatter":{"title":"Google Pay","description":"Add a Google Pay button with Payment components — business eligibility, the CSP entries it needs, automatic 3D Secure, and the mount-and-listen example.","markdown":{"lastUpdatedBlock":{"hide":true}},"seo":{"title":"Google Pay"}},"lastModified":"2026-10-08T08:30:07.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/guides/core-concepts/checkout/payment-components/google-pay","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}