Antom Demo Auto Debit

"use strict"; const {jsx: _jsx, jsxs: _jsxs} = arguments[0]; function _createMdxContent(props) { const _components = { p: "p", ...props.components }, {AntomChannelFilterV2, AntomChunk, AntomCommand, AntomCondition, AntomDownloadBtn, AntomFile, AntomIntegrationBuilder, AntomPartial, AntomStep, AntomStepSection, Heading, InlineContent, Link, MdxDocument, Paragraph, Quote, Spacer, Tab, TabGroup, Text} = _components; if (!AntomChannelFilterV2) _missingMdxReference("AntomChannelFilterV2", true); if (!AntomChunk) _missingMdxReference("AntomChunk", true); if (!AntomCommand) _missingMdxReference("AntomCommand", true); if (!AntomCondition) _missingMdxReference("AntomCondition", true); if (!AntomDownloadBtn) _missingMdxReference("AntomDownloadBtn", true); if (!AntomFile) _missingMdxReference("AntomFile", true); if (!AntomIntegrationBuilder) _missingMdxReference("AntomIntegrationBuilder", true); if (!AntomPartial) _missingMdxReference("AntomPartial", true); if (!AntomStep) _missingMdxReference("AntomStep", true); if (!AntomStepSection) _missingMdxReference("AntomStepSection", true); if (!Heading) _missingMdxReference("Heading", true); if (!InlineContent) _missingMdxReference("InlineContent", true); if (!Link) _missingMdxReference("Link", true); if (!MdxDocument) _missingMdxReference("MdxDocument", true); if (!Paragraph) _missingMdxReference("Paragraph", true); if (!Quote) _missingMdxReference("Quote", true); if (!Spacer) _missingMdxReference("Spacer", true); if (!Tab) _missingMdxReference("Tab", true); if (!TabGroup) _missingMdxReference("TabGroup", true); if (!Text) _missingMdxReference("Text", true); return _jsx(MdxDocument, { children: _jsx("div", { className: "idocs-mdx-document-zh", children: _jsxs(AntomIntegrationBuilder, { channelFilter: _jsx(AntomChannelFilterV2, { data: [{ label: 'Integration Types:', key: 'integration_type', value: ['API'] }, { label: 'Platforms:', key: 'platform', value: ['Web', 'iOS', 'Android'] }, { label: 'Clients:', key: 'client', value: [{ when: { integration_type: 'API', platform: 'Web' }, value: ['HTML'] }, { when: { integration_type: 'SDK', platform: 'Web' }, value: ['HTML', 'React', 'Vue'] }, { when: { platform: 'iOS' }, value: ['Objective-C'] }, { when: { platform: 'Android' }, value: ['Java'] }, { when: {}, value: ['HTML', 'React', 'Vue', 'Java', 'Objective-C'] }] }, { label: 'Servers:', key: 'server', value: ['Java', 'Python', 'PHP', 'Go', '.NET'] }] }), downloadFileName: 'antom-auto-debit-sample.zip', children: [_jsxs(AntomCondition, { when: { integration_type: 'API' }, children: [_jsx(Paragraph, { children: _jsx(_components.p, { children: "Create a smooth online automatic deduction process by using Antom’s Tokenized Payment product. Antom provides client and server-side sample code for API-only integration, helping you easily build a payment experience that accepts various payment methods." }) }), _jsx(AntomDownloadBtn, {})] }), _jsxs(AntomCondition, { when: { integration_type: 'SDK' }, children: [_jsx(Paragraph, { children: _jsx(_components.p, { children: "Create a smooth online automatic deduction process by using Antom’s Tokenized Payment product. Antom provides client and server-side sample code for SDK integration, helping you easily build a payment experience that accepts various payment methods." }) }), _jsx(AntomDownloadBtn, {})] }), _jsx(AntomStepSection, { number: 1, title: 'Set up the server' }), _jsxs(AntomStep, { id: 'install-antom-librar', when: { server: 'Java' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `install-antom-library`, children: _jsx(_components.p, { children: "Install the Antom Java library" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsx(_components.p, { children: "To import the Antom Java library, add the dependency to your" }), _jsx(Text, { isItatic: true, children: _jsxs(_components.p, { children: [_jsx(Spacer, { len: 1 }), "pom.xml", _jsx(Spacer, { len: 1 })] }) }), _jsx(_components.p, { children: "file. You can find the latest_version on" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-java', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub"] }) }), _jsx(_components.p, { children: "." })] }), _jsx(AntomCommand, { text: ` com.alipay.global.sdk global-open-sdk-java {latest_version} `, type: `copy` })] }), _jsx(Tab, { id: `github`, title: `GitHub`, children: _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "You can also download the source code directly from" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-java', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "to install the Antom Java library." })] }) })] })] }), _jsxs(AntomStep, { id: 'install-antom-library', when: { server: 'Python' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `install-antom-library`, children: _jsx(_components.p, { children: "Install the Antom Python library" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsxs(_components.p, { children: ["To import the Antom Python library, add the dependency to your", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "requirements.txt" }), _jsx(Spacer, { len: 1 }), "file. You can find the latest version on"] }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-python', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub"] }) }), _jsx(_components.p, { children: "." })] }), _jsx(AntomCommand, { text: `global-open-sdk-python=={latest_version}`, type: `copy` })] }), _jsx(Tab, { id: `github`, title: `GitHub`, children: _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "You can also download the source code directly from" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-python', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "to install the Antom Python library." })] }) })] })] }), _jsxs(AntomStep, { id: 'install-antom-library', when: { server: 'PHP' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `install-antom-library`, children: _jsx(_components.p, { children: "Install the Antom PHP library" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsxs(_components.p, { children: ["To import the Antom PHP library, add the dependency to your", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "composer.json" }), _jsx(Spacer, { len: 1 }), "file. You can find the latest version on"] }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-php', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub"] }) }), _jsx(_components.p, { children: "." })] }), _jsx(AntomCommand, { text: `{ "require": { "antom/global-open-sdk-php": "{latest_version}" } }`, type: `copy` })] }), _jsx(Tab, { id: `github`, title: `GitHub`, children: _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "You can also download the source code directly from" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-php', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "to install the Antom PHP library." })] }) })] })] }), _jsxs(AntomStep, { id: 'install-antom-library', when: { server: 'Go' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `install-antom-library`, children: _jsx(_components.p, { children: "Install the Antom Go library" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsxs(_components.p, { children: ["To import the Antom Go library, add the dependency to your", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "go.mod" }), _jsx(Spacer, { len: 1 }), "file. You can find the latest version on"] }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-go', target: "_blank", children: _jsxs(_components.p, { children: [' ', " GitHub"] }) }), _jsx(_components.p, { children: "." })] }), _jsx(AntomCommand, { text: `require ( github.com/alipay/global-open-sdk-go v{latest_version} )`, type: `copy` })] }), _jsx(Tab, { id: `github`, title: `GitHub`, children: _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "You can also download the source code directly from" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-go', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "to install the Antom Go library." })] }) })] })] }), _jsxs(AntomStep, { id: 'install-antom-library', when: { server: '.NET' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `install-antom-library`, children: _jsx(_components.p, { children: "Install the Antom .NET library" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsxs(_components.p, { children: ["To import the Antom .NET library, add the dependency to your", _jsx(Spacer, { len: 1 }), _jsx("i", { children: ".csproj" }), _jsx(Spacer, { len: 1 }), "file. You can find the latest version on"] }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-dotnet', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub"] }) }), _jsx(_components.p, { children: "." })] }), _jsx(AntomCommand, { text: ` `, type: `copy` })] }), _jsx(Tab, { id: `github`, title: `GitHub`, children: _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "You can also download the source code directly from" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-dotnet', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "to install the Antom .NET library." })] }) })] })] }), _jsxs(AntomStep, { id: `get-integration-resources`, label: `server`, children: [_jsx(Heading, { level: 3, anchored: true, id: `get-integration-resources`, children: _jsx(_components.p, { children: "Get integration resources" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "Get integration resources from the" }), _jsx(Link, { href: ' https://dashboard.antom.com/global-payments/developers/quickStart', target: "_blank", children: _jsxs(_components.p, { children: [' ', "Developer", ' '] }) }), _jsx(_components.p, { children: "section in Antom Dashboard. Configure the obtained integration resources in your application and these resources are to be further used when sending requests to the Antom server." })] })] }), _jsxs(AntomStep, { id: `create-a-consultation-session`, label: `server`, when: { server: 'Java', integration_type: 'SDK' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `create-a-consultation-session`, children: _jsx(_components.p, { children: "Create an authorization consult session" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "Add an endpoint on your server to call the" }), _jsx(Link, { href: "https://docs.antom.com/ac/ams/session_autodebit", target: "_blank", children: _jsxs(Text, { isBold: true, children: [' ', "createPaymentSession (Tokenized Payment)", ' '] }) }), _jsx(_components.p, { children: "API. When sending the request, specify authState, paymentMethod, scopes, and other required information for this consult." })] })] }), _jsxs(AntomStep, { id: 'initiate-an-authorization-request', label: `server`, when: { integration_type: 'API' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `initiate-an-authorization-request`, children: _jsx(_components.p, { children: "Initiate an authorization consult request" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "On your server, add an endpoint to call the" }), _jsx(Link, { href: "https://docs.antom.com/ac/ams/authconsult", target: "_blank", children: _jsxs(Text, { isBold: true, children: [' ', "consult", ' '] }) }), _jsxs(_components.p, { children: ["API. When sending the request, specify", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authState" }), ",", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "customerBelongsTo" }), ",", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "scopes" }), ", and other required information for this consult."] })] })] }), _jsxs(AntomStep, { id: 'specify-the-consultation-redirection-url', label: `server`, children: [_jsx(Heading, { level: 3, anchored: true, id: `specify-the-consultation-redirection-url`, children: _jsx(_components.p, { children: "Specify the consult redirection URL" }) }), _jsx(Paragraph, { children: _jsxs(_components.p, { children: ["Set up the consult redirection URL. After completing the authorization, the buyer will be redirected to this URL, carrying", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authState" }), _jsx(Spacer, { len: 1 }), "and", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authCode" }), _jsx(Spacer, { len: 1 }), "parameters. These parameters are used for subsequent token applications."] }) })] }), _jsxs(AntomStep, { id: 'save-payment-information', label: `server`, children: [_jsx(Heading, { level: 3, anchored: true, id: `save-payment-information`, children: _jsx(_components.p, { children: "Save the payment information" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "Save the payment information that used for calling the API for subsequent payments. In actual development, you need to save the payment information to your database." }) })] }), _jsx(Heading, { level: 4, anchored: true, id: ``, children: _jsx(_components.p, { children: "Obtain the authorization result" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "You can obtain the authorization result by two ways:" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsx(Tab, { id: `redirect`, title: `Redirection URL`, children: _jsx(AntomStep, { id: 'null', label: `server`, children: _jsx(Paragraph, { children: _jsxs(_components.p, { children: ["After completing the authorization process, the buyer will be redirected to the redirection URL returned by the payment method. This URL carries", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authCode" }), _jsx(Spacer, { len: 1 }), "and", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authState" }), _jsx(Spacer, { len: 1 }), "parameters, which are used for subsequent token applications."] }) }) }) }), _jsxs(Tab, { id: `notify`, title: `Authorization notification`, children: [_jsx(AntomStep, { id: 'apply-for-the-token-and-pay2', label: `server`, when: { integration_type: 'API' }, children: _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "Add an endpoint on your server to receive authorization" }), _jsx(Link, { href: "https://docs.antom.com/ac/auto_debit/web#CQF8U", target: "_blank", children: _jsxs(_components.p, { children: [' ', "notification", ' '] }) }), _jsxs(_components.p, { children: ["from the Antom server, which includes the", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authCode" }), _jsx(Spacer, { len: 1 }), "and", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authState" }), _jsx(Spacer, { len: 1 }), "parameters for subsequent token applications."] })] }) }), _jsx(AntomStep, { id: 'apply-for-the-token-and-pay2', label: `server`, when: { server: 'Java', integration_type: 'SDK' }, children: _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "Add an endpoint on your server to receive authorization" }), _jsx(Link, { href: "https://docs.antom.com/ac/auto_debit/web#CQF8U", target: "_blank", children: _jsxs(_components.p, { children: [' ', "notification", ' '] }) }), _jsxs(_components.p, { children: ["from the Antom server, which includes the", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authCode" }), _jsx(Spacer, { len: 1 }), "and", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authState" }), _jsx(Spacer, { len: 1 }), "parameters. Automatic deduction to the buyer's account can only be achieved after obtaining", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "accessToken" }), "."] })] }) })] })] }), _jsxs(AntomStep, { id: 'apply-for-the-token-and-pay1', label: `server`, children: [_jsx(Heading, { level: 3, anchored: true, id: `apply-for-the-token-and-pay1`, children: _jsx(_components.p, { children: "Apply for the token" }) }), _jsx(AntomCondition, { when: { integration_type: 'API' }, children: _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "Add an endpoint on your server to call the" }), _jsx(Link, { href: "https://docs.antom.com/ac/ams/accesstokenapp", target: "_blank", children: _jsxs(Text, { isBold: true, children: [' ', "applyToken", ' '] }) }), _jsxs(_components.p, { children: ["API. When receiving a request token from the front end, you need to specify parameters such as", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authState" }), ",", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authCode" }), ",", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "grantType" }), ", and", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "customerBelongsTo" }), ". In actual development, please save the obtained", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "accessToken" }), _jsx(Spacer, { len: 1 }), "to your database for subsequent payments."] })] }) }), _jsx(AntomCondition, { when: { integration_type: 'SDK' }, children: _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "If you use redirection URL to get authorization results, you need to add an endpoint on the server to call the" }), _jsx(Link, { href: "https://docs.antom.com/ac/ams/accesstokenapp", target: "_blank", children: _jsxs(Text, { isBold: true, children: [' ', "applyToken", ' '] }) }), _jsxs(_components.p, { children: ["API. When receiving a request token from the front end, you need to specify parameters such as", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authState" }), ",", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "authCode" }), ",", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "grantType" }), ", and", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "customerBelongsTo" }), ". In actual development, please save the obtained", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "accessToken" }), _jsx(Spacer, { len: 1 }), "to your database for subsequent payments."] })] }) })] }), _jsxs(AntomStep, { id: 'initiate-a-payment-request', label: `server`, children: [_jsx(Heading, { level: 3, anchored: true, id: `initiate-a-payment-request`, children: _jsx(_components.p, { children: "Initiate a payment request" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "On your server, add an endpoint to call the" }), _jsx(Link, { href: "https://docs.antom.com/ac/ams/payment_agreement", target: "_blank", children: _jsxs(Text, { isBold: true, children: [' ', "pay (Tokenized Payment)", ' '] }) }), _jsxs(_components.p, { children: ["API. When sending the payment request, specify", _jsx(Spacer, { len: 1 }), _jsx("i", { children: "accessToken" }), ", payment method, payment amount, currency, payment request ID, order information, and other required information for this payment."] })] })] }), _jsxs(AntomStep, { id: `inquire-payment-result`, label: `server`, children: [_jsx(Heading, { level: 3, anchored: true, id: `inquire-payment-result`, children: _jsx(_components.p, { children: "Inquire about the payment result" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "On your server, add an endpoint to get the payment result by calling the" }), _jsx(Link, { href: "https://docs.antom.com/ac/ams/paymentri_online", target: "_blank", children: _jsxs(Text, { isBold: true, children: [' ', "inquiryPayment", ' '] }) }), _jsx(_components.p, { children: "API and display the payment result when needed." })] })] }), _jsx(AntomStepSection, { number: 2, title: 'Build a tokenized payment page on the client' }), _jsxs(AntomStep, { id: 'install-antom-sdk', when: { client: 'html', integration_type: 'SDK' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'install-antom-sdk', children: _jsx(_components.p, { children: "Install Antom SDK" }) }), _jsx(Paragraph, { children: "Install the SDK resource package via CDN:" }), _jsx(Paragraph, { children: _jsx(AntomCommand, { text: ``, type: `copy` }) }), _jsx(Paragraph, { children: _jsx(Quote, { children: _jsxs(_components.p, { children: [_jsx(Text, { isBold: true, children: "Note" }), ": The Antom SDK complies with PCI guidelines and guarantees that the user's payment information goes straight to Antom without passing through your server."] }) }) })] }), _jsxs(AntomStep, { id: 'install-antom-sdk', when: { platform: 'Web', integration_type: 'SDK' }, unless: { client: 'html' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'install-antom-sdk', children: _jsx(_components.p, { children: "Install Antom SDK" }) }), _jsx(Paragraph, { children: "Install the SDK resource package via npm:" }), _jsxs(Paragraph, { children: [_jsx(Text, { children: _jsxs(_components.p, { children: ["First, use npm to download", ' '] }) }), _jsx(InlineContent, { children: _jsx(Text, { children: _jsx(_components.p, { children: "@alipay/ams-checkout" }) }) }), _jsx(Text, { children: _jsx(_components.p, { children: "：" }) }), _jsx(AntomCommand, { text: `npm install @alipay/ams-checkout`, type: `copy` }), _jsx(_components.p, { children: "Method:" }), _jsx(AntomCommand, { text: `import { AMSCashierPayment } from '@alipay/ams-checkout';`, type: `copy` })] }), _jsx(Paragraph, { children: _jsx(Quote, { children: _jsxs(_components.p, { children: [_jsx(Text, { isBold: true, children: "Note" }), ": The Antom SDK complies with PCI guidelines and guarantees that the user's payment information goes straight to Antom without passing through your server."] }) }) })] }), _jsxs(AntomStep, { id: 'install-antom-sdk', when: { platform: 'Android', integration_type: 'SDK' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'install-antom-sdk', children: _jsx(_components.p, { children: "Integrate Antom SDK" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "Integrate the Android SDK package with Maven. For details, refer to" }), _jsx(Link, { href: "https://docs.antom.com/ac/sdks/android", target: "_blank", children: _jsxs(_components.p, { children: [' ', "Integrate the SDK Package for Android"] }) }), _jsx(_components.p, { children: "." })] }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "Add the dependencies in the" }), _jsx(Text, { isItatic: true, children: _jsxs(_components.p, { children: [_jsx(Spacer, { len: 1 }), "build.gradle", _jsx(Spacer, { len: 1 })] }) }), _jsx(_components.p, { children: "file using the code snippet below:" })] }), _jsx(AntomCommand, { text: `implementation "com.alipay.antom.sdk:payment-component:1.24.0" implementation "com.alipay.antom.sdk:securitysdk:1.0.0"`, type: `copy` })] }), _jsxs(AntomStep, { id: 'install-antom-sdk', when: { platform: 'iOS', integration_type: 'SDK' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'install-antom-sdk', children: _jsx(_components.p, { children: "Integrate Antom SDK" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "Integrate the iOS SDK package with CocoaPods. For details, refer to" }), _jsx(Link, { href: "https://docs.antom.com/ac/sdks/ios", target: "_blank", children: _jsxs(_components.p, { children: [' ', "Integrate the SDK Package for iOS"] }) }), _jsx(_components.p, { children: "." })] }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "Add the dependencies to your" }), _jsx(Text, { isItatic: true, children: _jsxs(_components.p, { children: [_jsx(Spacer, { len: 1 }), "Podfile", _jsx(Spacer, { len: 1 })] }) }), _jsx(_components.p, { children: "using the code snippet below:" })] }), _jsx(AntomCommand, { text: `source 'https://mirrors.tuna.tsinghua.edu.cn/git/CocoaPods/Specs.git' source 'https://globaltech.alipay.com/api/v1/file/common/5700989804217335/antom' platform :ios, '11.0' target 'auto_debit_sdk_objc' do use_frameworks! pod 'AMSComponent' pod 'AMSSecurity' end `, type: `copy` })] }), _jsxs(AntomStep, { id: 'build-the-autodebit-page', label: `client`, children: [_jsx(Heading, { level: 3, anchored: true, id: 'build-the-autodebit-page', children: _jsx(_components.p, { children: "Build the tokenized payment page" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "Display the payment methods that you offer to buyers on the tokenized payment page." }) })] }), _jsxs(AntomPartial, { children: [_jsxs(AntomStep, { id: 'initialize-instantiate-the-sdk', when: { integration_type: 'SDK' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'initialize-instantiate-the-sdk', children: _jsx(_components.p, { children: "Initialize and instantiate the SDK" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "Create the SDK instance and specify basic configurations." }) })] }), _jsxs(AntomStep, { id: 'get-a-consult-session', when: { integration_type: 'SDK' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'get-a-consult-session', children: _jsx(_components.p, { children: "Get a consult session" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "After the buyer selects the payment method to authorize, you send the createPaymentSession request with the corresponding payment method information to get a consult session." }) })] }), _jsxs(AntomStep, { id: 'invoke-the-sdk', when: { integration_type: 'SDK' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'invoke-the-sdk', children: _jsx(_components.p, { children: "Invoke the SDK" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "Invoke the SDK by using the consult session obtained. After being invoked, the SDK guides the buyer to authorize the specified payment method for subsequent payments." }) })] })] }), _jsxs(AntomPartial, { children: [_jsxs(AntomStep, { id: 'get-auth-continuation-link', when: { integration_type: 'API' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'get-auth-continuation-link', children: _jsx(_components.p, { children: "Get the authorization continuation URL" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "After the buyer selects the payment method to authorize, you send an authorization request with the corresponding payment method information, and then get the authorization continuation URL from the response." }) })] }), _jsxs(AntomStep, { id: 'handle-the-auth-redirection', when: { integration_type: 'API' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'handle-the-auth-redirection', children: _jsx(_components.p, { children: "Handle the authorization redirection" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "Redirect the buyer to the authorization continuation URL to complete the authorization." }) })] }), _jsxs(AntomStep, { id: 'listen-for-callback-addresses', unless: { platform: 'Web' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'listen-for-callback-addresses', children: _jsx(_components.p, { children: "Listen for authorization redirection" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "If you use the redirection URL to obtain the authorization result, the buyer will be redirected to the front-end page according to the specified authorization redirection URL after authorization. The front end needs to listen for this redirection to perform subsequent processing." }) })] })] }), _jsxs(AntomStep, { id: 'get-and-process-auth-info', label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'get-and-process-auth-info', children: _jsx(_components.p, { children: "Obtain and process authorization information" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "If you use the redirection URL to obtain the authorization result, the client needs to send the received authorization information to the server for token applications." }) })] }), _jsxs(AntomStep, { id: 'display-the-payment-result', label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'display-the-payment-result', children: _jsx(_components.p, { children: "Query the payment result" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "After obtaining the token, the back end calls the pay API directly. You can obtain payment results from the information returned by the pay API or by calling the" }), _jsx(Text, { isBold: true, children: _jsxs(_components.p, { children: [_jsx(Spacer, { len: 1 }), "inquiryPayment", _jsx(Spacer, { len: 1 })] }) }), _jsx(_components.p, { children: "API." })] })] }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/java/PaymentServer.java', when: { server: 'Java', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `java`, filename: 'src/main/java/com/antom/autodebit/api/PaymentServer.java', downloadOnly: false, steps: [`get-integration-resources`, `initiate-an-authorization-request`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`package com.antom.autodebit.api; import com.alibaba.fastjson.JSON; import com.alipay.global.api.AlipayClient; import com.alipay.global.api.DefaultAlipayClient; import com.alipay.global.api.exception.AlipayApiException; import com.alipay.global.api.model.Result; import com.alipay.global.api.model.ResultStatusType; import com.alipay.global.api.model.ams.*; import com.alipay.global.api.model.constants.EndPointConstants; import com.alipay.global.api.request.ams.auth.AlipayAuthApplyTokenRequest; import com.alipay.global.api.request.ams.auth.AlipayAuthConsultRequest; import com.alipay.global.api.request.ams.notify.AlipayAuthNotify; import com.alipay.global.api.request.ams.pay.AlipayPayQueryRequest; import com.alipay.global.api.request.ams.pay.AlipayPayRequest; import com.alipay.global.api.response.ams.auth.AlipayAuthApplyTokenResponse; import com.alipay.global.api.response.ams.auth.AlipayAuthConsultResponse; import com.alipay.global.api.response.ams.pay.AlipayPayQueryResponse; import com.alipay.global.api.response.ams.pay.AlipayPayResponse; import com.alipay.global.api.tools.WebhookTool; import lombok.Data; import org.joda.money.CurrencyUnit; import org.joda.money.Money; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; import org.springframework.http.ResponseEntity; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.CrossOrigin; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.RequestBody; import org.springframework.web.bind.annotation.ResponseBody; import javax.servlet.http.HttpServletRequest; import java.math.BigDecimal; import java.util.HashMap; import java.util.Map; import java.util.UUID; /** * sample payment server using Antom API integration mode **/ @Controller @CrossOrigin @SpringBootApplication public class PaymentServer { `] }, `server-Java-API-other1`), _jsx(AntomChunk, { language: `java`, steps: [`get-integration-resources`], chunks: [` /** * replace with your client id
* find your client id here: quickStart */ public static final String CLIENT_ID = "your_client_id"; /** * replace with your antom public key (used to verify signature)
* find your antom public key here: quickStart */ public static final String ANTOM_PUBLIC_KEY = "antom_public_key"; /** * replace with your private key (used to sign)
* please ensure the secure storage of your private key to prevent leakage */ public static final String MERCHANT_PRIVATE_KEY = "your_private_key"; private final static AlipayClient CLIENT = new DefaultAlipayClient( EndPointConstants.SG, MERCHANT_PRIVATE_KEY, ANTOM_PUBLIC_KEY, CLIENT_ID); `] }, `server-Java-API-code1`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` // Save the mapping between authState and payment information private static final HashMap authStatePayment = new HashMap<>(); // Save the mapping between authState and accessToken private static final HashMap authStateAccessToken = new HashMap<>(); public static void main(String[] args) { SpringApplication.run(PaymentServer.class, args); System.out.println("Open your browser and visit: http://localhost:8080"); } `] }, `server-Java-API-other2`), _jsx(AntomChunk, { language: `java`, steps: [`initiate-an-authorization-request`], chunks: [` @PostMapping("/authorizations/consult") public ResponseEntity authorizationConsult(@RequestBody PaymentVO payment) { AlipayAuthConsultRequest alipayAuthConsultRequest = new AlipayAuthConsultRequest(); // replace with your authState String authState = UUID.randomUUID().toString(); alipayAuthConsultRequest.setAuthState(authState); // set the target payment method for which you are requesting authorization alipayAuthConsultRequest.setCustomerBelongsTo(CustomerBelongsTo.valueOf(payment.paymentMethodType)); // set the authorization scope alipayAuthConsultRequest.setScopes(new ScopeType[]{ScopeType.AGREEMENT_PAY}); // set terminalType alipayAuthConsultRequest.setTerminalType(TerminalType.valueOf(payment.terminalType)); // set osType if (!TerminalType.WEB.equals(TerminalType.valueOf(payment.terminalType)) && payment.osType != null) { alipayAuthConsultRequest.setOsType(OsType.valueOf(payment.osType)); } `] }, `server-Java-API-code2`), _jsx(AntomChunk, { language: `java`, steps: [`specify-the-consultation-redirection-url`], chunks: [` // replace with your authRedirectUrl alipayAuthConsultRequest.setAuthRedirectUrl("http://localhost:8080/receiveAuthCode.html"); `] }, `server-Java-API-code3`), _jsx(AntomChunk, { language: `java`, steps: [`save-payment-information`], chunks: [` // save the payment information corresponding to the authState payment.setAuthState(authState); authStatePayment.put(authState, payment); `] }, `server-Java-API-code4`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` // do authorization consult AlipayAuthConsultResponse alipayAuthConsultResponse; try { long startTime = System.currentTimeMillis(); System.out.println("authorization consult request: " + JSON.toJSONString(alipayAuthConsultRequest)); alipayAuthConsultResponse = CLIENT.execute(alipayAuthConsultRequest); System.out.println("authorization consult response: " + JSON.toJSONString(alipayAuthConsultResponse)); System.out.println("authorization consult request cost time: " + (System.currentTimeMillis() - startTime) + "ms\\n"); } catch (AlipayApiException e) { // exception handling return ResponseEntity.ok().body(new ApiResponse("", authState, e)); } return ResponseEntity.ok().body(new ApiResponse("", authState, alipayAuthConsultResponse)); } `] }, `server-Java-API-other3`), _jsx(AntomChunk, { language: `java`, steps: [`apply-for-the-token-and-pay1`], chunks: [` /** * Method 1: Obtain authCode from reconstructed URL * * @param map Accept two arguments, authState and authCode * @return ResponseEntity */ @PostMapping("/authorizations/applyTokenAndPay") public ResponseEntity applyTokenAndPay(@RequestBody Map map) { String authCode = map.get("authCode"); String authState = map.get("authState"); AlipayAuthApplyTokenRequest alipayPayRequest = new AlipayAuthApplyTokenRequest(); // get payment method String paymentMethodType = authStatePayment.get(authState).getPaymentMethodType(); // set grant type alipayPayRequest.setGrantType(GrantType.AUTHORIZATION_CODE); // set the target payment method for which you are requesting authorization alipayPayRequest.setCustomerBelongsTo(CustomerBelongsTo.valueOf(paymentMethodType)); // set auth code alipayPayRequest.setAuthCode(authCode); AlipayAuthApplyTokenResponse authApplyTokenResponse; try { long startTime = System.currentTimeMillis(); System.out.println("apply token request: " + JSON.toJSONString(alipayPayRequest)); authApplyTokenResponse = CLIENT.execute(alipayPayRequest); System.out.println("apply token request: " + JSON.toJSONString(authApplyTokenResponse)); System.out.println("apply token request cost time: " + (System.currentTimeMillis() - startTime) + "ms\\n"); } catch (AlipayApiException e) { return ResponseEntity.ok().body(new ApiResponse("", authState, e)); } // save accessToken(in practice, accessToken should be saved to a database, and you should save a mapping between the authState and the user's payment method) authStateAccessToken.put(authState, authApplyTokenResponse.getAccessToken()); // invoke the payment method return pay(authStatePayment.get(authState)); } `] }, `server-Java-API-code5`), _jsx(AntomChunk, { language: `java`, steps: [`apply-for-the-token-and-pay2`], chunks: [` /** * Method 2: Obtain authCode from authorization notification * * @param request request * @param notifyBody notify body * @return ResponseEntity */ @PostMapping("/authorizations/receiveAuthNotify") @ResponseBody public Result receiveAuthNotify(HttpServletRequest request, @RequestBody String notifyBody) { // retrieve the required parameters from http request String requestUri = request.getRequestURI(); String requestMethod = request.getMethod(); // retrieve the required parameters from request header String requestTime = request.getHeader("request-time"); String clientId = request.getHeader("client-id"); String signature = request.getHeader("signature"); try { // verify the signature of notification boolean verifyResult = WebhookTool.checkSignature(requestUri, requestMethod, clientId, requestTime, signature, notifyBody, ANTOM_PUBLIC_KEY); if (!verifyResult) { throw new RuntimeException("Invalid notify signature"); } // deserialize the notification body AlipayAuthNotify authNotify = JSON.parseObject(notifyBody, AlipayAuthNotify.class); if (authNotify != null && "SUCCESS".equals(authNotify.getResult().getResultCode())) { // get authCode for applyToken and pay HashMap map = new HashMap<>(); map.put("authCode", authNotify.getAuthCode()); map.put("authState", authNotify.getAuthState()); // in practice, you should store a mapping between payment results and users ResponseEntity paymentResult = applyTokenAndPay(map); return Result.builder().resultCode("SUCCESS").resultMessage("success.").resultStatus(ResultStatusType.S).build(); } } catch (Exception e) { return Result.builder().resultCode("FAIL").resultMessage("fail.").resultStatus(ResultStatusType.F).build(); } return Result.builder().resultCode("SYSTEM_ERROR").resultMessage("system error.").resultStatus(ResultStatusType.F).build(); } `] }, `server-Java-API-code6`), _jsx(AntomChunk, { language: `java`, steps: [`initiate-a-payment-request`], chunks: [` @PostMapping("/payment/pay") public ResponseEntity pay(@RequestBody PaymentVO payment) { AlipayPayRequest alipayPayRequest = new AlipayPayRequest(); alipayPayRequest.setProductCode(ProductCodeType.AGREEMENT_PAYMENT); // get accessToken from authStateAccessToken String accessToken = authStateAccessToken.get(payment.authState); // replace with your paymentRequestId String paymentRequestId = UUID.randomUUID().toString(); alipayPayRequest.setPaymentRequestId(paymentRequestId); // convert amount unit(in practice, amount should be calculated on your serverside) // For details, please refer to: Usage rules of the Amount object long amountMinorLong = Money.of(CurrencyUnit.of(payment.currency), new BigDecimal(payment.amountValue)).getAmountMinorLong(); // set amount Amount amount = Amount.builder().currency(payment.currency).value(String.valueOf(amountMinorLong)).build(); alipayPayRequest.setPaymentAmount(amount); // set paymentMethod PaymentMethod paymentMethod = PaymentMethod.builder().paymentMethodType(payment.paymentMethodType).paymentMethodId(accessToken).build(); alipayPayRequest.setPaymentMethod(paymentMethod); // set buyer info Buyer buyer = Buyer.builder().referenceBuyerId("yourBuyerId").build(); // replace with your orderId String orderId = UUID.randomUUID().toString(); // set order Info Order order = Order.builder().referenceOrderId(orderId). orderDescription("antom api testing order").orderAmount(amount).buyer(buyer).build(); alipayPayRequest.setOrder(order); // replace with your notify url // or configure your notify url here: Notification URL alipayPayRequest.setPaymentNotifyUrl("http://www.yourNotifyUrl.com/payment/receivePaymentNotify"); AlipayPayResponse alipayPayResponse; try { long startTime = System.currentTimeMillis(); System.out.println("payment request: " + JSON.toJSONString(alipayPayRequest)); alipayPayResponse = CLIENT.execute(alipayPayRequest); System.out.println("payment response: " + JSON.toJSONString(alipayPayResponse)); System.out.println("payment request cost time: " + (System.currentTimeMillis() - startTime) + "ms\\n"); } catch (AlipayApiException e) { return ResponseEntity.ok().body(new ApiResponse(paymentRequestId, payment.authState, e)); } return ResponseEntity.ok().body(new ApiResponse(paymentRequestId, payment.authState, alipayPayResponse)); } `] }, `server-Java-API-code7`), _jsx(AntomChunk, { language: `java`, steps: [`inquire-payment-result`], chunks: [` @PostMapping("/payment/inquiryPayment") public ResponseEntity inquiryPayment(@RequestBody Map map) { String paymentRequestId = map.get("paymentRequestId"); AlipayPayQueryRequest alipayPayQueryRequest = new AlipayPayQueryRequest(); alipayPayQueryRequest.setPaymentRequestId(paymentRequestId); AlipayPayQueryResponse alipayPayQueryResponse; try { long startTime = System.currentTimeMillis(); System.out.println("inquiry payment request: " + JSON.toJSONString(alipayPayQueryRequest)); alipayPayQueryResponse = CLIENT.execute(alipayPayQueryRequest); System.out.println("inquiry payment response: " + JSON.toJSONString(alipayPayQueryResponse)); System.out.println("inquiry payment request cost time: " + (System.currentTimeMillis() - startTime) + "ms\\n"); } catch (AlipayApiException e) { return ResponseEntity.ok().body(new ApiResponse(paymentRequestId, "", e)); } return ResponseEntity.ok().body(new ApiResponse(paymentRequestId, "", alipayPayQueryResponse)); } `] }, `server-Java-API-code8`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` @Data public static class PaymentVO { private String amountValue; private String currency; private String paymentMethodType; private String authState; private String terminalType = "WEB"; private String osType; } @Data private static class ApiResponse { private String status = "success"; private String paymentRequestId; private String authState; private String message; private Object data; public ApiResponse(String paymentRequestId, String authState, Object data) { this.paymentRequestId = paymentRequestId; this.authState = authState; this.data = data; } public ApiResponse(String paymentRequestId, String authState, Exception e) { this.paymentRequestId = paymentRequestId; this.authState = authState; this.status = "error"; this.message = e.getMessage(); } } } `] }, `server-Java-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/java/PaymentServer.java', when: { server: 'Java', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `java`, filename: 'src/main/java/com/antom/autodebit/sdk/PaymentServer.java', downloadOnly: false, steps: [`get-integration-resources`, `create-a-consultation-session`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`package com.antom.autodebit.sdk; import com.alibaba.fastjson.JSON; import com.alipay.global.api.AlipayClient; import com.alipay.global.api.DefaultAlipayClient; import com.alipay.global.api.exception.AlipayApiException; import com.alipay.global.api.model.Result; import com.alipay.global.api.model.ResultStatusType; import com.alipay.global.api.model.ams.*; import com.alipay.global.api.model.constants.EndPointConstants; import com.alipay.global.api.request.ams.auth.AlipayAuthApplyTokenRequest; import com.alipay.global.api.request.ams.auth.AlipayAuthCreateSessionRequest; import com.alipay.global.api.request.ams.notify.AlipayAuthNotify; import com.alipay.global.api.request.ams.pay.AlipayPayQueryRequest; import com.alipay.global.api.request.ams.pay.AlipayPayRequest; import com.alipay.global.api.response.ams.auth.AlipayAuthApplyTokenResponse; import com.alipay.global.api.response.ams.auth.AlipayAuthCreateSessionResponse; import com.alipay.global.api.response.ams.pay.AlipayPayQueryResponse; import com.alipay.global.api.response.ams.pay.AlipayPayResponse; import com.alipay.global.api.tools.WebhookTool; import lombok.Data; import org.joda.money.CurrencyUnit; import org.joda.money.Money; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; import org.springframework.http.ResponseEntity; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.CrossOrigin; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.bind.annotation.RequestBody; import org.springframework.web.bind.annotation.ResponseBody; import javax.servlet.http.HttpServletRequest; import java.math.BigDecimal; import java.util.HashMap; import java.util.Map; import java.util.UUID; /** * sample payment server using Antom SDK integration mode **/ @Controller @CrossOrigin @SpringBootApplication public class PaymentServer { `] }, `server-Java-SDK-other1`), _jsx(AntomChunk, { language: `java`, steps: [`get-integration-resources`], chunks: [` /** * replace with your client id
* find your client id here: quickStart */ public static final String CLIENT_ID = "your_client_id"; /** * replace with your antom public key (used to verify signature)
* find your antom public key here: quickStart */ public static final String ANTOM_PUBLIC_KEY = "antom_public_key"; /** * replace with your private key (used to sign)
* please ensure the secure storage of your private key to prevent leakage */ public static final String MERCHANT_PRIVATE_KEY = "your_private_key"; private final static AlipayClient CLIENT = new DefaultAlipayClient( EndPointConstants.SG, MERCHANT_PRIVATE_KEY, ANTOM_PUBLIC_KEY, CLIENT_ID); `] }, `server-Java-SDK-code1`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` // Save the mapping between authState and payment information private static final HashMap authStatePayment = new HashMap<>(); // Save the mapping between authState and accessToken private static final HashMap authStateAccessToken = new HashMap<>(); public static void main(String[] args) { SpringApplication.run(PaymentServer.class, args); System.out.println("Open your browser and visit: http://localhost:8080"); } `] }, `server-Java-SDK-other2`), _jsx(AntomChunk, { language: `java`, steps: [`create-a-consultation-session`], chunks: [` @PostMapping("/authorizations/createConsultSession") public ResponseEntity createConsultSession(@RequestBody PaymentVO payment) { AlipayAuthCreateSessionRequest alipayAuthCreateSessionRequest = new AlipayAuthCreateSessionRequest(); alipayAuthCreateSessionRequest.setProductCode(ProductCodeType.AGREEMENT_PAYMENT); // set agreementInfo // replace with your authState String authState = UUID.randomUUID().toString(); AgreementInfo agreementInfo = new AgreementInfo(); agreementInfo.setAuthState(authState); alipayAuthCreateSessionRequest.setAgreementInfo(agreementInfo); // set the target payment method for which you are requesting authorization PaymentMethod paymentMethod = PaymentMethod.builder().paymentMethodType(payment.paymentMethodType).build(); alipayAuthCreateSessionRequest.setPaymentMethod(paymentMethod); // set the authorization scope alipayAuthCreateSessionRequest.setScopes(new ScopeType[]{ScopeType.AGREEMENT_PAY}); `] }, `server-Java-SDK-code2`), _jsx(AntomChunk, { language: `java`, steps: [`specify-the-consultation-redirection-url`], chunks: [` // replace with your authRedirectUrl alipayAuthCreateSessionRequest.setPaymentRedirectUrl("http://localhost:8080/receiveAuthCode"); `] }, `server-Java-SDK-code3`), _jsx(AntomChunk, { language: `java`, steps: [`save-payment-information`], chunks: [` // save the payment information corresponding to the authState payment.setAuthState(authState); authStatePayment.put(authState, payment); `] }, `server-Java-SDK-code4`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` // do authorization consult AlipayAuthCreateSessionResponse alipayAuthCreateSessionResponse; try { long startTime = System.currentTimeMillis(); System.out.println("authorization consult request: " + JSON.toJSONString(alipayAuthCreateSessionRequest)); alipayAuthCreateSessionResponse = CLIENT.execute(alipayAuthCreateSessionRequest); System.out.println("authorization consult response: " + JSON.toJSONString(alipayAuthCreateSessionResponse)); System.out.println("authorization consult request cost time: " + (System.currentTimeMillis() - startTime) + "ms\\n"); } catch (AlipayApiException e) { // exception handling return ResponseEntity.ok().body(new ApiResponse("", authState, e)); } return ResponseEntity.ok().body(new ApiResponse("", authState, alipayAuthCreateSessionResponse)); } `] }, `server-Java-SDK-other3`), _jsx(AntomChunk, { language: `java`, steps: [`apply-for-the-token-and-pay1`], chunks: [` /** * Method 1: Obtain authCode from reconstructed URL * * @param map Accept two arguments, authState and authCode * @return ResponseEntity */ @PostMapping("/authorizations/applyTokenAndPay") public ResponseEntity applyTokenAndPay(@RequestBody Map map) { String authCode = map.get("authCode"); String authState = map.get("authState"); AlipayAuthApplyTokenRequest alipayPayRequest = new AlipayAuthApplyTokenRequest(); // get payment method String paymentMethodType = authStatePayment.get(authState).getPaymentMethodType(); // set grant type alipayPayRequest.setGrantType(GrantType.AUTHORIZATION_CODE); // set the target payment method for which you are requesting authorization alipayPayRequest.setCustomerBelongsTo(CustomerBelongsTo.valueOf(paymentMethodType)); // set auth code alipayPayRequest.setAuthCode(authCode); AlipayAuthApplyTokenResponse authApplyTokenResponse; try { long startTime = System.currentTimeMillis(); System.out.println("apply token request: " + JSON.toJSONString(alipayPayRequest)); authApplyTokenResponse = CLIENT.execute(alipayPayRequest); System.out.println("apply token request: " + JSON.toJSONString(authApplyTokenResponse)); System.out.println("apply token request cost time: " + (System.currentTimeMillis() - startTime) + "ms\\n"); } catch (AlipayApiException e) { return ResponseEntity.ok().body(new ApiResponse("", authState, e)); } // save accessToken(in practice, accessToken should be saved to a database, and you should save a mapping between the authState and the user's payment method) authStateAccessToken.put(authState, authApplyTokenResponse.getAccessToken()); // invoke the payment method return pay(authStatePayment.get(authState)); } `] }, `server-Java-SDK-code5`), _jsx(AntomChunk, { language: `java`, steps: [`apply-for-the-token-and-pay2`], chunks: [` /** * Method 2: Obtain authCode from authorization notification * * @param request request * @param notifyBody notify body * @return ResponseEntity */ @PostMapping("/authorizations/receiveAuthNotify") @ResponseBody public Result receiveAuthNotify(HttpServletRequest request, @RequestBody String notifyBody) { // retrieve the required parameters from http request String requestUri = request.getRequestURI(); String requestMethod = request.getMethod(); // retrieve the required parameters from request header String requestTime = request.getHeader("request-time"); String clientId = request.getHeader("client-id"); String signature = request.getHeader("signature"); try { // verify the signature of notification boolean verifyResult = WebhookTool.checkSignature(requestUri, requestMethod, clientId, requestTime, signature, notifyBody, ANTOM_PUBLIC_KEY); if (!verifyResult) { throw new RuntimeException("Invalid notify signature"); } // deserialize the notification body AlipayAuthNotify authNotify = JSON.parseObject(notifyBody, AlipayAuthNotify.class); if (authNotify != null && "SUCCESS".equals(authNotify.getResult().getResultCode())) { // save accessToken(in practice, accessToken should be saved to a database, and you should save a mapping between the authState and the user's payment method) authStateAccessToken.put(authNotify.getAuthState(), authNotify.getAccessToken()); // in practice, you should store a mapping between payment results and users ResponseEntity paymentResult = pay(authStatePayment.get(authNotify.getAuthState())); return Result.builder().resultCode("SUCCESS").resultMessage("success.").resultStatus(ResultStatusType.S).build(); } } catch (Exception e) { return Result.builder().resultCode("FAIL").resultMessage("fail.").resultStatus(ResultStatusType.F).build(); } return Result.builder().resultCode("SYSTEM_ERROR").resultMessage("system error.").resultStatus(ResultStatusType.F).build(); } `] }, `server-Java-SDK-code6`), _jsx(AntomChunk, { language: `java`, steps: [`initiate-a-payment-request`], chunks: [` @PostMapping("/payment/pay") public ResponseEntity pay(@RequestBody PaymentVO payment) { AlipayPayRequest alipayPayRequest = new AlipayPayRequest(); alipayPayRequest.setProductCode(ProductCodeType.AGREEMENT_PAYMENT); // get accessToken from authStateAccessToken String accessToken = authStateAccessToken.get(payment.authState); // replace with your paymentRequestId String paymentRequestId = UUID.randomUUID().toString(); alipayPayRequest.setPaymentRequestId(paymentRequestId); // convert amount unit(in practice, amount should be calculated on your serverside) // For details, please refer to: Usage rules of the Amount object long amountMinorLong = Money.of(CurrencyUnit.of(payment.currency), new BigDecimal(payment.amountValue)).getAmountMinorLong(); // set amount Amount amount = Amount.builder().currency(payment.currency).value(String.valueOf(amountMinorLong)).build(); alipayPayRequest.setPaymentAmount(amount); // set paymentMethod PaymentMethod paymentMethod = PaymentMethod.builder().paymentMethodType(payment.paymentMethodType).paymentMethodId(accessToken).build(); alipayPayRequest.setPaymentMethod(paymentMethod); // set buyer info Buyer buyer = Buyer.builder().referenceBuyerId("yourBuyerId").build(); // replace with your orderId String orderId = UUID.randomUUID().toString(); // set order Info Order order = Order.builder().referenceOrderId(orderId). orderDescription("antom sdk testing order").orderAmount(amount).buyer(buyer).build(); alipayPayRequest.setOrder(order); // replace with your notify url // or configure your notify url here: Notification URL alipayPayRequest.setPaymentNotifyUrl("http://www.yourNotifyUrl.com/payment/receivePaymentNotify"); AlipayPayResponse alipayPayResponse; try { long startTime = System.currentTimeMillis(); System.out.println("payment request: " + JSON.toJSONString(alipayPayRequest)); alipayPayResponse = CLIENT.execute(alipayPayRequest); System.out.println("payment response: " + JSON.toJSONString(alipayPayResponse)); System.out.println("payment request cost time: " + (System.currentTimeMillis() - startTime) + "ms\\n"); } catch (AlipayApiException e) { return ResponseEntity.ok().body(new ApiResponse(paymentRequestId, payment.authState, e)); } return ResponseEntity.ok().body(new ApiResponse(paymentRequestId, payment.authState, alipayPayResponse)); } `] }, `server-Java-SDK-code7`), _jsx(AntomChunk, { language: `java`, steps: [`inquire-payment-result`], chunks: [` @PostMapping("/payment/inquiryPayment") public ResponseEntity inquiryPayment(@RequestBody Map map) { String paymentRequestId = map.get("paymentRequestId"); AlipayPayQueryRequest alipayPayQueryRequest = new AlipayPayQueryRequest(); alipayPayQueryRequest.setPaymentRequestId(paymentRequestId); AlipayPayQueryResponse alipayPayQueryResponse; try { long startTime = System.currentTimeMillis(); System.out.println("inquiry payment request: " + JSON.toJSONString(alipayPayQueryRequest)); alipayPayQueryResponse = CLIENT.execute(alipayPayQueryRequest); System.out.println("inquiry payment response: " + JSON.toJSONString(alipayPayQueryResponse)); System.out.println("inquiry payment request cost time: " + (System.currentTimeMillis() - startTime) + "ms\\n"); } catch (AlipayApiException e) { return ResponseEntity.ok().body(new ApiResponse(paymentRequestId, "", e)); } return ResponseEntity.ok().body(new ApiResponse(paymentRequestId, "", alipayPayQueryResponse)); } `] }, `server-Java-SDK-code8`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` @Data public static class PaymentVO { private String amountValue; private String currency; private String paymentMethodType; private String authState; } @Data private static class ApiResponse { private String status = "success"; private String paymentRequestId; private String authState; private String message; private Object data; public ApiResponse(String paymentRequestId, String authState, Object data) { this.paymentRequestId = paymentRequestId; this.authState = authState; this.data = data; } public ApiResponse(String paymentRequestId, String authState, Exception e) { this.paymentRequestId = paymentRequestId; this.authState = authState; this.status = "error"; this.message = e.getMessage(); } } } `] }, `server-Java-SDK-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/python/server.py', when: { server: 'Python', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `python`, filename: 'server.py', downloadOnly: false, steps: [`get-integration-resources`, `initiate-an-authorization-request`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `python`, steps: [``], chunks: [`#! /usr/bin/env python3 """ server.py Antom Sample. Python 3.9 or newer required. """ import json import time import uuid from com.alipay.ams.api.default_alipay_client import DefaultAlipayClient from com.alipay.ams.api.exception.exception import AlipayApiException from com.alipay.ams.api.model.amount import Amount from com.alipay.ams.api.model.buyer import Buyer from com.alipay.ams.api.model.customer_belongs_to import CustomerBelongsTo from com.alipay.ams.api.model.grant_type import GrantType from com.alipay.ams.api.model.order import Order from com.alipay.ams.api.model.payment_method import PaymentMethod from com.alipay.ams.api.model.product_code_type import ProductCodeType from com.alipay.ams.api.model.scope_type import ScopeType from com.alipay.ams.api.model.terminal_type import TerminalType from com.alipay.ams.api.request.auth.alipay_auth_apply_token_request import AlipayAuthApplyTokenRequest from com.alipay.ams.api.request.auth.alipay_auth_consult_request import AlipayAuthConsultRequest from com.alipay.ams.api.request.notify.alipay_auth_notify import AlipayAuthNotify from com.alipay.ams.api.request.pay.alipay_pay_query_request import AlipayPayQueryRequest from com.alipay.ams.api.request.pay.alipay_pay_request import AlipayPayRequest from com.alipay.ams.api.response.auth.alipay_auth_apply_token_response import AlipayAuthApplyTokenResponse from com.alipay.ams.api.response.auth.alipay_auth_consult_response import AlipayAuthConsultResponse from com.alipay.ams.api.response.pay.alipay_pay_query_response import AlipayPayQueryResponse from com.alipay.ams.api.response.pay.alipay_pay_response import AlipayPayResponse from com.alipay.ams.api.tools.webhook_tool import check_signature from flask import Flask, jsonify, request from flask_cors import CORS from money.currency import Currency from money.money import Money `] }, `server-Python-API-other1`), _jsx(AntomChunk, { language: `python`, steps: [`get-integration-resources`], chunks: [`''' replace with your client id find your client id here: https://dashboard.antom.com/global-payments/developers/quickStart ''' CLIENT_ID = "your_client_id" ''' replace with your antom public key (used to verify signature) find your antom public key here: https://dashboard.antom.com/global-payments/developers/quickStart ''' ANTOM_PUBLIC_KEY = "antom_public_key" ''' replace with your private key (used to sign) please ensure the secure storage of your private key to prevent leakage ''' MERCHANT_PRIVATE_KEY = "antom_public_key" default_alipay_client = DefaultAlipayClient("https://open-sea-global.alipay.com", CLIENT_ID, MERCHANT_PRIVATE_KEY, ANTOM_PUBLIC_KEY) `] }, `server-Python-API-code1`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [`# Save the mapping between authState and payment information auth_state_payment = {} # Save the mapping between authState and accessToken auth_state_access_token = {} app = Flask(__name__) CORS(app) `] }, `server-Python-API-other2`), _jsx(AntomChunk, { language: `python`, steps: [`initiate-an-authorization-request`], chunks: [`@app.route("/authorizations/consult", methods=['POST']) def authorization_consult(): payment_vo = request.get_json() terminal_type = payment_vo.get("terminalType", TerminalType.WEB.name) alipay_auth_consult_request = AlipayAuthConsultRequest() # replace with your authState auth_state = str(uuid.uuid4()) alipay_auth_consult_request.auth_state = auth_state # set the target payment method for which you are requesting authorization alipay_auth_consult_request.customer_belongs_to = CustomerBelongsTo[payment_vo['paymentMethodType']] # set the authorization scope alipay_auth_consult_request.scopes = [ScopeType.AGREEMENT_PAY] # set terminalType alipay_auth_consult_request.terminal_type = TerminalType[terminal_type] # set osType if TerminalType.WEB.name != terminal_type and payment_vo['osType']: alipay_auth_consult_request.os_type = payment_vo['osType'] `] }, `server-Python-API-code2`), _jsx(AntomChunk, { language: `python`, steps: [`specify-the-consultation-redirection-url`], chunks: [` # replace with your authRedirectUrl alipay_auth_consult_request.auth_redirect_url = "http://localhost:5173/receiveAuthCode.html"`] }, `server-Python-API-code3`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` `] }, `server-Python-API-other3`), _jsx(AntomChunk, { language: `python`, steps: [`save-payment-information`], chunks: [` # save the payment information corresponding to the authState payment_vo['authState'] = auth_state auth_state_payment[auth_state] = payment_vo `] }, `server-Python-API-code4`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` try: start_time = time.time() print(f"authorization consult request: {alipay_auth_consult_request.to_ams_json()}") alipay_auth_consult_response_body = default_alipay_client.execute(alipay_auth_consult_request) alipay_auth_consult_response = AlipayAuthConsultResponse(alipay_auth_consult_response_body) print(f"authorization consult response: {alipay_auth_consult_response_body}") print(f"authorization consult request cost time: {time.time() - start_time}") except AlipayApiException as e: # exception handling return jsonify(ApiResponse().error("", auth_state, e)) return jsonify(ApiResponse().success("", auth_state, json.loads(alipay_auth_consult_response_body))) `] }, `server-Python-API-other4`), _jsx(AntomChunk, { language: `python`, steps: [`apply-for-the-token-and-pay1`], chunks: [`# Method 1: Obtain authCode from reconstructed URL @app.route("/authorizations/applyTokenAndPay", methods=['POST']) def apply_token_and_pay(): auth_code = request.json.get("authCode") auth_state = request.json.get("authState") return execute_apply_token_and_pay(auth_code, auth_state) def execute_apply_token_and_pay(auth_code, auth_state): alipay_auth_apply_token_request = AlipayAuthApplyTokenRequest() # get payment method payment_method_type = auth_state_payment.get(auth_state)['paymentMethodType'] # set grant type alipay_auth_apply_token_request.grant_type = GrantType.AUTHORIZATION_CODE # set the target payment method for which you are requesting authorization alipay_auth_apply_token_request.customer_belongs_to = CustomerBelongsTo[payment_method_type] # set auth code alipay_auth_apply_token_request.auth_code = auth_code try: start_time = time.time() print(f"apply token request: {alipay_auth_apply_token_request.to_ams_json()}") alipay_auth_apply_token_response_body = default_alipay_client.execute(alipay_auth_apply_token_request) alipay_auth_apply_token_response = AlipayAuthApplyTokenResponse(alipay_auth_apply_token_response_body) print(f"apply token response: {alipay_auth_apply_token_response_body}") print(f"apply token request cost time: {time.time() - start_time}") except AlipayApiException as e: return jsonify(ApiResponse().error("", auth_state, e)) # save accessToken(in practice, accessToken should be saved to a database, # and you should save a mapping between the authState and the user's payment method) auth_state_access_token[auth_state] = alipay_auth_apply_token_response.access_token # invoke the payment method return execute_payment(auth_state_payment.get(auth_state)) `] }, `server-Python-API-code5`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` `] }, `server-Python-API-other5`), _jsx(AntomChunk, { language: `python`, steps: [`apply-for-the-token-and-pay2`], chunks: [`# Method 2: Obtain authCode from authorization notification @app.route("/authorizations/receiveAuthNotify", methods=['POST']) def receive_auth_notify(): # retrieve the required parameters from http request notify_body = request.get_data(as_text=True) request_uri = request.path request_method = request.method # retrieve the required parameters from request header headers = request.headers request_time = headers.get("request-time") client_id = headers.get("client-id") signature = headers.get("signature") try: # verify the signature of notification verify_result = check_signature(request_method, request_uri, client_id, request_time, str(notify_body), signature, ANTOM_PUBLIC_KEY) if not verify_result: raise Exception("Invalid notify signature") # deserialize the notification body alipay_auth_notify = AlipayAuthNotify(notify_body) if alipay_auth_notify.result.result_code == "SUCCESS": # in practice, you should store a mapping between payment results and users payment_result = execute_apply_token_and_pay(alipay_auth_notify.auth_code, alipay_auth_notify.auth_state) return jsonify({"result": {"resultCode": "SUCCESS", "resultMessage": "success.", "resultStatus": "S"}}) except Exception as e: print(str(e)) return jsonify({"result": {"resultCode": "FAIL", "resultMessage": "fail.", "resultStatus": "F"}}) return jsonify({"result": {"resultCode": "SYSTEM_ERROR", "resultMessage": "system error.", "resultStatus": 'F'}}) `] }, `server-Python-API-code6`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` `] }, `server-Python-API-other6`), _jsx(AntomChunk, { language: `python`, steps: [`initiate-a-payment-request`], chunks: [`@app.route("/payment/pay", methods=['POST']) def pay(): payment_vo = request.get_json() return execute_payment(payment_vo) def execute_payment(payment_vo): alipay_pay_request = AlipayPayRequest() alipay_pay_request.product_code = ProductCodeType.AGREEMENT_PAYMENT # get accessToken from authStateAccessToken access_token = auth_state_access_token.get(payment_vo['authState']) # replace with your paymentRequestId payment_request_id = str(uuid.uuid4()) alipay_pay_request.payment_request_id = payment_request_id # convert amount unit(in practice, amount should be calculated on your serverside) # For details, please refer to: https://docs.antom.com/ac/ref/cc money_sub_units = Money(payment_vo['amountValue'], Currency[payment_vo['currency']]).sub_units # set amount amount = Amount(payment_vo['currency'], money_sub_units) alipay_pay_request.payment_amount = amount # set paymentMethod payment_method = PaymentMethod() payment_method.payment_method_type = payment_vo['paymentMethodType'] payment_method.payment_method_id = access_token alipay_pay_request.payment_method = payment_method # set buyer info buyer = Buyer() buyer.reference_buyer_id = "your_buyer_id" # replace with your orderId order_id = str(uuid.uuid4()) # set order info order = Order() order.reference_order_id = order_id order.order_description = "antom api testing order" order.order_amount = amount order.buyer = buyer alipay_pay_request.order = order # replace with your notify url # or configure your notify url here: https://dashboard.antom.com/global-payments/developers/iNotify alipay_pay_request.payment_notify_url = "http://www.yourNotifyUrl.com/payment/receivePaymentNotify" try: start_time = time.time() print(f"payment request: {alipay_pay_request.to_ams_json()}") alipay_pay_response_body = default_alipay_client.execute(alipay_pay_request) alipay_pay_response = AlipayPayResponse(alipay_pay_response_body) print(f"payment response: {alipay_pay_response_body}") print(f"payment request cost time: {time.time() - start_time}") except AlipayApiException as e: return jsonify(ApiResponse().error(payment_request_id, payment_vo['authState'], e)) return jsonify( ApiResponse().success(payment_request_id, payment_vo['authState'], json.loads(alipay_pay_response_body))) `] }, `server-Python-API-code7`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` `] }, `server-Python-API-other7`), _jsx(AntomChunk, { language: `python`, steps: [`inquire-payment-result`], chunks: [`@app.route("/payment/inquiryPayment", methods=['POST']) def inquery_payment(): inquery_vo = request.get_json() payment_request_id = inquery_vo.get("paymentRequestId") alipay_pay_query_request = AlipayPayQueryRequest() alipay_pay_query_request.payment_request_id = payment_request_id try: start_time = time.time() print(f"inquiry payment request: {alipay_pay_query_request.to_ams_json()}") alipay_pay_query_response_body = default_alipay_client.execute(alipay_pay_query_request) alipay_pay_query_response = AlipayPayQueryResponse(alipay_pay_query_response_body) print(f"inquiry payment response: {alipay_pay_query_response_body}") print(f"inquiry payment request cost time: {time.time() - start_time}") except AlipayApiException as e: return jsonify(ApiResponse().error(payment_request_id, "", e)) return jsonify(ApiResponse().success(payment_request_id, "", json.loads(alipay_pay_query_response_body))) `] }, `server-Python-API-code8`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` class ApiResponse: def __init__(self): self.__status = "success" self.__payment_request_id = "" self.__auth_state = "" self.__message = "" self.__data = None def success(self, payment_request_id, auth_state, data): self.__payment_request_id = payment_request_id self.__auth_state = auth_state self.__data = data return self.to_json() def error(self, payment_request_id, auth_state, e): self.__payment_request_id = payment_request_id self.__auth_state = auth_state self.__message = str(e) self.__status = "error" return self.to_json() def to_json(self): return { "status": self.__status, "paymentRequestId": self.__payment_request_id, "authState": self.__auth_state, "message": self.__message, "data": self.__data } if __name__ == '__main__': app.run(host='localhost', port=8080) `] }, `server-Python-API-other8`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/python/server.py', when: { server: 'Python', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `python`, filename: 'server.py', downloadOnly: false, steps: [`get-integration-resources`, `create-a-consultation-session`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `python`, steps: [``], chunks: [`#! /usr/bin/env python3 """ server.py Antom Sample. Python 3.9 or newer required. """ import json import time import uuid from com.alipay.ams.api.default_alipay_client import DefaultAlipayClient from com.alipay.ams.api.exception.exception import AlipayApiException from com.alipay.ams.api.model.agreement_info import AgreementInfo from com.alipay.ams.api.model.amount import Amount from com.alipay.ams.api.model.buyer import Buyer from com.alipay.ams.api.model.customer_belongs_to import CustomerBelongsTo from com.alipay.ams.api.model.grant_type import GrantType from com.alipay.ams.api.model.order import Order from com.alipay.ams.api.model.payment_method import PaymentMethod from com.alipay.ams.api.model.product_code_type import ProductCodeType from com.alipay.ams.api.model.scope_type import ScopeType from com.alipay.ams.api.request.auth.alipay_auth_apply_token_request import AlipayAuthApplyTokenRequest from com.alipay.ams.api.request.auth.alipay_auth_create_session_request import AlipayAuthCreateSessionRequest from com.alipay.ams.api.request.notify.alipay_auth_notify import AlipayAuthNotify from com.alipay.ams.api.request.pay.alipay_pay_query_request import AlipayPayQueryRequest from com.alipay.ams.api.request.pay.alipay_pay_request import AlipayPayRequest from com.alipay.ams.api.response.auth.alipay_auth_apply_token_response import AlipayAuthApplyTokenResponse from com.alipay.ams.api.response.auth.alipay_auth_create_session_response import AlipayAuthCreateSessionResponse from com.alipay.ams.api.response.pay.alipay_pay_query_response import AlipayPayQueryResponse from com.alipay.ams.api.response.pay.alipay_pay_response import AlipayPayResponse from com.alipay.ams.api.tools.webhook_tool import check_signature from flask import Flask, jsonify, request from flask_cors import CORS from money.currency import Currency from money.money import Money `] }, `server-Python-SDK-other1`), _jsx(AntomChunk, { language: `python`, steps: [`get-integration-resources`], chunks: [`''' replace with your client id find your client id here: https://dashboard.antom.com/global-payments/developers/quickStart ''' CLIENT_ID = "your_client_id" ''' replace with your antom public key (used to verify signature) find your antom public key here: https://dashboard.antom.com/global-payments/developers/quickStart ''' ANTOM_PUBLIC_KEY = "antom_public_key" ''' replace with your private key (used to sign) please ensure the secure storage of your private key to prevent leakage ''' MERCHANT_PRIVATE_KEY = "antom_public_key" default_alipay_client = DefaultAlipayClient("https://open-sea-global.alipay.com", CLIENT_ID, MERCHANT_PRIVATE_KEY, ANTOM_PUBLIC_KEY) `] }, `server-Python-SDK-code1`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [`# Save the mapping between authState and payment information auth_state_payment = {} # Save the mapping between authState and accessToken auth_state_access_token = {} app = Flask(__name__) CORS(app) `] }, `server-Python-SDK-other2`), _jsx(AntomChunk, { language: `python`, steps: [`create-a-consultation-session`], chunks: [`@app.route("/authorizations/createConsultSession", methods=['POST']) def create_consult_session(): payment_vo = request.get_json() alipay_auth_create_session_request = AlipayAuthCreateSessionRequest() alipay_auth_create_session_request.product_code = ProductCodeType.AGREEMENT_PAYMENT # set agreementInfo # replace with your authState auth_state = str(uuid.uuid4()) agreement_info = AgreementInfo() agreement_info.auth_state = auth_state alipay_auth_create_session_request.agreement_info = agreement_info # set the target payment method for which you are requesting authorization payment_method = PaymentMethod() payment_method.payment_method_type = payment_vo['paymentMethodType'] alipay_auth_create_session_request.payment_method = payment_method # set the authorization scope alipay_auth_create_session_request.scopes = [ScopeType.AGREEMENT_PAY] `] }, `server-Python-SDK-code2`), _jsx(AntomChunk, { language: `python`, steps: [`specify-the-consultation-redirection-url`], chunks: [` # replace with your authRedirectUrl alipay_auth_create_session_request.payment_redirect_url = "http://localhost:5173/receiveAuthCode.html" `] }, `server-Python-SDK-code3`), _jsx(AntomChunk, { language: `python`, steps: [`save-payment-information`], chunks: [` # save the payment information corresponding to the authState payment_vo['authState'] = auth_state auth_state_payment[auth_state] = payment_vo `] }, `server-Python-SDK-code4`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` try: start_time = time.time() print(f"authorization consult request: {alipay_auth_create_session_request.to_ams_json()}") alipay_auth_create_session_response_body = default_alipay_client.execute(alipay_auth_create_session_request) alipay_auth_create_session_response = AlipayAuthCreateSessionResponse(alipay_auth_create_session_response_body) print(f"authorization consult response: {alipay_auth_create_session_response_body}") print(f"authorization consult request cost time: {time.time() - start_time}") except AlipayApiException as e: # exception handling return jsonify(ApiResponse().error("", auth_state, e)) return jsonify(ApiResponse().success("", auth_state, json.loads(alipay_auth_create_session_response_body))) `] }, `server-Python-SDK-other3`), _jsx(AntomChunk, { language: `python`, steps: [`apply-for-the-token-and-pay1`], chunks: [`# Method 1: Obtain authCode from reconstructed URL @app.route("/authorizations/applyTokenAndPay", methods=['POST']) def apply_token_and_pay(): auth_code = request.json.get("authCode") auth_state = request.json.get("authState") return execute_apply_token_and_pay(auth_code, auth_state) def execute_apply_token_and_pay(auth_code, auth_state): alipay_auth_apply_token = AlipayAuthApplyTokenRequest() # get payment method payment_method_type = auth_state_payment.get(auth_state)['paymentMethodType'] # set grant type alipay_auth_apply_token.grant_type = GrantType.AUTHORIZATION_CODE # set the target payment method for which you are requesting authorization alipay_auth_apply_token.customer_belongs_to = CustomerBelongsTo[payment_method_type] # set auth code alipay_auth_apply_token.auth_code = auth_code try: start_time = time.time() print(f"apply token request: {alipay_auth_apply_token.to_ams_json()}") alipay_auth_apply_token_response_body = default_alipay_client.execute(alipay_auth_apply_token) alipay_auth_apply_token_response = AlipayAuthApplyTokenResponse(alipay_auth_apply_token_response_body) print(f"apply token response: {alipay_auth_apply_token_response_body}") print(f"apply token request cost time: {time.time() - start_time}") except AlipayApiException as e: return jsonify(ApiResponse().error("", auth_state, e)) # save accessToken(in practice, accessToken should be saved to a database, # and you should save a mapping between the authState and the user's payment method) auth_state_access_token[auth_state] = alipay_auth_apply_token_response.access_token # invoke the payment method return execute_payment(auth_state_payment.get(auth_state)) `] }, `server-Python-SDK-code5`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` `] }, `server-Python-SDK-other4`), _jsx(AntomChunk, { language: `python`, steps: [`apply-for-the-token-and-pay2`], chunks: [`# Method 2: Obtain authCode from authorization notification @app.route("/authorizations/receiveAuthNotify", methods=['POST']) def receive_auth_notify(): # retrieve the required parameters from http request notify_body = request.get_data(as_text=True) request_uri = request.path request_method = request.method # retrieve the required parameters from request header headers = request.headers request_time = headers.get("request-time") client_id = headers.get("client-id") signature = headers.get("signature") try: # verify the signature of notification verify_result = check_signature(request_method, request_uri, client_id, request_time, str(notify_body), signature, ANTOM_PUBLIC_KEY) if not verify_result: raise Exception("Invalid notify signature") # deserialize the notification body alipay_auth_notify = AlipayAuthNotify(notify_body) if alipay_auth_notify.result.result_code == "SUCCESS": # save accessToken(in practice, accessToken should be saved to a database, # and you should save a mapping between the authState and the user's payment method) auth_state_access_token[alipay_auth_notify.auth_state] = alipay_auth_notify.access_token # in practice, you should store a mapping between payment results and users payment_result = execute_payment(auth_state_payment.get(alipay_auth_notify.auth_state)) return jsonify({"result": "{'resultCode': 'SUCCESS', 'resultMessage': 'success.', resultStatus: 'S'}"}) except Exception as e: print(str(e)) return jsonify({"result": {"resultCode": "FAIL", "resultMessage": "fail.", "resultStatus": "F"}}) return jsonify({"result": {"resultCode": "SYSTEM_ERROR", "resultMessage": "system error.", "resultStatus": 'F'}}) `] }, `server-Python-SDK-code6`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` `] }, `server-Python-SDK-other5`), _jsx(AntomChunk, { language: `python`, steps: [`initiate-a-payment-request`], chunks: [`@app.route("/payment/pay", methods=['POST']) def pay(): payment_vo = request.get_json() return execute_payment(payment_vo) def execute_payment(payment_vo): alipay_pay_request = AlipayPayRequest() alipay_pay_request.product_code = ProductCodeType.AGREEMENT_PAYMENT # get accessToken from authStateAccessToken access_token = auth_state_access_token.get(payment_vo['authState']) # replace with your paymentRequestId payment_request_id = str(uuid.uuid4()) alipay_pay_request.payment_request_id = payment_request_id # convert amount unit(in practice, amount should be calculated on your serverside) # For details, please refer to: https://docs.antom.com/ac/ref/cc money_sub_units = Money(payment_vo['amountValue'], Currency[payment_vo['currency']]).sub_units # set amount amount = Amount(payment_vo['currency'], money_sub_units) alipay_pay_request.payment_amount = amount # set paymentMethod payment_method = PaymentMethod() payment_method.payment_method_type = payment_vo['paymentMethodType'] payment_method.payment_method_id = access_token alipay_pay_request.payment_method = payment_method # set buyer info buyer = Buyer() buyer.reference_buyer_id = "your_buyer_id" # replace with your orderId order_id = str(uuid.uuid4()) # set order info order = Order() order.reference_order_id = order_id order.order_description = "antom sdk testing order" order.order_amount = amount order.buyer = buyer alipay_pay_request.order = order # replace with your notify url # or configure your notify url here: https://dashboard.antom.com/global-payments/developers/iNotify alipay_pay_request.payment_notify_url = "http://www.yourNotifyUrl.com/payment/receivePaymentNotify" try: start_time = time.time() print(f"payment request: {alipay_pay_request.to_ams_json()}") alipay_pay_response_body = default_alipay_client.execute(alipay_pay_request) alipay_pay_response = AlipayPayResponse(alipay_pay_response_body) print(f"payment response: {alipay_pay_response_body}") print(f"payment request cost time: {time.time() - start_time}") except AlipayApiException as e: return jsonify(ApiResponse().error(payment_request_id, payment_vo['authState'], e)) return jsonify( ApiResponse().success(payment_request_id, payment_vo['authState'], json.loads(alipay_pay_response_body))) `] }, `server-Python-SDK-code7`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` `] }, `server-Python-SDK-other6`), _jsx(AntomChunk, { language: `python`, steps: [`inquire-payment-result`], chunks: [`@app.route("/payment/inquiryPayment", methods=['POST']) def inquery_payment(): inquery_vo = request.get_json() payment_request_id = inquery_vo.get("paymentRequestId") alipay_pay_query_request = AlipayPayQueryRequest() alipay_pay_query_request.payment_request_id = payment_request_id try: start_time = time.time() print(f"inquiry payment request: {alipay_pay_query_request.to_ams_json()}") alipay_pay_query_response_body = default_alipay_client.execute(alipay_pay_query_request) alipay_pay_query_response = AlipayPayQueryResponse(alipay_pay_query_response_body) print(f"inquiry payment response: {alipay_pay_query_response_body}") print(f"inquiry payment request cost time: {time.time() - start_time}") except AlipayApiException as e: return jsonify(ApiResponse().error(payment_request_id, "", e)) return jsonify(ApiResponse().success(payment_request_id, "", json.loads(alipay_pay_query_response_body))) `] }, `server-Python-SDK-code8`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` class ApiResponse: def __init__(self): self.__status = "success" self.__payment_request_id = "" self.__auth_state = "" self.__message = "" self.__data = None def success(self, payment_request_id, auth_state, data): self.__payment_request_id = payment_request_id self.__auth_state = auth_state self.__data = data return self.to_json() def error(self, payment_request_id, auth_state, e): self.__payment_request_id = payment_request_id self.__auth_state = auth_state self.__message = str(e) self.__status = "error" return self.to_json() def to_json(self): return { "status": self.__status, "paymentRequestId": self.__payment_request_id, "authState": self.__auth_state, "message": self.__message, "data": self.__data } if __name__ == '__main__': app.run(host='localhost', port=8080) `] }, `server-Python-SDK-other7`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/php/server.php', when: { server: 'PHP', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `php`, filename: 'server.php', downloadOnly: false, steps: [`get-integration-resources`, `initiate-an-authorization-request`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `php`, steps: [``], chunks: [` * find your client id here: quickStart */ const CLIENT_ID = "your_client_id"; /** * replace with your antom public key (used to verify signature)
* find your antom public key here: quickStart */ const ANTOM_PUBLIC_KEY = "antom_public_key"; /** * replace with your private key (used to sign)
* please ensure the secure storage of your private key to prevent leakage */ const MERCHANT_PRIVATE_KEY = "your_private_key"; private static \$CLIENT; // Save the mapping between authState and payment information private static \$authStateFile = 'auth_state_payment.json'; // Save the mapping between authState and accessToken private static \$tokenFile = 'auth_state_token.json'; public function __construct() { session_start(); self::\$CLIENT = new DefaultAlipayClient( "https://open-sea-global.alipay.com", self::MERCHANT_PRIVATE_KEY, self::ANTOM_PUBLIC_KEY, self::CLIENT_ID ); } `] }, `server-PHP-API-code1`), _jsx(AntomChunk, { language: `php`, steps: [`initiate-an-authorization-request`], chunks: [` public function authorizationConsult(\$payment) { \$alipayAuthConsultRequest = new AlipayAuthConsultRequest(); \$payment['terminalType'] = isset(\$payment['terminalType']) ? \$payment['terminalType'] : TerminalType::WEB; // replace with your authState \$authState = uniqid('AUTH_'); \$alipayAuthConsultRequest->setAuthState(\$authState); // set the target payment method for which you are requesting authorization \$alipayAuthConsultRequest->setCustomerBelongsTo(constant("Model\\\\CustomerBelongsTo::" . \$payment['paymentMethodType'])); // set the authorization scope \$alipayAuthConsultRequest->setScopes(array(ScopeType::AGREEMENT_PAY)); // set terminalType \$alipayAuthConsultRequest->setTerminalType(\$payment['terminalType']); // set osType if (\$payment['terminalType'] !== TerminalType::WEB && !empty(\$payment['osType'])) { \$alipayAuthConsultRequest->setOsType(\$payment['osType']); } `] }, `server-PHP-API-code2`), _jsx(AntomChunk, { language: `php`, steps: [`specify-the-consultation-redirection-url`], chunks: [` // replace with your authRedirectUrl \$alipayAuthConsultRequest->setAuthRedirectUrl("http://localhost:5173/receiveAuthCode.html"); `] }, `server-PHP-API-code3`), _jsx(AntomChunk, { language: `php`, steps: [`save-payment-information`], chunks: [` // save the payment information corresponding to the authState \$payment['authState'] = \$authState; \$this->saveAuthStatePayment(\$authState, \$payment); `] }, `server-PHP-API-code4`), _jsx(AntomChunk, { language: `php`, steps: [``], chunks: [` try { \$startTime = microtime(true); error_log("authorization consult request: " . json_encode(\$alipayAuthConsultRequest)); \$alipayAuthConsultResponse = self::\$CLIENT->execute(\$alipayAuthConsultRequest); error_log("authorization consult response: " . json_encode(\$alipayAuthConsultResponse)); error_log("authorization consult request cost time: " . (microtime(true) - \$startTime) * 1000 . "ms\\n"); return \$this->apiResponse("", \$authState, \$alipayAuthConsultResponse); } catch (Exception \$e) { return \$this->apiResponse("", \$authState, \$e); } } `] }, `server-PHP-API-other2`), _jsx(AntomChunk, { language: `php`, steps: [`apply-for-the-token-and-pay1`], chunks: [` /** * Method 1: Obtain authCode from reconstructed URL * */ public function applyTokenAndPay(\$data) { \$authCode = \$data['authCode']; \$authState = \$data['authState']; \$alipayAuthApplyTokenRequest = new AlipayAuthApplyTokenRequest(); error_log("authState: " . \$authState); // get payment information \$payment = \$this->getAuthStatePayment(\$authState); if (!\$payment) { throw new Exception("Invalid auth state"); } // get payment method \$paymentMethodType = \$payment['paymentMethodType']; // set grant type \$alipayAuthApplyTokenRequest->setGrantType(GrantType::AUTHORIZATION_CODE); // set the target payment method for which you are requesting authorization \$alipayAuthApplyTokenRequest->setCustomerBelongsTo(\$paymentMethodType); // set auth code \$alipayAuthApplyTokenRequest->setAuthCode(\$authCode); try { \$startTime = microtime(true); error_log("apply token request: " . json_encode(\$alipayAuthApplyTokenRequest)); \$authApplyTokenResponse = self::\$CLIENT->execute(\$alipayAuthApplyTokenRequest); error_log("apply token response: " . json_encode(\$authApplyTokenResponse)); error_log("apply token request cost time: " . (microtime(true) - \$startTime) * 1000 . "ms\\n"); // save accessToken(in practice, accessToken should be saved to a database, and you should save a mapping between the authState and the user's payment method) \$this->saveAuthStateToken(\$authState, \$authApplyTokenResponse->accessToken); // invoke the payment method return \$this->pay(\$payment); } catch (Exception \$e) { return \$this->apiResponse("", \$authState, \$e); } } `] }, `server-PHP-API-code5`), _jsx(AntomChunk, { language: `php`, steps: [`apply-for-the-token-and-pay2`], chunks: [` /** * Method 2: Obtain authCode from authorization notification */ public function receiveAuthNotify(\$request, \$notifyBody) { // retrieve the required parameters from http request \$requestUri = \$request->getResourceUri(); \$requestMethod = \$request->getMethod(); // retrieve the required parameters from request header \$requestTime = \$request->headers('request-time'); \$clientId = \$request->headers('client-id'); \$signature = \$request->headers('signature'); try { // verify the signature of notification if (empty(\$signature)) { throw new RuntimeException("Invalid notify signature"); }else{ \$parts = explode("signature=", \$signature); if(count(\$parts)>1){ \$realSignature = \$parts[1]; } } \$verifyResult = SignatureTool::verify( \$requestMethod, \$requestUri, \$clientId, \$requestTime, \$notifyBody, \$realSignature, self::ANTOM_PUBLIC_KEY ); if (!\$verifyResult) { throw new RuntimeException("Invalid notify signature"); } // deserialize the notification body \$authNotify = json_decode(\$notifyBody, true); if (\$authNotify && \$authNotify['result']['resultCode'] === 'SUCCESS') { // get authCode for applyToken and pay \$data = array( 'authCode' => \$authNotify['authCode'], 'authState' => \$authNotify['authState'] ); // in practice, you should store a mapping between payment results and users \$paymentResult = \$this->applyTokenAndPay(\$data); return array( 'resultCode' => 'SUCCESS', 'resultMessage' => 'success.', 'resultStatus' => 'S' ); } } catch (Exception \$e) { return array( 'resultCode' => 'FAIL', 'resultMessage' => 'fail.', 'resultStatus' => 'F' ); } return array( 'resultCode' => 'SYSTEM_ERROR', 'resultMessage' => 'system error.', 'resultStatus' => 'F' ); } `] }, `server-PHP-API-code6`), _jsx(AntomChunk, { language: `php`, steps: [`initiate-a-payment-request`], chunks: [` public function pay(\$payment) { \$alipayPayRequest = new AlipayPayRequest(); \$alipayPayRequest->setProductCode(ProductCodeType::AGREEMENT_PAYMENT); \$payment['terminalType'] = isset(\$payment['terminalType']) ? \$payment['terminalType'] : TerminalType::WEB; // get accessToken from authStateAccessToken \$accessToken = \$this->getAuthStateAccessToken(\$payment['authState']); if (!\$accessToken) { throw new Exception("Invalid access token"); } // replace with your paymentRequestId \$paymentRequestId = uniqid('PR_'); \$alipayPayRequest->setPaymentRequestId(\$paymentRequestId); // convert amount unit(in practice, amount should be calculated on your serverside) // For details, please refer to: Usage rules of the Amount object \$moneyParser = new DecimalMoneyParser(new ISOCurrencies()); \$money = \$moneyParser->parse((string)\$payment['amountValue'], new Currency(\$payment['currency'])); // set amount \$amount = new Amount(); \$amount->setCurrency(\$payment['currency']); \$amount->setValue(\$money->getAmount()); \$alipayPayRequest->setPaymentAmount(\$amount); // set paymentMethod \$paymentMethod = new PaymentMethod(); \$paymentMethod->setPaymentMethodType(\$payment['paymentMethodType']); \$paymentMethod->setPaymentMethodId(\$accessToken); \$alipayPayRequest->setPaymentMethod(\$paymentMethod); // set buyer info \$buyer = new Buyer(); \$buyer->setReferenceBuyerId("yourBuyerId"); // replace with your orderId \$orderId = uniqid('ORDER_'); // set order info \$order = new Order(); \$order->setReferenceOrderId(\$orderId); \$order->setOrderDescription("antom api testing order"); \$order->setOrderAmount(\$amount); \$order->setBuyer(\$buyer); \$alipayPayRequest->setOrder(\$order); // replace with your notify url // or configure your notify url here: Notification URL \$alipayPayRequest->setPaymentNotifyUrl("http://www.yourNotifyUrl.com/payment/receivePaymentNotify"); try { \$startTime = microtime(true); error_log("payment request: " . json_encode(\$alipayPayRequest)); \$alipayPayResponse = self::\$CLIENT->execute(\$alipayPayRequest); error_log("payment response: " . json_encode(\$alipayPayResponse)); error_log("payment request cost time: " . (microtime(true) - \$startTime) * 1000 . "ms\\n"); return \$this->apiResponse(\$paymentRequestId, \$payment['authState'], \$alipayPayResponse); } catch (Exception \$e) { return \$this->apiResponse(\$paymentRequestId, \$payment['authState'], \$e); } } `] }, `server-PHP-API-code7`), _jsx(AntomChunk, { language: `php`, steps: [`inquire-payment-result`], chunks: [` public function inquiryPayment(\$data) { \$paymentRequestId = \$data['paymentRequestId']; \$alipayPayQueryRequest = new AlipayPayQueryRequest(); \$alipayPayQueryRequest->setPaymentRequestId(\$paymentRequestId); try { \$startTime = microtime(true); error_log("inquiry payment request: " . json_encode(\$alipayPayQueryRequest)); \$alipayPayQueryResponse = self::\$CLIENT->execute(\$alipayPayQueryRequest); error_log("inquiry payment response: " . json_encode(\$alipayPayQueryResponse)); error_log("inquiry payment request cost time: " . (microtime(true) - \$startTime) * 1000 . "ms\\n"); return \$this->apiResponse(\$paymentRequestId, "", \$alipayPayQueryResponse); } catch (Exception \$e) { return \$this->apiResponse(\$paymentRequestId, "", \$e); } } `] }, `server-PHP-API-code8`), _jsx(AntomChunk, { language: `php`, steps: [``], chunks: [` private function apiResponse(\$paymentRequestId, \$authState, \$data) { if (\$data instanceof Exception) { return array( 'status' => 'error', 'paymentRequestId' => \$paymentRequestId, 'authState' => \$authState, 'message' => \$data->getMessage() ); } return array( 'status' => 'success', 'paymentRequestId' => \$paymentRequestId, 'authState' => \$authState, 'data' => \$data ); } private function saveAuthStatePayment(\$authState, \$payment) { \$data = array(); if (file_exists(self::\$authStateFile)) { \$data = json_decode(file_get_contents(self::\$authStateFile), true); } \$data[\$authState] = \$payment; file_put_contents(self::\$authStateFile, json_encode(\$data)); } private function getAuthStatePayment(\$authState) { if (file_exists(self::\$authStateFile)) { \$data = json_decode(file_get_contents(self::\$authStateFile), true); return isset(\$data[\$authState]) ? \$data[\$authState] : null; } return null; } private function saveAuthStateToken(\$authState, \$token) { \$data = array(); if (file_exists(self::\$tokenFile)) { \$data = json_decode(file_get_contents(self::\$tokenFile), true); } \$data[\$authState] = \$token; file_put_contents(self::\$tokenFile, json_encode(\$data)); } private function getAuthStateAccessToken(\$authState) { if (file_exists(self::\$tokenFile)) { \$data = json_decode(file_get_contents(self::\$tokenFile), true); return isset(\$data[\$authState]) ? \$data[\$authState] : null; } return null; } } // Slim Framework routes setup \$app = new \\Slim\\Slim(array( 'base.path' => '' )); // Add CORS middleware \$app->response->headers->set('Access-Control-Allow-Origin', '*'); \$app->response->headers->set('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS'); \$app->response->headers->set('Access-Control-Allow-Headers', 'Content-Type, X-Requested-With, Authorization'); // Add OPTIONS request handler \$app->options('/(:path+)', function () use (\$app) { \$app->response->setStatus(200); }); \$paymentServer = new PaymentServer(); \$app->post('/authorizations/consult', function () use (\$app, \$paymentServer) { \$payment = \$app->request->getBody(); \$payment = json_decode(\$payment, true); \$response = \$paymentServer->authorizationConsult(\$payment); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/authorizations/applyTokenAndPay', function () use (\$app, \$paymentServer) { \$data = \$app->request->getBody(); \$data = json_decode(\$data, true); \$response = \$paymentServer->applyTokenAndPay(\$data); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/authorizations/receiveAuthNotify', function () use (\$app, \$paymentServer) { \$notifyBody = \$app->request->getBody(); \$response = \$paymentServer->receiveAuthNotify(\$app->request, \$notifyBody); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/payment/pay', function () use (\$app, \$paymentServer) { \$payment = \$app->request->getBody(); \$payment = json_decode(\$payment, true); \$response = \$paymentServer->pay(\$payment); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/payment/inquiryPayment', function () use (\$app, \$paymentServer) { \$data = \$app->request->getBody(); \$data = json_decode(\$data, true); \$response = \$paymentServer->inquiryPayment(\$data); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->run(); `] }, `server-PHP-API-other3`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/php/server.php', when: { server: 'PHP', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `php`, filename: 'server.php', downloadOnly: false, steps: [`get-integration-resources`, `create-a-consultation-session`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `php`, steps: [``], chunks: [` * find your client id here: quickStart */ const CLIENT_ID = "your_client_id"; /** * replace with your antom public key (used to verify signature)
* find your antom public key here: quickStart */ const ANTOM_PUBLIC_KEY = "antom_public_key"; /** * replace with your private key (used to sign)
* please ensure the secure storage of your private key to prevent leakage */ const MERCHANT_PRIVATE_KEY = "your_private_key"; private static \$CLIENT; // Save the mapping between authState and payment information private static \$authStateFile = 'auth_state_payment.json'; // Save the mapping between authState and accessToken private static \$tokenFile = 'auth_state_token.json'; public function __construct() { session_start(); self::\$CLIENT = new DefaultAlipayClient( "https://open-sea-global.alipay.com", self::MERCHANT_PRIVATE_KEY, self::ANTOM_PUBLIC_KEY, self::CLIENT_ID ); } `] }, `server-PHP-SDK-code1`), _jsx(AntomChunk, { language: `php`, steps: [`create-a-consultation-session`], chunks: [` public function createConsultSession(\$payment) { \$alipayAuthCreateSessionRequest = new AlipayAuthCreateSessionRequest(); \$alipayAuthCreateSessionRequest->setProductCode(ProductCodeType::AGREEMENT_PAYMENT); // set agreementInfo // replace with your authState \$authState = uniqid('AUTH_'); \$agreementInfo = new AgreementInfo(); \$agreementInfo->setAuthState(\$authState); \$alipayAuthCreateSessionRequest->setAgreementInfo(\$agreementInfo); // set the target payment method for which you are requesting authorization \$paymentMethod = new PaymentMethod(); \$paymentMethod->setPaymentMethodType(\$payment['paymentMethodType']); \$alipayAuthCreateSessionRequest->setPaymentMethod(\$paymentMethod); // set the authorization scope \$alipayAuthCreateSessionRequest->setScopes(array(ScopeType::AGREEMENT_PAY)); `] }, `server-PHP-SDK-code2`), _jsx(AntomChunk, { language: `php`, steps: [`specify-the-consultation-redirection-url`], chunks: [` // replace with your authRedirectUrl \$alipayAuthCreateSessionRequest->setPaymentRedirectUrl("http://localhost:5173/receiveAuthCode"); `] }, `server-PHP-SDK-code3`), _jsx(AntomChunk, { language: `php`, steps: [`save-payment-information`], chunks: [` // save the payment information corresponding to the authState \$payment['authState'] = \$authState; \$this->saveAuthStatePayment(\$authState, \$payment); `] }, `server-PHP-SDK-code4`), _jsx(AntomChunk, { language: `php`, steps: [``], chunks: [` try { \$startTime = microtime(true); error_log("authorization consult request: " . json_encode(\$alipayAuthCreateSessionRequest)); \$alipayAuthCreateSessionResponse = self::\$CLIENT->execute(\$alipayAuthCreateSessionRequest); error_log("authorization consult response: " . json_encode(\$alipayAuthCreateSessionResponse)); error_log("authorization consult request cost time: " . (microtime(true) - \$startTime) * 1000 . "ms\\n"); return \$this->apiResponse("", \$authState, \$alipayAuthCreateSessionResponse); } catch (Exception \$e) { // exception handling return \$this->apiResponse("", \$authState, \$e); } } `] }, `server-PHP-SDK-other2`), _jsx(AntomChunk, { language: `php`, steps: [`apply-for-the-token-and-pay1`], chunks: [` /** * Method 1: Obtain authCode from reconstructed URL */ public function applyTokenAndPay(\$data) { \$authCode = \$data['authCode']; \$authState = \$data['authState']; \$alipayAuthApplyTokenRequest = new AlipayAuthApplyTokenRequest(); // get payment method \$payment = \$this->getAuthStatePayment(\$authState); if (!\$payment) { throw new Exception("Invalid auth state"); } \$paymentMethodType = \$payment['paymentMethodType']; // set grant type \$alipayAuthApplyTokenRequest->setGrantType(GrantType::AUTHORIZATION_CODE); // set the target payment method for which you are requesting authorization \$alipayAuthApplyTokenRequest->setCustomerBelongsTo(\$paymentMethodType); // set auth code \$alipayAuthApplyTokenRequest->setAuthCode(\$authCode); try { \$startTime = microtime(true); error_log("apply token request: " . json_encode(\$alipayAuthApplyTokenRequest)); \$authApplyTokenResponse = self::\$CLIENT->execute(\$alipayAuthApplyTokenRequest); error_log("apply token response: " . json_encode(\$authApplyTokenResponse)); error_log("apply token request cost time: " . (microtime(true) - \$startTime) * 1000 . "ms\\n"); // save accessToken(in practice, accessToken should be saved to a database, // and you should save a mapping between the authState and the user's payment method) \$this->saveAuthStateToken(\$authState, \$authApplyTokenResponse->accessToken); // invoke the payment method return \$this->pay(\$payment); } catch (Exception \$e) { return \$this->apiResponse("", \$authState, \$e); } } `] }, `server-PHP-SDK-code5`), _jsx(AntomChunk, { language: `php`, steps: [`apply-for-the-token-and-pay2`], chunks: [` /** * Method 2: Obtain authCode from authorization notification */ public function receiveAuthNotify(\$request, \$notifyBody) { // retrieve the required parameters from http request \$requestUri = \$request->getResourceUri(); \$requestMethod = \$request->getMethod(); // retrieve the required parameters from request header \$requestTime = \$request->headers('request-time'); \$clientId = \$request->headers('client-id'); \$signature = \$request->headers('signature'); try { // verify the signature of notification if (empty(\$signature)) { throw new RuntimeException("Invalid notify signature"); }else{ \$parts = explode("signature=", \$signature); if(count(\$parts)>1){ \$realSignature = \$parts[1]; } } \$verifyResult = SignatureTool::verify( \$requestMethod, \$requestUri, \$clientId, \$requestTime, \$notifyBody, \$realSignature, self::ANTOM_PUBLIC_KEY ); if (!\$verifyResult) { throw new RuntimeException("Invalid notify signature"); } // deserialize the notification body \$authNotify = json_decode(\$notifyBody, true); if (\$authNotify && \$authNotify['result']['resultCode'] === 'SUCCESS') { // save accessToken(in practice, accessToken should be saved to a database, // and you should save a mapping between the authState and the user's payment method) \$this->saveAuthStateToken(\$authNotify['authState'], \$authNotify['accessToken']); // in practice, you should store a mapping between payment results and users \$payment = \$this->getAuthStatePayment(\$authNotify['authState']); if (\$payment) { \$paymentResult = \$this->pay(\$payment); } return array( 'resultCode' => 'SUCCESS', 'resultMessage' => 'success.', 'resultStatus' => 'S' ); } } catch (Exception \$e) { return array( 'resultCode' => 'FAIL', 'resultMessage' => 'fail.', 'resultStatus' => 'F' ); } return array( 'resultCode' => 'SYSTEM_ERROR', 'resultMessage' => 'system error.', 'resultStatus' => 'F' ); } `] }, `server-PHP-SDK-code6`), _jsx(AntomChunk, { language: `php`, steps: [`initiate-a-payment-request`], chunks: [` public function pay(\$payment) { \$alipayPayRequest = new AlipayPayRequest(); \$alipayPayRequest->setProductCode(ProductCodeType::AGREEMENT_PAYMENT); // get accessToken from authStateAccessToken \$accessToken = \$this->getAuthStateAccessToken(\$payment['authState']); if (!\$accessToken) { throw new Exception("Invalid access token"); } // replace with your paymentRequestId \$paymentRequestId = uniqid('PR_'); \$alipayPayRequest->setPaymentRequestId(\$paymentRequestId); // convert amount unit(in practice, amount should be calculated on your serverside) // For details, please refer to: Usage rules of the Amount object \$moneyParser = new DecimalMoneyParser(new ISOCurrencies()); \$money = \$moneyParser->parse((string)\$payment['amountValue'], new Currency(\$payment['currency'])); // set amount \$amount = new Amount(); \$amount->setCurrency(\$payment['currency']); \$amount->setValue(\$money->getAmount()); \$alipayPayRequest->setPaymentAmount(\$amount); // set paymentMethod \$paymentMethod = new PaymentMethod(); \$paymentMethod->setPaymentMethodType(\$payment['paymentMethodType']); \$paymentMethod->setPaymentMethodId(\$accessToken); \$alipayPayRequest->setPaymentMethod(\$paymentMethod); // set buyer info \$buyer = new Buyer(); \$buyer->setReferenceBuyerId("yourBuyerId"); // replace with your orderId \$orderId = uniqid('ORDER_'); // set order info \$order = new Order(); \$order->setReferenceOrderId(\$orderId); \$order->setOrderDescription("antom sdk testing order"); \$order->setOrderAmount(\$amount); \$order->setBuyer(\$buyer); \$alipayPayRequest->setOrder(\$order); // replace with your notify url // or configure your notify url here: Notification URL \$alipayPayRequest->setPaymentNotifyUrl("http://www.yourNotifyUrl.com/payment/receivePaymentNotify"); try { \$startTime = microtime(true); error_log("payment request: " . json_encode(\$alipayPayRequest)); \$alipayPayResponse = self::\$CLIENT->execute(\$alipayPayRequest); error_log("payment response: " . json_encode(\$alipayPayResponse)); error_log("payment request cost time: " . (microtime(true) - \$startTime) * 1000 . "ms\\n"); return \$this->apiResponse(\$paymentRequestId, \$payment['authState'], \$alipayPayResponse); } catch (Exception \$e) { return \$this->apiResponse(\$paymentRequestId, \$payment['authState'], \$e); } } `] }, `server-PHP-SDK-code7`), _jsx(AntomChunk, { language: `php`, steps: [`inquire-payment-result`], chunks: [` public function inquiryPayment(\$data) { \$paymentRequestId = \$data['paymentRequestId']; \$alipayPayQueryRequest = new AlipayPayQueryRequest(); \$alipayPayQueryRequest->setPaymentRequestId(\$paymentRequestId); try { \$startTime = microtime(true); error_log("inquiry payment request: " . json_encode(\$alipayPayQueryRequest)); \$alipayPayQueryResponse = self::\$CLIENT->execute(\$alipayPayQueryRequest); error_log("inquiry payment response: " . json_encode(\$alipayPayQueryResponse)); error_log("inquiry payment request cost time: " . (microtime(true) - \$startTime) * 1000 . "ms\\n"); return \$this->apiResponse(\$paymentRequestId, "", \$alipayPayQueryResponse); } catch (Exception \$e) { return \$this->apiResponse(\$paymentRequestId, "", \$e); } } `] }, `server-PHP-SDK-code8`), _jsx(AntomChunk, { language: `php`, steps: [``], chunks: [` private function apiResponse(\$paymentRequestId, \$authState, \$data) { if (\$data instanceof Exception) { return array( 'status' => 'error', 'paymentRequestId' => \$paymentRequestId, 'authState' => \$authState, 'message' => \$data->getMessage() ); } return array( 'status' => 'success', 'paymentRequestId' => \$paymentRequestId, 'authState' => \$authState, 'data' => \$data ); } private function saveAuthStatePayment(\$authState, \$payment) { \$data = array(); if (file_exists(self::\$authStateFile)) { \$data = json_decode(file_get_contents(self::\$authStateFile), true); } \$data[\$authState] = \$payment; file_put_contents(self::\$authStateFile, json_encode(\$data)); } private function getAuthStatePayment(\$authState) { if (file_exists(self::\$authStateFile)) { \$data = json_decode(file_get_contents(self::\$authStateFile), true); return isset(\$data[\$authState]) ? \$data[\$authState] : null; } return null; } private function saveAuthStateToken(\$authState, \$token) { \$data = array(); if (file_exists(self::\$tokenFile)) { \$data = json_decode(file_get_contents(self::\$tokenFile), true); } \$data[\$authState] = \$token; file_put_contents(self::\$tokenFile, json_encode(\$data)); } private function getAuthStateAccessToken(\$authState) { if (file_exists(self::\$tokenFile)) { \$data = json_decode(file_get_contents(self::\$tokenFile), true); return isset(\$data[\$authState]) ? \$data[\$authState] : null; } return null; } } // Slim Framework routes setup \$app = new \\Slim\\Slim(array( 'base.path' => '' )); // Add CORS middleware \$app->response->headers->set('Access-Control-Allow-Origin', '*'); \$app->response->headers->set('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS'); \$app->response->headers->set('Access-Control-Allow-Headers', 'Content-Type, X-Requested-With, Authorization'); // Add OPTIONS request handler \$app->options('/(:path+)', function () use (\$app) { \$app->response->setStatus(200); }); \$paymentServer = new PaymentServer(); \$app->post('/authorizations/createConsultSession', function () use (\$app, \$paymentServer) { \$payment = \$app->request->getBody(); \$payment = json_decode(\$payment, true); \$response = \$paymentServer->createConsultSession(\$payment); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/authorizations/applyTokenAndPay', function () use (\$app, \$paymentServer) { \$data = \$app->request->getBody(); \$data = json_decode(\$data, true); \$response = \$paymentServer->applyTokenAndPay(\$data); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/authorizations/receiveAuthNotify', function () use (\$app, \$paymentServer) { \$notifyBody = \$app->request->getBody(); \$response = \$paymentServer->receiveAuthNotify(\$app->request, \$notifyBody); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/payment/pay', function () use (\$app, \$paymentServer) { \$payment = \$app->request->getBody(); \$payment = json_decode(\$payment, true); \$response = \$paymentServer->pay(\$payment); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/payment/inquiryPayment', function () use (\$app, \$paymentServer) { \$data = \$app->request->getBody(); \$data = json_decode(\$data, true); \$response = \$paymentServer->inquiryPayment(\$data); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->run(); `] }, `server-PHP-SDK-other3`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/go/server.go', when: { server: 'Go', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `go`, filename: 'server.go', downloadOnly: false, steps: [`get-integration-resources`, `initiate-an-authorization-request`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `go`, steps: [``], chunks: [`package main import ( "bytes" "encoding/json" "fmt" "github.com/Rhymond/go-money" "github.com/alipay/global-open-sdk-go/com/alipay/api/model" "github.com/alipay/global-open-sdk-go/com/alipay/api/request/auth" "github.com/alipay/global-open-sdk-go/com/alipay/api/response" "github.com/alipay/global-open-sdk-go/com/alipay/api/request/notify" "github.com/alipay/global-open-sdk-go/com/alipay/api/request/pay" authResponse "github.com/alipay/global-open-sdk-go/com/alipay/api/response/auth" "github.com/alipay/global-open-sdk-go/com/alipay/api/tools" "io" "log" "net/http" "strconv" "sync" "time" defaultAlipayClient "github.com/alipay/global-open-sdk-go/com/alipay/api" "github.com/google/uuid" ) `] }, `server-Go-API-other1`), _jsx(AntomChunk, { language: `go`, steps: [`get-integration-resources`], chunks: [`const ( /* replace with your client id
find your client id here: quickStart */ ClientID = "your_client_id" /* replace with your antom public key (used to verify signature)
find your antom public key here: quickStart */ AntomPublicKey = "antom_public_key" /* replace with your private key (used to sign)
please ensure the secure storage of your private key to prevent leakage */ MerchantPrivateKey = "your_private_key" ) // Initialize global client var client *defaultAlipayClient.DefaultAlipayClient func init() { client = defaultAlipayClient.NewDefaultAlipayClient( "https://open-sea-global.alipay.com", ClientID, MerchantPrivateKey, AntomPublicKey) } `] }, `server-Go-API-code1`), _jsx(AntomChunk, { language: `go`, steps: [``], chunks: [`// Save the mapping between authState and payment information var authStatePayment sync.Map // Save the mapping between authState and accessToken var authStateAccessToken sync.Map func main() { // Register routes http.HandleFunc("/authorizations/consult", enableCORS(handleAuthConsult)) http.HandleFunc("/authorizations/applyTokenAndPay", enableCORS(handleApplyTokenAndPay)) http.HandleFunc("/authorizations/receiveAuthNotify", enableCORS(handleReceiveAuthNotify)) http.HandleFunc("/payment/pay", enableCORS(handlePay)) http.HandleFunc("/payment/inquiryPayment", enableCORS(handleInquiryPayment)) fmt.Println("Open your browser and visit: http://localhost:8080") log.Fatal(http.ListenAndServe(":8080", nil)) } `] }, `server-Go-API-other2`), _jsx(AntomChunk, { language: `go`, steps: [`initiate-an-authorization-request`], chunks: [`func handleAuthConsult(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } var payment PaymentVO json.NewDecoder(r.Body).Decode(&payment) // Set default terminal type if not provided if payment.TerminalType == "" { payment.TerminalType = "WEB" } request, authConsultRequest := auth.NewAlipayAuthConsultRequest() // replace with your authState authState := uuid.New().String() authConsultRequest.AuthState = authState // set the target payment method for which you are requesting authorization authConsultRequest.CustomerBelongsTo = model.CustomerBelongsTo(payment.PaymentMethodType) // set the authorization scope authConsultRequest.Scopes = []model.ScopeType{model.ScopeTypeAgreementPay} // set terminalType authConsultRequest.TerminalType = model.TerminalType(payment.TerminalType) // set osType if payment.TerminalType != "WEB" && payment.OsType != "" { authConsultRequest.OsType = model.OsType(payment.OsType) } `] }, `server-Go-API-code2`), _jsx(AntomChunk, { language: `go`, steps: [`specify-the-consultation-redirection-url`], chunks: [` // replace with your authRedirectUrl authConsultRequest.AuthRedirectUrl = "http://localhost:5173/receiveAuthCode.html" `] }, `server-Go-API-code3`), _jsx(AntomChunk, { language: `go`, steps: [`save-payment-information`], chunks: [` // save the payment information corresponding to the authState payment.AuthState = authState authStatePayment.Store(authState, payment) `] }, `server-Go-API-code4`), _jsx(AntomChunk, { language: `go`, steps: [``], chunks: [` startTime := time.Now() authConsultRequestJson, _ := json.Marshal(authConsultRequest) log.Printf("authorization consult request: %s", authConsultRequestJson) response, err := client.Execute(request) if err != nil { sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "error", AuthState: authState, Message: err.Error(), }) return } log.Printf("authorization consult response: %+v", response) log.Printf("authorization consult request cost time: %v ms\\n", time.Since(startTime).Milliseconds()) sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "success", AuthState: authState, Data: response, }) } `] }, `server-Go-API-other3`), _jsx(AntomChunk, { language: `go`, steps: [`apply-for-the-token-and-pay1`], chunks: [`/* Method 1: Obtain authCode from reconstructed URL */ func handleApplyTokenAndPay(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } var requestMap map[string]string json.NewDecoder(r.Body).Decode(&requestMap) authCode := requestMap["authCode"] authState := requestMap["authState"] request, authApplyTokenRequest := auth.NewAlipayAuthApplyTokenRequest() // get payment method paymentValue, _ := authStatePayment.Load(authState) payment := paymentValue.(PaymentVO) // set grant type authApplyTokenRequest.GrantType = model.GrantTypeAUTHORIZATION_CODE // set the target payment method for which you are requesting authorization authApplyTokenRequest.CustomerBelongsTo = model.CustomerBelongsTo(payment.PaymentMethodType) // set auth code authApplyTokenRequest.AuthCode = authCode startTime := time.Now() authApplyTokenRequestJson, _ := json.Marshal(authApplyTokenRequest) log.Printf("apply token request: %s", authApplyTokenRequestJson) response, err := client.Execute(request) if err != nil { sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "error", AuthState: authState, Message: err.Error(), }) return } log.Printf("apply token response: %+v", response) log.Printf("apply token request cost time: %v ms\\n", time.Since(startTime).Milliseconds()) // save accessToken(in practice, accessToken should be saved to a database, // and you should save a mapping between the authState and the user's payment method) authStateAccessToken.Store(authState, response.(*authResponse.AlipayAuthApplyTokenResponse).AccessToken) // create new request body with payment information paymentJson, _ := json.Marshal(payment) r.Body = io.NopCloser(bytes.NewBuffer(paymentJson)) // invoke the payment method handlePay(w, r) } `] }, `server-Go-API-code5`), _jsx(AntomChunk, { language: `go`, steps: [`apply-for-the-token-and-pay2`], chunks: [`/* Method 2: Obtain authCode from authorization notification */ func handleReceiveAuthNotify(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } rawBody, err := io.ReadAll(r.Body) if err != nil { sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "FAIL", ResultMessage: "fail.", ResultStatus: "F", }) return } notifyBody := string(rawBody) // retrieve the required parameters from http request requestURI := r.RequestURI requestMethod := r.Method // retrieve the required parameters from request header requestTime := r.Header.Get("request-time") clientID := r.Header.Get("client-id") signature := r.Header.Get("signature") // verify the signature of notification checkSignature, err := tools.CheckSignature(requestURI, requestMethod, clientID, requestTime, notifyBody, signature, AntomPublicKey) if err != nil || !checkSignature { sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "FAIL", ResultMessage: "fail.", ResultStatus: "F", }) return } // deserialize the notification body var authNotify notify.AlipayAuthNotify if err := json.Unmarshal(rawBody, &authNotify); err != nil { sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "FAIL", ResultMessage: "fail.", ResultStatus: "F", }) return } if authNotify.Result.ResultCode == "SUCCESS" { // get authCode for applyToken and pay requestMap := map[string]string{ "authCode": authNotify.AuthCode, "authState": authNotify.AuthState, } jsonBytes, _ := json.Marshal(requestMap) r.Body = io.NopCloser(bytes.NewBuffer(jsonBytes)) // in practice, you should store a mapping between payment results and users handleApplyTokenAndPay(w, r) return } sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "SYSTEM_ERROR", ResultMessage: "system error.", ResultStatus: "F", }) } `] }, `server-Go-API-code6`), _jsx(AntomChunk, { language: `go`, steps: [`initiate-a-payment-request`], chunks: [`func handlePay(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } var payment PaymentVO json.NewDecoder(r.Body).Decode(&payment) request, payRequest := pay.NewAlipayPayRequest() payRequest.ProductCode = model.AGREEMENT_PAYMENT // get accessToken from authStateAccessToken accessToken, _ := authStateAccessToken.Load(payment.AuthState) // replace with your paymentRequestId paymentRequestId := uuid.New().String() payRequest.PaymentRequestId = paymentRequestId // convert amount unit(in practice, amount should be calculated on your serverside) // For details, please refer to: Usage rules of the Amount object parseFloat, _ := strconv.ParseFloat(payment.AmountValue, 64) amountValue := money.NewFromFloat(parseFloat, payment.Currency).Amount() // set amount amount := &model.Amount{Value: strconv.FormatInt(amountValue, 10), Currency: payment.Currency} payRequest.PaymentAmount = amount // set paymentMethod payRequest.PaymentMethod = &model.PaymentMethod{ PaymentMethodType: payment.PaymentMethodType, PaymentMethodId: accessToken.(string), } // set buyer info buyer := &model.Buyer{ReferenceBuyerId: "yourBuyerId"} // replace with your orderId orderId := uuid.New().String() // set order Info order := &model.Order{ ReferenceOrderId: orderId, OrderDescription: "antom api testing order", OrderAmount: amount, Buyer: buyer, } payRequest.Order = order // replace with your notify url // or configure your notify url here: Notification URL payRequest.PaymentNotifyUrl = "http://www.yourNotifyUrl.com/payment/receivePaymentNotify" startTime := time.Now() payRequestJson, _ := json.Marshal(payRequest) log.Printf("payment request: %s", payRequestJson) response, err := client.Execute(request) if err != nil { sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "error", PaymentRequestID: paymentRequestId, AuthState: payment.AuthState, Message: err.Error(), }) return } log.Printf("payment response: %+v", response) log.Printf("payment request cost time: %v ms\\n", time.Since(startTime).Milliseconds()) sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "success", PaymentRequestID: paymentRequestId, AuthState: payment.AuthState, Data: response, }) } `] }, `server-Go-API-code7`), _jsx(AntomChunk, { language: `go`, steps: [`inquire-payment-result`], chunks: [`func handleInquiryPayment(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } var requestMap map[string]string json.NewDecoder(r.Body).Decode(&requestMap) paymentRequestID := requestMap["paymentRequestId"] queryRequest, request := pay.NewAlipayPayQueryRequest() request.PaymentRequestId = paymentRequestID startTime := time.Now() log.Printf("inquiry payment request: %+v", request) response, err := client.Execute(queryRequest) if err != nil { sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "error", PaymentRequestID: paymentRequestID, Message: err.Error(), }) return } log.Printf("inquiry payment response: %+v", response) log.Printf("inquiry payment request cost time: %v ms\\n", time.Since(startTime).Milliseconds()) sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "success", PaymentRequestID: paymentRequestID, Data: response, }) } `] }, `server-Go-API-code8`), _jsx(AntomChunk, { language: `go`, steps: [``], chunks: [`func enableCORS(handler http.HandlerFunc) http.HandlerFunc { return func(w http.ResponseWriter, r *http.Request) { w.Header().Set("Access-Control-Allow-Origin", "*") w.Header().Set("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS") w.Header().Set("Access-Control-Allow-Headers", "Content-Type, X-Requested-With, Authorization") if r.Method == "OPTIONS" { w.WriteHeader(http.StatusOK) return } handler(w, r) } } func sendJSONResponse(w http.ResponseWriter, statusCode int, data interface{}) { w.Header().Set("Content-Type", "application/json") w.WriteHeader(statusCode) json.NewEncoder(w).Encode(data) } // PaymentVO represents payment request data type PaymentVO struct {`, ' AmountValue string `json:"amountValue"`', ' Currency string `json:"currency"`', ' PaymentMethodType string `json:"paymentMethodType"`', ' AuthState string `json:"authState"`', ' TerminalType string `json:"terminalType"`', ' OsType string `json:"osType"`', `} // ApiResponse represents API response structure type ApiResponse struct {`, ' Status string `json:"status"`', ' PaymentRequestID string `json:"paymentRequestId,omitempty"`', ' AuthState string `json:"authState,omitempty"`', ' Message string `json:"message,omitempty"`', ' Data interface{} `json:"data,omitempty"`', `} `] }, `server-Go-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/go/server.go', when: { server: 'Go', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `go`, filename: 'server.go', downloadOnly: false, steps: [`get-integration-resources`, `create-a-consultation-session`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `go`, steps: [``], chunks: [`package main import ( "bytes" "encoding/json" "fmt" "github.com/Rhymond/go-money" "github.com/alipay/global-open-sdk-go/com/alipay/api/model" "github.com/alipay/global-open-sdk-go/com/alipay/api/request/auth" "github.com/alipay/global-open-sdk-go/com/alipay/api/request/notify" "github.com/alipay/global-open-sdk-go/com/alipay/api/request/pay" "github.com/alipay/global-open-sdk-go/com/alipay/api/response" authResponse "github.com/alipay/global-open-sdk-go/com/alipay/api/response/auth" "github.com/alipay/global-open-sdk-go/com/alipay/api/tools" "io" "log" "net/http" "strconv" "sync" "time" defaultAlipayClient "github.com/alipay/global-open-sdk-go/com/alipay/api" "github.com/google/uuid" ) `] }, `server-Go-SDK-other1`), _jsx(AntomChunk, { language: `go`, steps: [`get-integration-resources`], chunks: [`const ( /* replace with your client id
find your client id here: quickStart */ ClientID = "your_client_id" /* replace with your antom public key (used to verify signature)
find your antom public key here: quickStart */ AntomPublicKey = "antom_public_key" /* replace with your private key (used to sign)
please ensure the secure storage of your private key to prevent leakage */ MerchantPrivateKey = "your_private_key" ) // Initialize global client var client *defaultAlipayClient.DefaultAlipayClient func init() { client = defaultAlipayClient.NewDefaultAlipayClient( "https://open-sea-global.alipay.com", ClientID, MerchantPrivateKey, AntomPublicKey) } `] }, `server-Go-SDK-code1`), _jsx(AntomChunk, { language: `go`, steps: [``], chunks: [`// Save the mapping between authState and payment information var authStatePayment sync.Map // Save the mapping between authState and accessToken var authStateAccessToken sync.Map func main() { // Register routes http.HandleFunc("/authorizations/createConsultSession", enableCORS(handleCreateConsultSession)) http.HandleFunc("/authorizations/applyTokenAndPay", enableCORS(handleApplyTokenAndPay)) http.HandleFunc("/authorizations/receiveAuthNotify", enableCORS(handleReceiveAuthNotify)) http.HandleFunc("/payment/pay", enableCORS(handlePay)) http.HandleFunc("/payment/inquiryPayment", enableCORS(handleInquiryPayment)) fmt.Println("Open your browser and visit: http://localhost:8080") log.Fatal(http.ListenAndServe(":8080", nil)) } `] }, `server-Go-SDK-other2`), _jsx(AntomChunk, { language: `go`, steps: [`create-a-consultation-session`], chunks: [`func handleCreateConsultSession(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } var payment PaymentVO json.NewDecoder(r.Body).Decode(&payment) request, sessionRequest := auth.NewAlipayAuthCreateSessionRequest() sessionRequest.ProductCode = model.AGREEMENT_PAYMENT // set agreementInfo // replace with your authState authState := uuid.New().String() agreementInfo := &model.AgreementInfo{AuthState: authState} sessionRequest.AgreementInfo = agreementInfo // set the target payment method for which you are requesting authorization sessionRequest.PaymentMethod = &model.PaymentMethod{PaymentMethodType: payment.PaymentMethodType} // set the authorization scope sessionRequest.Scopes = []model.ScopeType{model.ScopeTypeAgreementPay} `] }, `server-Go-SDK-code2`), _jsx(AntomChunk, { language: `go`, steps: [`specify-the-consultation-redirection-url`], chunks: [` // replace with your authRedirectUrl sessionRequest.PaymentRedirectUrl = "http://localhost:5173/receiveAuthCode" `] }, `server-Go-SDK-code3`), _jsx(AntomChunk, { language: `go`, steps: [`save-payment-information`], chunks: [` // save the payment information corresponding to the authState payment.AuthState = authState authStatePayment.Store(authState, payment) `] }, `server-Go-SDK-code4`), _jsx(AntomChunk, { language: `go`, steps: [``], chunks: [` startTime := time.Now() sessionRequestJson, _ := json.Marshal(sessionRequest) log.Printf("authorization consult request: %s", sessionRequestJson) response, err := client.Execute(request) if err != nil { sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "error", AuthState: authState, Message: err.Error(), }) return } log.Printf("authorization consult response: %+v", response) log.Printf("authorization consult request cost time: %v ms\\n", time.Since(startTime).Milliseconds()) sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "success", AuthState: authState, Data: response, }) } `] }, `server-Go-SDK-other3`), _jsx(AntomChunk, { language: `go`, steps: [`apply-for-the-token-and-pay1`], chunks: [`/* Method 1: Obtain authCode from reconstructed URL */ func handleApplyTokenAndPay(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } var requestMap map[string]string json.NewDecoder(r.Body).Decode(&requestMap) authCode := requestMap["authCode"] authState := requestMap["authState"] request, authApplyTokenRequest := auth.NewAlipayAuthApplyTokenRequest() // get payment method paymentValue, _ := authStatePayment.Load(authState) payment := paymentValue.(PaymentVO) // set grant type authApplyTokenRequest.GrantType = model.GrantTypeAUTHORIZATION_CODE // set the target payment method for which you are requesting authorization authApplyTokenRequest.CustomerBelongsTo = model.CustomerBelongsTo(payment.PaymentMethodType) // set auth code authApplyTokenRequest.AuthCode = authCode startTime := time.Now() authApplyTokenRequestJson, _ := json.Marshal(authApplyTokenRequest) log.Printf("apply token request: %s", authApplyTokenRequestJson) response, err := client.Execute(request) if err != nil { sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "error", AuthState: authState, Message: err.Error(), }) return } log.Printf("apply token response: %+v", response) log.Printf("apply token request cost time: %v ms\\n", time.Since(startTime).Milliseconds()) // save accessToken(in practice, accessToken should be saved to a database, //and you should save a mapping between the authState and the user's payment method) authStateAccessToken.Store(authState, response.(*authResponse.AlipayAuthApplyTokenResponse).AccessToken) // create new request body with payment information paymentJson, _ := json.Marshal(payment) r.Body = io.NopCloser(bytes.NewBuffer(paymentJson)) // invoke the payment method handlePay(w, r) } `] }, `server-Go-SDK-code5`), _jsx(AntomChunk, { language: `go`, steps: [`apply-for-the-token-and-pay2`], chunks: [`/* Method 2: Obtain authCode from authorization notification */ func handleReceiveAuthNotify(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } rawBody, err := io.ReadAll(r.Body) if err != nil { sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "FAIL", ResultMessage: "fail.", ResultStatus: "F", }) return } notifyBody := string(rawBody) // retrieve the required parameters from http request requestURI := r.RequestURI requestMethod := r.Method // retrieve the required parameters from request header requestTime := r.Header.Get("request-time") clientID := r.Header.Get("client-id") signature := r.Header.Get("signature") // verify the signature of notification checkSignature, err := tools.CheckSignature(requestURI, requestMethod, clientID, requestTime, notifyBody, signature, AntomPublicKey) if err != nil || !checkSignature { sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "FAIL", ResultMessage: "fail.", ResultStatus: "F", }) return } // deserialize the notification body var authNotify notify.AlipayAuthNotify if err := json.Unmarshal(rawBody, &authNotify); err != nil { sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "FAIL", ResultMessage: "fail.", ResultStatus: "F", }) return } if authNotify.Result.ResultCode == "SUCCESS" { // save accessToken(in practice, accessToken should be saved to a database, // and you should save a mapping between the authState and the user's payment method) authStateAccessToken.Store(authNotify.AuthState, authNotify.AccessToken) paymentValue, _ := authStatePayment.Load(authNotify.AuthState) payment := paymentValue.(PaymentVO) // Create new request with payment info paymentJson, _ := json.Marshal(payment) r.Body = io.NopCloser(bytes.NewBuffer(paymentJson)) // in practice, you should store a mapping between payment results and users handlePay(w, r) return } sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "SYSTEM_ERROR", ResultMessage: "system error.", ResultStatus: "F", }) } `] }, `server-Go-SDK-code6`), _jsx(AntomChunk, { language: `go`, steps: [`initiate-a-payment-request`], chunks: [`func handlePay(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } var payment PaymentVO json.NewDecoder(r.Body).Decode(&payment) request, payRequest := pay.NewAlipayPayRequest() payRequest.ProductCode = model.AGREEMENT_PAYMENT // get accessToken from authStateAccessToken accessToken, _ := authStateAccessToken.Load(payment.AuthState) // replace with your paymentRequestId paymentRequestId := uuid.New().String() payRequest.PaymentRequestId = paymentRequestId // convert amount unit(in practice, amount should be calculated on your serverside) // For details, please refer to: Usage rules of the Amount object parseFloat, _ := strconv.ParseFloat(payment.AmountValue, 64) amountValue := money.NewFromFloat(parseFloat, payment.Currency).Amount() // set amount amount := &model.Amount{Value: strconv.FormatInt(amountValue, 10), Currency: payment.Currency} payRequest.PaymentAmount = amount // set paymentMethod payRequest.PaymentMethod = &model.PaymentMethod{ PaymentMethodType: payment.PaymentMethodType, PaymentMethodId: accessToken.(string), } // set buyer info buyer := &model.Buyer{ReferenceBuyerId: "yourBuyerId"} // replace with your orderId orderId := uuid.New().String() // set order Info order := &model.Order{ ReferenceOrderId: orderId, OrderDescription: "antom sdk testing order", OrderAmount: amount, Buyer: buyer, } payRequest.Order = order // replace with your notify url // or configure your notify url here: Notification URL payRequest.PaymentNotifyUrl = "http://www.yourNotifyUrl.com/payment/receivePaymentNotify" startTime := time.Now() payRequestJson, _ := json.Marshal(payRequest) log.Printf("payment request: %s", payRequestJson) response, err := client.Execute(request) if err != nil { sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "error", PaymentRequestID: paymentRequestId, AuthState: payment.AuthState, Message: err.Error(), }) return } log.Printf("payment response: %+v", response) log.Printf("payment request cost time: %v ms\\n", time.Since(startTime).Milliseconds()) sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "success", PaymentRequestID: paymentRequestId, AuthState: payment.AuthState, Data: response, }) } `] }, `server-Go-SDK-code7`), _jsx(AntomChunk, { language: `go`, steps: [`inquire-payment-result`], chunks: [`func handleInquiryPayment(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } var requestMap map[string]string json.NewDecoder(r.Body).Decode(&requestMap) paymentRequestID := requestMap["paymentRequestId"] queryRequest, request := pay.NewAlipayPayQueryRequest() request.PaymentRequestId = paymentRequestID startTime := time.Now() log.Printf("inquiry payment request: %+v", request) response, err := client.Execute(queryRequest) if err != nil { sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "error", PaymentRequestID: paymentRequestID, Message: err.Error(), }) return } log.Printf("inquiry payment response: %+v", response) log.Printf("inquiry payment request cost time: %v ms\\n", time.Since(startTime).Milliseconds()) sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "success", PaymentRequestID: paymentRequestID, Data: response, }) } `] }, `server-Go-SDK-code8`), _jsx(AntomChunk, { language: `go`, steps: [``], chunks: [`func enableCORS(handler http.HandlerFunc) http.HandlerFunc { return func(w http.ResponseWriter, r *http.Request) { w.Header().Set("Access-Control-Allow-Origin", "*") w.Header().Set("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS") w.Header().Set("Access-Control-Allow-Headers", "Content-Type, X-Requested-With, Authorization") if r.Method == "OPTIONS" { w.WriteHeader(http.StatusOK) return } handler(w, r) } } func sendJSONResponse(w http.ResponseWriter, statusCode int, data interface{}) { w.Header().Set("Content-Type", "application/json") w.WriteHeader(statusCode) json.NewEncoder(w).Encode(data) } // PaymentVO represents payment request data type PaymentVO struct {`, ' AmountValue string `json:"amountValue"`', ' Currency string `json:"currency"`', ' PaymentMethodType string `json:"paymentMethodType"`', ' AuthState string `json:"authState"`', `} // ApiResponse represents API response structure type ApiResponse struct {`, ' Status string `json:"status"`', ' PaymentRequestID string `json:"paymentRequestId,omitempty"`', ' AuthState string `json:"authState,omitempty"`', ' Message string `json:"message,omitempty"`', ' Data interface{} `json:"data,omitempty"`', `} `] }, `server-Go-SDK-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/.net/server.cs', when: { server: '.NET', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `dotnet`, filename: 'server.cs', downloadOnly: false, steps: [`get-integration-resources`, `initiate-an-authorization-request`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [`using System.Diagnostics; using Microsoft.AspNetCore; using Microsoft.AspNetCore.Mvc; using com.alipay.ams.api.request; using com.alipay.ams.api; using com.alipay.ams.api.entities; using com.alipay.ams.api.request.auth; using com.alipay.ams.api.request.notify; using com.alipay.ams.api.response.auth; using com.alipay.ams.util; using Newtonsoft.Json; using NMoneys; namespace antom_online_payment_sample_dotnet.autodebit.api { /** * sample payment server using Antom API integration mode */ public class Server {`] }, `server-.NET-API-other1`), _jsx(AntomChunk, { language: `dotnet`, steps: [`get-integration-resources`], chunks: [` /** * replace with your client id * find your client id here: quickStart */ public static readonly string CLIENT_ID = "your_client_id"; /** * replace with your antom public key (used to verify signature) * find your antom public key here: quickStart */ public static readonly string ANTOM_PUBLIC_KEY = "antom_public_key"; /** * replace with your private key (used to sign) * please ensure the secure storage of your private key to prevent leakage */ public static readonly string MERCHANT_PRIVATE_KEY = "your_private_key"; public static readonly DefaultAlipayClient defaultAlipayClient = new DefaultAlipayClient("https://open-sea-global.alipay.com", CLIENT_ID, MERCHANT_PRIVATE_KEY, ANTOM_PUBLIC_KEY); `] }, `server-.NET-API-code1`), _jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [` // Save the mapping between authState and payment information public static readonly Dictionary authStatePayment = new Dictionary(); // Save the mapping between authState and accessToken public static readonly Dictionary authStateAccessToken = new Dictionary(); public static void Main(string[] args) { WebHost.CreateDefaultBuilder(args) .UseUrls("http://0.0.0.0:8080") .UseWebRoot("client") .UseStartup() .Build() .Run(); } } public class Startup { public void ConfigureServices(IServiceCollection services) { services.AddMvc().AddNewtonsoftJson(); // Add the Cors service services.AddCors(options => { options.AddPolicy("AllowAllOrigins", builder => { builder.AllowAnyOrigin(); builder.AllowAnyMethod(); builder.AllowAnyHeader(); }); }); } public void Configure(IApplicationBuilder app, IWebHostEnvironment env) { if (env.IsDevelopment()) app.UseDeveloperExceptionPage(); app.UseCors("AllowAllOrigins"); app.UseRouting(); app.UseStaticFiles(); app.UseEndpoints(endpoints => endpoints.MapControllers()); } } [ApiController] [Produces("application/json")] [ApiConventionType(typeof(DefaultApiConventions))] public class PaymentController : ControllerBase {`] }, `server-.NET-API-other2`), _jsx(AntomChunk, { language: `dotnet`, steps: [`initiate-an-authorization-request`], chunks: [` [HttpPost("authorizations/consult")] public IActionResult AuthorizationConsult([FromBody] PaymentVO payment) { var alipayAuthConsultRequest = new AlipayAuthConsultRequest(); // replace with your authState var authState = Guid.NewGuid().ToString(); alipayAuthConsultRequest.AuthState = authState; // set the target payment method for which you are requesting authorization Enum.TryParse(payment.PaymentMethodType, out CustomerBelongsTo customerBelongsTo); alipayAuthConsultRequest.CustomerBelongsTo = customerBelongsTo; // set the authorization scope alipayAuthConsultRequest.Scopes = new[] { ScopeType.AGREEMENT_PAY }; // set terminalType Enum.TryParse(payment.TerminalType, out TerminalType terminalType); alipayAuthConsultRequest.TerminalType = terminalType; // set osType if (!terminalType.Equals(TerminalType.WEB) && !string.IsNullOrWhiteSpace(payment.OsType) && Enum.TryParse(payment.OsType, out OsType osType)) { alipayAuthConsultRequest.OsType = osType; } `] }, `server-.NET-API-code2`), _jsx(AntomChunk, { language: `dotnet`, steps: [`specify-the-consultation-redirection-url`], chunks: [` // replace with your authRedirectUrl alipayAuthConsultRequest.AuthRedirectUrl = "http://localhost:8080/receiveAuthCode.html"; `] }, `server-.NET-API-code3`), _jsx(AntomChunk, { language: `dotnet`, steps: [`save-payment-information`], chunks: [` // save the payment information corresponding to the authState payment.AuthState = authState; Server.authStatePayment[authState] = payment; `] }, `server-.NET-API-code4`), _jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [` try { var stopwatch = new Stopwatch(); stopwatch.Start(); Console.WriteLine("authorization consult request: " + JsonConvert.SerializeObject(alipayAuthConsultRequest, Formatting.Indented)); var alipayAuthConsultResponse = Server.defaultAlipayClient.Execute(alipayAuthConsultRequest); Console.WriteLine("authorization consult response: " + JsonConvert.SerializeObject(alipayAuthConsultResponse, Formatting.Indented)); stopwatch.Stop(); Console.WriteLine("authorization consult request cost time: " + stopwatch.ElapsedMilliseconds + "ms\\n"); return Ok(new ApiResponse("", authState, alipayAuthConsultResponse)); } catch (Exception e) { return Ok(new ApiResponse("", authState, e)); } } `] }, `server-.NET-API-other3`), _jsx(AntomChunk, { language: `dotnet`, steps: [`apply-for-the-token-and-pay1`], chunks: [` ///

/// Method 1: Obtain authCode from reconstructed URL ///

/// Accept two arguments, authState and authCode /// IActionResult [HttpPost("authorizations/applyTokenAndPay")] public IActionResult ApplyTokenAndPay([FromBody] Dictionary map) { map.TryGetValue("authCode", out var authCode); map.TryGetValue("authState", out var authState); var alipayAuthApplyTokenRequest = new AlipayAuthApplyTokenRequest(); // get payment method var paymentMethodType = Server.authStatePayment[authState].PaymentMethodType; // set grant type alipayAuthApplyTokenRequest.GrantType = GrantType.AUTHORIZATION_CODE; // set the target payment method for which you are requesting authorization Enum.TryParse(paymentMethodType, out CustomerBelongsTo customerBelongsTo); alipayAuthApplyTokenRequest.CustomerBelongsTo = customerBelongsTo; // set auth code alipayAuthApplyTokenRequest.AuthCode = authCode; try { var stopwatch = new Stopwatch(); stopwatch.Start(); Console.WriteLine("apply token request: " + JsonConvert.SerializeObject(alipayAuthApplyTokenRequest, Formatting.Indented)); var authApplyTokenResponse = Server.defaultAlipayClient.Execute(alipayAuthApplyTokenRequest); Console.WriteLine("apply token request: " + JsonConvert.SerializeObject(authApplyTokenResponse, Formatting.Indented)); stopwatch.Stop(); Console.WriteLine("apply token request cost time: " + stopwatch.ElapsedMilliseconds + "ms\\n"); // save accessToken(in practice, accessToken should be saved to a database, and you should save a mapping between the authState and the user's payment method) Server.authStateAccessToken[authState] = authApplyTokenResponse.AccessToken; // invoke the payment method return Pay(Server.authStatePayment[authState]); } catch (Exception e) { return Ok(new ApiResponse("", authState, e)); } } `] }, `server-.NET-API-code5`), _jsx(AntomChunk, { language: `dotnet`, steps: [`apply-for-the-token-and-pay2`], chunks: [` ///

/// Method 2: Obtain authCode from authorization notification ///

[HttpPost("authorizations/receiveAuthNotify")] public async Task ReceiveAuthNotify() { // retrieve the required parameters from http request string requestUri = HttpContext.Request.Path; string notifyBody; using (var reader = new StreamReader(Request.Body)) { notifyBody = await reader.ReadToEndAsync(); } // retrieve the required parameters from request header string requestTime = HttpContext.Request.Headers["request-time"]; string clientId = HttpContext.Request.Headers["client-id"]; string signature = HttpContext.Request.Headers["signature"]; try { // verify the signature of notification var realSignature = ""; if (string.IsNullOrWhiteSpace(signature)) { throw new Exception("empty notify signature"); } var parts = signature.Split("signature="); if (parts.Length > 1) { realSignature = parts[1]; } var verifyResult = SignatureUtil.verify(requestUri, clientId, requestTime, Server.ANTOM_PUBLIC_KEY, notifyBody, realSignature); if (!verifyResult) { throw new Exception("Invalid notify signature"); } // deserialize the notification body var authNotify = JsonConvert.DeserializeObject(notifyBody); if (authNotify != null && "SUCCESS".Equals(authNotify.Result.ResultCode)) { // get authCode for applyToken and pay var map = new Dictionary { { "authCode", authNotify.AuthCode }, { "authState", authNotify.AuthState } }; // in practice, you should store a mapping between payment results and users var paymentResult = ApplyTokenAndPay(map); return Ok(new Result() { ResultCode = "SUCCESS", ResultMessage = "success.", ResultStatus = "S" }); } } catch (Exception) { return Ok(new Result() { ResultCode = "FAIL", ResultMessage = "fail.", ResultStatus = "F" }); } return Ok(new Result() { ResultCode = "SYSTEM_ERROR", ResultMessage = "system error.", ResultStatus = "F" }); } `] }, `server-.NET-API-code6`), _jsx(AntomChunk, { language: `dotnet`, steps: [`initiate-a-payment-request`], chunks: [` [HttpPost("payment/pay")] public IActionResult Pay([FromBody] PaymentVO payment) { var alipayPayRequest = new PaymentCreateRequest(); alipayPayRequest.ProductCode = ProductCodeType.AGREEMENT_PAYMENT; // get accessToken from authStateAccessToken Server.authStateAccessToken.TryGetValue(payment.AuthState, out var accessToken); // replace with your paymentRequestId var paymentRequestId = Guid.NewGuid().ToString(); alipayPayRequest.PaymentRequestId = paymentRequestId; // convert amount unit(in practice, amount should be calculated on your serverside) // For details, please refer to: Usage rules of the Amount object var minorIntegralAmount = new Money(decimal.Parse(payment.AmountValue), Currency.Get(payment.Currency)) .MinorIntegralAmount; // set amount var amount = new Amount() { Currency = payment.Currency, Value = minorIntegralAmount.ToString() }; alipayPayRequest.PaymentAmount = amount; // set paymentMethod var paymentMethod = new PaymentMethod(payment.PaymentMethodType) { PaymentMethodId = accessToken }; alipayPayRequest.PaymentMethod = paymentMethod; // set buyer info var buyer = new Buyer() { ReferenceBuyerId = "yourBuyerId" }; // replace with your orderId var orderId = Guid.NewGuid().ToString(); // set order Info alipayPayRequest.Order = new Order() { ReferenceOrderId = orderId, OrderDescription = "antom api testing order", OrderAmount = amount, Buyer = buyer }; // replace with your notify url // or configure your notify url here: Notification URL alipayPayRequest.PaymentNotifyUrl = "http://www.yourNotifyUrl.com/payment/receivePaymentNotify"; try { var stopwatch = new Stopwatch(); stopwatch.Start(); Console.WriteLine("payment request: " + JsonConvert.SerializeObject(alipayPayRequest, Formatting.Indented)); var alipayPayResponse = Server.defaultAlipayClient.Execute(alipayPayRequest); Console.WriteLine("payment response: " + JsonConvert.SerializeObject(alipayPayResponse, Formatting.Indented)); stopwatch.Stop(); Console.WriteLine("payment request cost time: " + stopwatch.ElapsedMilliseconds + "ms\\n"); return Ok(new ApiResponse(paymentRequestId, payment.AuthState, alipayPayResponse)); } catch (Exception e) { return Ok(new ApiResponse(paymentRequestId, payment.AuthState, e)); } } `] }, `server-.NET-API-code7`), _jsx(AntomChunk, { language: `dotnet`, steps: [`inquire-payment-result`], chunks: [` [HttpPost("payment/inquiryPayment")] public IActionResult InquiryPayment([FromBody] Dictionary map) { map.TryGetValue("paymentRequestId", out var paymentRequestId); var alipayPayQueryRequest = new PaymentInquiryRequest(); alipayPayQueryRequest.PaymentRequestId = paymentRequestId; try { var stopwatch = new Stopwatch(); stopwatch.Start(); Console.WriteLine("inquiry payment request: " + JsonConvert.SerializeObject(alipayPayQueryRequest, Formatting.Indented)); var alipayPayQueryResponse = Server.defaultAlipayClient.Execute(alipayPayQueryRequest); Console.WriteLine("inquiry payment response: " + JsonConvert.SerializeObject(alipayPayQueryResponse, Formatting.Indented)); stopwatch.Stop(); Console.WriteLine("inquiry payment request cost time: " + stopwatch.ElapsedMilliseconds + "ms\\n"); return Ok(new ApiResponse(paymentRequestId, "", alipayPayQueryResponse)); } catch (Exception e) { return Ok(new ApiResponse(paymentRequestId, "", e)); } }`] }, `server-.NET-API-code8`), _jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [` } public class PaymentVO { public string AmountValue { get; set; } public string Currency { get; set; } public string PaymentMethodType { get; set; } public string? AuthState { get; set; } public string TerminalType { get; set; } = "WEB"; public string? OsType { get; set; } } public class ApiResponse { public string Status { get; set; } = "success"; public string PaymentRequestId { get; set; } public string AuthState { get; set; } public string Message { get; set; } public object Data { get; set; } public ApiResponse(string paymentRequestId, string authState, object data) { PaymentRequestId = paymentRequestId; AuthState = authState; Data = data; } public ApiResponse(string paymentRequestId, string authState, Exception e) { PaymentRequestId = paymentRequestId; AuthState = authState; Status = "error"; Message = e.Message; } } } `] }, `server-.NET-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/server/.net/server.cs', when: { server: '.NET', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `dotnet`, filename: 'server.cs', downloadOnly: false, steps: [`get-integration-resources`, `create-a-consultation-session`, `specify-the-consultation-redirection-url`, `save-payment-information`, `apply-for-the-token-and-pay1`, `apply-for-the-token-and-pay2`, `initiate-a-payment-request`, `inquire-payment-result`], children: [_jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [`using System.Diagnostics; using Microsoft.AspNetCore; using Microsoft.AspNetCore.Mvc; using com.alipay.ams.api.request; using com.alipay.ams.api; using com.alipay.ams.api.entities; using com.alipay.ams.api.request.auth; using com.alipay.ams.api.request.notify; using com.alipay.ams.api.response.auth; using com.alipay.ams.util; using Newtonsoft.Json; using NMoneys; namespace antom_online_payment_sample_dotnet.autodebit.sdk { /** * sample payment server using Antom SDK integration mode */ public class Server {`] }, `server-.NET-SDK-other1`), _jsx(AntomChunk, { language: `dotnet`, steps: [`get-integration-resources`], chunks: [` /** * replace with your client id * find your client id here: quickStart */ public static readonly string CLIENT_ID = "your_client_id"; /** * replace with your antom public key (used to verify signature) * find your antom public key here: quickStart */ public static readonly string ANTOM_PUBLIC_KEY = "antom_public_key"; /** * replace with your private key (used to sign) * please ensure the secure storage of your private key to prevent leakage */ public static readonly string MERCHANT_PRIVATE_KEY = "your_private_key"; public static readonly DefaultAlipayClient defaultAlipayClient = new DefaultAlipayClient("https://open-sea-global.alipay.com", CLIENT_ID, MERCHANT_PRIVATE_KEY, ANTOM_PUBLIC_KEY); `] }, `server-.NET-SDK-code1`), _jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [` // Save the mapping between authState and payment information public static readonly Dictionary authStatePayment = new Dictionary(); // Save the mapping between authState and accessToken public static readonly Dictionary authStateAccessToken = new Dictionary(); public static void Main(string[] args) { WebHost.CreateDefaultBuilder(args) .UseUrls("http://0.0.0.0:8080") .UseWebRoot("client") .UseStartup() .Build() .Run(); } } public class Startup { public void ConfigureServices(IServiceCollection services) { services.AddMvc().AddNewtonsoftJson(); // Add the Cors service services.AddCors(options => { options.AddPolicy("AllowAllOrigins", builder => { builder.AllowAnyOrigin(); builder.AllowAnyMethod(); builder.AllowAnyHeader(); }); }); } public void Configure(IApplicationBuilder app, IWebHostEnvironment env) { if (env.IsDevelopment()) app.UseDeveloperExceptionPage(); app.UseCors("AllowAllOrigins"); app.UseRouting(); app.UseStaticFiles(); app.UseEndpoints(endpoints => endpoints.MapControllers()); } } [ApiController] [Produces("application/json")] [ApiConventionType(typeof(DefaultApiConventions))] public class PaymentController : ControllerBase {`] }, `server-.NET-SDK-other2`), _jsx(AntomChunk, { language: `dotnet`, steps: [`create-a-consultation-session`], chunks: [` [HttpPost("authorizations/createConsultSession")] public IActionResult CreateConsultSession([FromBody] PaymentVO payment) { var alipayAuthCreateSessionRequest = new AlipayAuthCreateSessionRequest(); alipayAuthCreateSessionRequest.ProductCode = ProductCodeType.AGREEMENT_PAYMENT; // set agreementInfo // replace with your authState var authState = Guid.NewGuid().ToString(); var agreementInfo = new AgreementInfo() { AuthState = authState }; alipayAuthCreateSessionRequest.AgreementInfo = agreementInfo; // set the target payment method for which you are requesting authorization var paymentMethod = new PaymentMethod(payment.PaymentMethodType); alipayAuthCreateSessionRequest.PaymentMethod = paymentMethod; // set the authorization scope alipayAuthCreateSessionRequest.Scopes = new[] { ScopeType.AGREEMENT_PAY }; `] }, `server-.NET-SDK-code2`), _jsx(AntomChunk, { language: `dotnet`, steps: [`specify-the-consultation-redirection-url`], chunks: [` // replace with your authRedirectUrl alipayAuthCreateSessionRequest.PaymentRedirectUrl = "http://localhost:8080/receiveAuthCode"; `] }, `server-.NET-SDK-code3`), _jsx(AntomChunk, { language: `dotnet`, steps: [`save-payment-information`], chunks: [` // save the payment information corresponding to the authState payment.AuthState = authState; Server.authStatePayment[authState] = payment; `] }, `server-.NET-SDK-code4`), _jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [` try { var stopwatch = new Stopwatch(); stopwatch.Start(); Console.WriteLine("authorization consult request: " + JsonConvert.SerializeObject(alipayAuthCreateSessionRequest, Formatting.Indented)); var alipayAuthCreateSessionResponse = Server.defaultAlipayClient.Execute(alipayAuthCreateSessionRequest); Console.WriteLine("authorization consult response: " + JsonConvert.SerializeObject(alipayAuthCreateSessionResponse, Formatting.Indented)); stopwatch.Stop(); Console.WriteLine("authorization consult request cost time: " + stopwatch.ElapsedMilliseconds + "ms\\n"); return Ok(new ApiResponse("", authState, alipayAuthCreateSessionResponse)); } catch (Exception e) { return Ok(new ApiResponse("", authState, e)); } } `] }, `server-.NET-SDK-other3`), _jsx(AntomChunk, { language: `dotnet`, steps: [`apply-for-the-token-and-pay1`], chunks: [` ///

/// Method 1: Obtain authCode from reconstructed URL ///

/// Accept two arguments, authState and authCode [HttpPost("authorizations/applyTokenAndPay")] public IActionResult ApplyTokenAndPay([FromBody] Dictionary map) { map.TryGetValue("authCode", out var authCode); map.TryGetValue("authState", out var authState); var alipayPayRequest = new AlipayAuthApplyTokenRequest(); // get payment method var paymentMethodType = Server.authStatePayment[authState].PaymentMethodType; // set grant type alipayPayRequest.GrantType = GrantType.AUTHORIZATION_CODE; // set the target payment method for which you are requesting authorization Enum.TryParse(paymentMethodType, out CustomerBelongsTo customerBelongsTo); alipayPayRequest.CustomerBelongsTo = customerBelongsTo; // set auth code alipayPayRequest.AuthCode = authCode; try { var stopwatch = new Stopwatch(); stopwatch.Start(); Console.WriteLine("apply token request: " + JsonConvert.SerializeObject(alipayPayRequest, Formatting.Indented)); var authApplyTokenResponse = Server.defaultAlipayClient.Execute(alipayPayRequest); Console.WriteLine("apply token request: " + JsonConvert.SerializeObject(authApplyTokenResponse, Formatting.Indented)); stopwatch.Stop(); Console.WriteLine("apply token request cost time: " + stopwatch.ElapsedMilliseconds + "ms\\n"); // save accessToken(in practice, accessToken should be saved to a database, and you should save a mapping between the authState and the user's payment method) Server.authStateAccessToken[authState] = authApplyTokenResponse.AccessToken; // invoke the payment method return Pay(Server.authStatePayment[authState]); } catch (Exception e) { return Ok(new ApiResponse("", authState, e)); } } `] }, `server-.NET-SDK-code5`), _jsx(AntomChunk, { language: `dotnet`, steps: [`apply-for-the-token-and-pay2`], chunks: [` ///

/// Method 2: Obtain authCode from authorization notification ///

Auto Debit Demo

Choose your payment method

`] }, `Web-HTML-API-code1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.js', when: { client: 'HTML', server: 'Java', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'src/main/resources/static/index.js', downloadOnly: false, steps: [`get-auth-continuation-link`, `handle-the-auth-redirection`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`/** * The integration method of the Antom API. */ window.selectedPaymentOptionId = "RABBIT_LINE_PAY"; window.amount = { currency: "THB", value: "10000.00", mul: 1 }; const paymentOptions = [ { label: "Rabbit Line Pay", value: "RABBIT_LINE_PAY", icon: "https://gw.alipay.com/icon/medium/default/RABBIT_LINE_PAY.svg", }, { label: "GCASH", value: "GCASH", icon: "https://gw.alipay.com/icon/medium/default/GCASH.svg", }, { label: "GrabPay SG", value: "GRABPAY_SG", icon: "https://gw.alipay.com/icon/medium/default/GRABPAY_SG.svg", }, ]; const currencyMap = { RABBIT_LINE_PAY: { currency: "THB", value: "10000.00", }, GCASH: { currency: "PHP", value: "5500.00", }, GRABPAY_SG: { currency: "SGD", value: "380.00", }, }; // Step 1: Get payment session data from the endpoint and rediret to external pages.`] }, `Web-HTML-API-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-auth-continuation-link`], chunks: [`async function handleSubmit() { async function doPayment() { setShowLoader(true); if (!window.selectedPaymentOptionId) { showAlert("Waring", "Please select a payment method!", "warning"); return; } // Define the URL for your backend endpoint const url = "http://localhost:8080/authorizations/consult"; const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ // in practice, amount should be calculated on your server side amountValue: window.amount.value, currency: window.amount.currency, paymentMethodType: window.selectedPaymentOptionId, }), }; try { const response = await fetch(url, config); if (!response.ok) { throw new Error("HTTP error! Status: " + response.status); } const res = await response.json(); if (res.status === "success") return res; throw new Error(res.message || "Invalid response format"); } catch (error) { showAlert( "Error", error.message || "Failed to fetch authorizations/consult data", "error" ); return null; } finally { setBtnLoading(false); } } `] }, `Web-HTML-API-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` try { setShowLoader(true); const paymentResponse = await doPayment();`] }, `Web-HTML-API-other2`), _jsx(AntomChunk, { language: `javascript`, steps: [`handle-the-auth-redirection`], chunks: [` window.top.location.href = paymentResponse.data.normalUrl;`] }, `Web-HTML-API-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` } catch (error) { showAlert( error.code, error.message || "Failed to process payment", "error" ); } finally { setShowLoader(false); } } // Step 2: Call inquiryPayment endpoint to get the payment status.`] }, `Web-HTML-API-other3`), _jsx(AntomChunk, { language: `javascript`, steps: [`display-the-payment-result`], chunks: [`async function inquiryPayment(paymentRequestId) { // Define the URL for your backend endpoint const url = "http://localhost:8080/payment/inquiryPayment"; const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ paymentRequestId }), }; const response = await fetch(url, config); if (!response.ok) throw new Error("Network response was not ok"); const res = await response.json(); return res.status === "success" ? res.data.paymentStatus : "ERROR"; } `] }, `Web-HTML-API-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 3: Create Polling mechanism to retrieve the payment result. async function pollPaymentResult() { const paymentRequestId = new URLSearchParams(window.location.search).get( "paymentRequestId" ); if (!paymentRequestId) return; const poll = async () => { let status = "PROCESSING"; let retries = 0; const maxRetries = 5; setShowLoader(true); while (retries < maxRetries) { try { const statusResult = await inquiryPayment(paymentRequestId); status = statusResult ?? "ERROR"; } catch (error) { status = "ERROR"; } retries += 1; if (status === "SUCCESS" || retries === maxRetries) { setShowLoader(false); return handlePaymentStatus(status); } await new Promise((resolve) => setTimeout(resolve, 2000)); } }; poll(); } // Step 3: Bind handleSubmit function to submit button. document.getElementById("submit").addEventListener("click", handleSubmit); // Step 4: Render payment options & check start polling result. document.addEventListener("DOMContentLoaded", () => { appendPaymentOptions(paymentOptions); pollPaymentResult(); }); // ------- User Interaction Section ------- function appendPaymentOptions(options) { const paymentOptionsContainer = document.getElementById("checkout-box"); paymentOptionsContainer.innerHTML = ""; const frag = document.createDocumentFragment(); options.forEach((option) => { const label = document.createElement("label"); label.className = "payment-option "; const input = document.createElement("input"); input.type = "radio"; input.className = "radio-input"; input.name = "radio"; input.value = option.value; input.checked = option.value === window.selectedPaymentOptionId; if (input.checked) { label.classList.add("selected"); } input.addEventListener("change", selectPaymentOption); const span = document.createElement("span"); span.className = "radio-button"; const icon = document.createElement("img"); icon.src = option.icon; icon.className = "payment-icon"; const textNode = document.createTextNode(option.label); label.append(input, span, icon, textNode); frag.appendChild(label); }); paymentOptionsContainer.appendChild(frag); } function selectPaymentOption(event) { const targetValue = event.target.value; if (targetValue) { document .querySelectorAll(".payment-option") .forEach((label) => label.classList.remove("selected")); const selectedLabel = event.target.parentElement; selectedLabel.classList.add("selected"); window.selectedPaymentOptionId = targetValue; window.amount = { ...window.amount, currency: currencyMap[targetValue].currency, value: currencyMap[targetValue].value, }; const submitElement = document.getElementById("submit");`, ' submitElement.innerText = `Pay \${window.amount.currency} \${window.amount.value}`;', ` } } function handlePaymentStatus(status) { switch (status) { case "SUCCESS": showPaymentResult( "Payment Successful", "Thank you for your payment! We will ship out your order as soon as possible.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ", "#e5f7f1", "#b7e9d9" ); break; case "FAIL": showPaymentResult( "Payment Failed", "Please return to the merchant order page and resubmit your payment.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", "rgba(255, 91, 77, 0.10)", "rgba(255, 91, 77, 0.20)" ); break; case "ERROR": showPaymentResult( "Error", "An error occurred while checking the payment status. Please try again or contact support.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", "rgba(255, 91, 77, 0.10)", "rgba(255, 91, 77, 0.20)" ); break; default: showPaymentResult( "Payment Processing", "Please return to the merchant order page and resubmit your payment.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ", "rgba(255, 159, 26, 0.10)", "rgba(255, 159, 26, 0.20) " ); } } function showPaymentResult(title, message, icon, bgColor, borderColor) { const messageContainer = document.querySelector("#result-container"); if (!messageContainer) return; messageContainer.classList.remove("hidden"); messageContainer.style.backgroundColor = bgColor; messageContainer.style.borderColor = borderColor; document.getElementById("message").innerText = title; document.getElementById("content").innerText = message; document.getElementById("resultIcon").setAttribute("src", icon); setTimeout(() => { messageContainer.classList.add("hidden"); messageContainer.style.backgroundColor = ""; messageContainer.style.borderColor = ""; document.getElementById("message").innerText = ""; document.getElementById("content").innerText = ""; document.getElementById("resultIcon").setAttribute("src", ""); window.location.href = "./index.html"; }, 8000); } function setBtnLoading(isLoading) { const submitElement = document.getElementById("submit"); submitElement.disabled = isLoading; submitElement.classList.toggle("disabled", isLoading); } function setShowLoader(show) { const loader = document.getElementById("overlay"); loader.style.display = show === true ? "flex" : "none"; } function showAlert(title, subTitle, type) { const icons = { warning: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ", error: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", success: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ", }; const containerDesktop = document.getElementById("container-desktop"); const mockup = document.getElementById("mockup"); const alertIcon = document.getElementById("alert-icon"); const containerTitle = document.getElementById("container-title"); const containerSubTitle = document.getElementById("container-subTitle"); containerDesktop.style.display = "block"; mockup.style.display = "block"; alertIcon.src = icons[type] || ""; containerTitle.textContent = title || ""; containerSubTitle.textContent = subTitle || ""; alertIcon.style.display = icons[type] ? "block" : "none"; containerTitle.style.display = title ? "block" : "none"; containerSubTitle.style.display = subTitle ? "block" : "none"; } function closeAlert() { document.getElementById("container-desktop").style.display = "none"; document.getElementById("mockup").style.display = "none"; } document.getElementById("alert-ok-btn").addEventListener("click", closeAlert); `] }, `Web-HTML-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.html', when: { client: 'HTML', server: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `html`, filename: 'src/main/resources/static/receiveAuthCode.html', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `html`, steps: [``], chunks: [` Antom Demo Checkout

`] }, `Web-HTML-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.js', when: { client: 'HTML', server: 'Java', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'src/main/resources/static/receiveAuthCode.js', downloadOnly: false, steps: [`get-and-process-auth-info`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`/** * The integration method of the Antom API. */ `] }, `Web-HTML-API-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-and-process-auth-info`], chunks: [`async function validateAuthCode(){ // Define the URL for your backend endpoint const url = 'http://localhost:8080/authorizations/applyTokenAndPay'; const urlObject = new URL(window.location.href); const queryString = urlObject.search; const params = new URLSearchParams(queryString); const authCode = params.get('authCode'); const authState = params.get('authState'); // if(!authCode || !authState) { // return window.location.href= "/"; // }; setShowLoader(true); const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ authCode, authState }), }; try { const response = await fetch(url, config); if (!response.ok) throw new Error("Network response was not ok"); const res = await response.json(); if(res.status === "success" ) { const baseUrl = 'http://localhost:8080'; const params = new URLSearchParams({ paymentRequestId: res.data.paymentRequestId, }).toString();`, ' window.location.href = `\${baseUrl}?\${params}`;', ` } } finally { setShowLoader(false); } } `] }, `Web-HTML-API-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`document.addEventListener("DOMContentLoaded", async () => { validateAuthCode(); }); // ------- User Interaction Section ------- // Set Loading State function setShowLoader(show) { const loader = document.getElementById('overlay'); loader.style.display = show === true ? 'flex' : 'none'; } `] }, `Web-HTML-API-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.css', when: { client: 'HTML', server: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `css`, filename: 'src/main/resources/static/index.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `css`, steps: [``], chunks: [`body { margin: 0; padding: 0; font-family: 'PingFang SC'; display: flex; flex-direction: column; height: 100vh; margin: 0 auto; } .antom-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } header { width: 100%; height: 72px; background: #fdfdfd; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .header-content { margin: 0 auto; width: 70%; height: 100%; display: flex; align-items: center; justify-content: flex-start; } .header-content-img { width: 120px; } .header-content .subtitle { margin-left: 28px; color: #bcbcbc; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; } .content { display: flex; flex-direction: column; position: relative; overflow: hidden; margin-top: 82px; height: 800px; flex-shrink: 0; border-radius: 40px; background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .headerContent { display: flex; align-items: center; justify-content: flex-start; } .headerContent .logo { margin: 0 10px; } .headerContent .testDemo { width: 62px; height: 16px; display: flex; align-items: center; justify-content: center; border-radius: 4px; background: rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.4); font-size: 8px; font-weight: 400; } .checkout-container { margin: 0 auto; width: 100%; display: flex; flex-direction: column; flex-grow: 1; width: 660px; height: 100%; padding: 162px 64px 76px 56px; box-sizing: border-box; } p { display: inline-flex; align-items: center; gap: 10px; color: #2a3a52; } .payment-option { border: 2px solid #000; padding: 10px; margin-bottom: 20px; display: none; cursor: pointer; } .payment-option.selected { border-color: #1650ff; } .show { display: block; } .submit { width: 100%; height: 56px; border-radius: 12px; background: #1650ff; color: #fff; border: none; text-decoration: none; cursor: pointer; font-size: 16px; display: block; margin-top: 32px; } .radio-group { display: flex; flex-direction: column; } .radio-group label { display: flex; align-items: center; margin-bottom: 8px; padding: 8px 16px; border: 1px solid #ebebeb; background: #fff; border-radius: 12px; color: #2a3a52; font-size: 16px; font-weight: 400; line-height: 24px; } .radio-group label.show { display: flex; } .radio-input { display: none; } .radio-button { width: 14px; height: 14px; border: 1px solid #abb9cc; margin-right: 8px; border-radius: 50%; } .radio-input:checked + .radio-button { border: 4px solid #1650ff; width: 8px; height: 8px; } .payment-icon { vertical-align: middle; display: flex; width: 32px; height: 32px; margin: 0 12px; padding: 4px 4.001px 3.996px 3.999px; justify-content: center; align-items: center; border-radius: 8px; border: 0.5px solid #f5f5f5; background: #fcfcfc; } .disabled { cursor: not-allowed; opacity: 0.5; pointer-events: none; } .hidden { display: none; } #result-container { display: flex; flex-direction: column; margin-top: 14px; align-items: flex-start; border-radius: 12px; border: 1px solid rgba(0, 0, 0, 0); padding: 12px 16px; color: #2a3a52; font-size: 13px; font-weight: 500; line-height: 20px; } .result-title { display: flex; align-items: center; } .result-title img { width: 20px; margin-right: 12px; } #content { color: #7c8ca3; text-align: center; font-size: 12px; font-weight: 400; line-height: 18px; margin-top: 8px; padding-left: 32px; } .mockup { display: none; z-index: 1000; width: 100vw; height: 100vh; position: fixed; top: 0px; left: 0px; background: rgba(0, 0, 0, 0.6); } .container-desktop { display: none; width: 370px; height: 248px; position: fixed; top: 50%; left: 50%; z-index: 1001; border-radius: 12px; overflow: hidden; transform-origin: 50% 50%; transform: translate(-50%, -50%); box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1); padding: 40px 0px 24px 0px; background-color: #fff; } @keyframes container-zoom-in { 0% { transform: translate(-50%, -50%) scale(0.4); opacity: 0; } 80% { opacity: 1; } 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); } } .desktop-animation { animation: container-zoom-in 0.3s ease-in-out; animation-fill-mode: forwards; } .container-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } .container-content img { width: 64px; height: 64px; } .container-title { color: var(--Content-Primary, #2a3a52); text-align: center; font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .container-subTitle { color: #7c8ca3; text-align: center; font-size: 14px; font-weight: 400; line-height: 20px; margin-top: 24px; } .container-btn { display: flex; width: 338px; height: 48px; padding: 0px 24px; justify-content: center; align-items: center; border-radius: var(---Button, 12px); background: var(--Action-Normal, #1650ff); border: none; cursor: pointer; color: var(--Content-Quaternary, #fff); font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .footer { display: flex; justify-content: center; margin-top: 20px; color: #bcbcbc; font-size: 16px; font-weight: 500; line-height: 24px; } .gotoTest { color: #1650ff; margin: 0 4px; text-decoration: none; } .overlay { position: fixed; display: none; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); align-items: center; justify-content: center; z-index: 1000; } .loader { border: 5px solid rgba(0, 0, 0, 0.1); border-left-color: #3498db; border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } `] }, `Web-HTML-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.css', when: { client: 'HTML', server: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `css`, filename: 'src/main/resources/static/receiveAuthCode.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `css`, steps: [``], chunks: [`.overlay { position: fixed; display: none; top: 0; left: 0; width: 100%; height: 100%; align-items: center; justify-content: center; z-index: 1000; } .loader { border: 5px solid rgba(0, 0, 0, 0.1); border-left-color: #3498db; border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } `] }, `Web-HTML-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.html', when: { client: 'HTML', integration_type: 'API' }, unless: { server: 'Java' }, children: _jsx(AntomFile, { language: `html`, filename: 'client/index.html', downloadOnly: false, steps: [`build-the-autodebit-page`], children: _jsx(AntomChunk, { language: `html`, steps: [`build-the-autodebit-page`], chunks: [` Antom Demo Auto Debit

Auto Debit Demo

Choose your payment method

`] }, `Web-HTML-API-code1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.js', when: { client: 'HTML', integration_type: 'API' }, unless: { server: 'Java' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/index.js', downloadOnly: false, steps: [`get-auth-continuation-link`, `handle-the-auth-redirection`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`/** * The integration method of the Antom API. */ window.selectedPaymentOptionId = "RABBIT_LINE_PAY"; window.amount = { currency: "THB", value: "10000.00", mul: 1 }; const paymentOptions = [ { label: "Rabbit Line Pay", value: "RABBIT_LINE_PAY", icon: "https://gw.alipay.com/icon/medium/default/RABBIT_LINE_PAY.svg", }, { label: "GCASH", value: "GCASH", icon: "https://gw.alipay.com/icon/medium/default/GCASH.svg", }, { label: "GrabPay SG", value: "GRABPAY_SG", icon: "https://gw.alipay.com/icon/medium/default/GRABPAY_SG.svg", }, ]; const currencyMap = { RABBIT_LINE_PAY: { currency: "THB", value: "10000.00", }, GCASH: { currency: "PHP", value: "5500.00", }, GRABPAY_SG: { currency: "SGD", value: "380.00", }, }; // Step 1: Get payment session data from the endpoint and rediret to external pages.`] }, `Web-HTML-API-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-auth-continuation-link`], chunks: [`async function handleSubmit() { async function doPayment() { setShowLoader(true); if (!window.selectedPaymentOptionId) { showAlert("Waring", "Please select a payment method!", "warning"); return; } // Define the URL for your backend endpoint const url = "http://localhost:8080/authorizations/consult"; const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ // in practice, amount should be calculated on your server side amountValue: window.amount.value, currency: window.amount.currency, paymentMethodType: window.selectedPaymentOptionId, }), }; try { const response = await fetch(url, config); if (!response.ok) { throw new Error("HTTP error! Status: " + response.status); } const res = await response.json(); if (res.status === "success") return res; throw new Error(res.message || "Invalid response format"); } catch (error) { showAlert( "Error", error.message || "Failed to fetch authorizations/consult data", "error" ); return null; } finally { setBtnLoading(false); } } `] }, `Web-HTML-API-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` try { setShowLoader(true); const paymentResponse = await doPayment();`] }, `Web-HTML-API-other2`), _jsx(AntomChunk, { language: `javascript`, steps: [`handle-the-auth-redirection`], chunks: [` window.top.location.href = paymentResponse.data.normalUrl;`] }, `Web-HTML-API-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` } catch (error) { showAlert( error.code, error.message || "Failed to process payment", "error" ); } finally { setShowLoader(false); } } // Step 2: Call inquiryPayment endpoint to get the payment status.`] }, `Web-HTML-API-other3`), _jsx(AntomChunk, { language: `javascript`, steps: [`display-the-payment-result`], chunks: [`async function inquiryPayment(paymentRequestId) { // Define the URL for your backend endpoint const url = "http://localhost:8080/payment/inquiryPayment"; const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ paymentRequestId }), }; const response = await fetch(url, config); if (!response.ok) throw new Error("Network response was not ok"); const res = await response.json(); return res.status === "success" ? res.data.paymentStatus : "ERROR"; } `] }, `Web-HTML-API-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 3: Create Polling mechanism to retrieve the payment result. async function pollPaymentResult() { const paymentRequestId = new URLSearchParams(window.location.search).get( "paymentRequestId" ); if (!paymentRequestId) return; const poll = async () => { let status = "PROCESSING"; let retries = 0; const maxRetries = 5; setShowLoader(true); while (retries < maxRetries) { try { const statusResult = await inquiryPayment(paymentRequestId); status = statusResult ?? "ERROR"; } catch (error) { status = "ERROR"; } retries += 1; if (status === "SUCCESS" || retries === maxRetries) { setShowLoader(false); return handlePaymentStatus(status); } await new Promise((resolve) => setTimeout(resolve, 2000)); } }; poll(); } // Step 3: Bind handleSubmit function to submit button. document.getElementById("submit").addEventListener("click", handleSubmit); // Step 4: Render payment options & check start polling result. document.addEventListener("DOMContentLoaded", () => { appendPaymentOptions(paymentOptions); pollPaymentResult(); }); // ------- User Interaction Section ------- function appendPaymentOptions(options) { const paymentOptionsContainer = document.getElementById("checkout-box"); paymentOptionsContainer.innerHTML = ""; const frag = document.createDocumentFragment(); options.forEach((option) => { const label = document.createElement("label"); label.className = "payment-option "; const input = document.createElement("input"); input.type = "radio"; input.className = "radio-input"; input.name = "radio"; input.value = option.value; input.checked = option.value === window.selectedPaymentOptionId; if (input.checked) { label.classList.add("selected"); } input.addEventListener("change", selectPaymentOption); const span = document.createElement("span"); span.className = "radio-button"; const icon = document.createElement("img"); icon.src = option.icon; icon.className = "payment-icon"; const textNode = document.createTextNode(option.label); label.append(input, span, icon, textNode); frag.appendChild(label); }); paymentOptionsContainer.appendChild(frag); } function selectPaymentOption(event) { const targetValue = event.target.value; if (targetValue) { document .querySelectorAll(".payment-option") .forEach((label) => label.classList.remove("selected")); const selectedLabel = event.target.parentElement; selectedLabel.classList.add("selected"); window.selectedPaymentOptionId = targetValue; window.amount = { ...window.amount, currency: currencyMap[targetValue].currency, value: currencyMap[targetValue].value, }; const submitElement = document.getElementById("submit");`, ' submitElement.innerText = `Pay \${window.amount.currency} \${window.amount.value}`;', ` } } function handlePaymentStatus(status) { switch (status) { case "SUCCESS": showPaymentResult( "Payment Successful", "Thank you for your payment! We will ship out your order as soon as possible.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ", "#e5f7f1", "#b7e9d9" ); break; case "FAIL": showPaymentResult( "Payment Failed", "Please return to the merchant order page and resubmit your payment.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", "rgba(255, 91, 77, 0.10)", "rgba(255, 91, 77, 0.20)" ); break; case "ERROR": showPaymentResult( "Error", "An error occurred while checking the payment status. Please try again or contact support.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", "rgba(255, 91, 77, 0.10)", "rgba(255, 91, 77, 0.20)" ); break; default: showPaymentResult( "Payment Processing", "Please return to the merchant order page and resubmit your payment.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ", "rgba(255, 159, 26, 0.10)", "rgba(255, 159, 26, 0.20) " ); } } function showPaymentResult(title, message, icon, bgColor, borderColor) { const messageContainer = document.querySelector("#result-container"); if (!messageContainer) return; messageContainer.classList.remove("hidden"); messageContainer.style.backgroundColor = bgColor; messageContainer.style.borderColor = borderColor; document.getElementById("message").innerText = title; document.getElementById("content").innerText = message; document.getElementById("resultIcon").setAttribute("src", icon); setTimeout(() => { messageContainer.classList.add("hidden"); messageContainer.style.backgroundColor = ""; messageContainer.style.borderColor = ""; document.getElementById("message").innerText = ""; document.getElementById("content").innerText = ""; document.getElementById("resultIcon").setAttribute("src", ""); window.location.href = "./index.html"; }, 8000); } function setBtnLoading(isLoading) { const submitElement = document.getElementById("submit"); submitElement.disabled = isLoading; submitElement.classList.toggle("disabled", isLoading); } function setShowLoader(show) { const loader = document.getElementById("overlay"); loader.style.display = show === true ? "flex" : "none"; } function showAlert(title, subTitle, type) { const icons = { warning: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ", error: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", success: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ", }; const containerDesktop = document.getElementById("container-desktop"); const mockup = document.getElementById("mockup"); const alertIcon = document.getElementById("alert-icon"); const containerTitle = document.getElementById("container-title"); const containerSubTitle = document.getElementById("container-subTitle"); containerDesktop.style.display = "block"; mockup.style.display = "block"; alertIcon.src = icons[type] || ""; containerTitle.textContent = title || ""; containerSubTitle.textContent = subTitle || ""; alertIcon.style.display = icons[type] ? "block" : "none"; containerTitle.style.display = title ? "block" : "none"; containerSubTitle.style.display = subTitle ? "block" : "none"; } function closeAlert() { document.getElementById("container-desktop").style.display = "none"; document.getElementById("mockup").style.display = "none"; } document.getElementById("alert-ok-btn").addEventListener("click", closeAlert); `] }, `Web-HTML-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.html', when: { client: 'HTML', integration_type: 'API' }, unless: { server: 'Java' }, children: _jsx(AntomFile, { language: `html`, filename: 'client/receiveAuthCode.html', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `html`, steps: [``], chunks: [` Antom Demo Checkout

`] }, `Web-HTML-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.js', when: { client: 'HTML', integration_type: 'API' }, unless: { server: 'Java' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/receiveAuthCode.js', downloadOnly: false, steps: [`get-and-process-auth-info`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`/** * The integration method of the Antom API. */ `] }, `Web-HTML-API-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-and-process-auth-info`], chunks: [`async function validateAuthCode(){ // Define the URL for your backend endpoint const url = 'http://localhost:8080/authorizations/applyTokenAndPay'; const urlObject = new URL(window.location.href); const queryString = urlObject.search; const params = new URLSearchParams(queryString); const authCode = params.get('authCode'); const authState = params.get('authState'); // if(!authCode || !authState) { // return window.location.href= "/"; // }; setShowLoader(true); const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ authCode, authState }), }; try { const response = await fetch(url, config); if (!response.ok) throw new Error("Network response was not ok"); const res = await response.json(); if(res.status === "success" ) { const baseUrl = 'http://localhost:8080'; const params = new URLSearchParams({ paymentRequestId: res.data.paymentRequestId, }).toString();`, ' window.location.href = `\${baseUrl}?\${params}`;', ` } } finally { setShowLoader(false); } } `] }, `Web-HTML-API-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`document.addEventListener("DOMContentLoaded", async () => { validateAuthCode(); }); // ------- User Interaction Section ------- // Set Loading State function setShowLoader(show) { const loader = document.getElementById('overlay'); loader.style.display = show === true ? 'flex' : 'none'; } `] }, `Web-HTML-API-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.css', when: { client: 'HTML', integration_type: 'API' }, unless: { server: 'Java' }, children: _jsx(AntomFile, { language: `css`, filename: 'client/index.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `css`, steps: [``], chunks: [`body { margin: 0; padding: 0; font-family: 'PingFang SC'; display: flex; flex-direction: column; height: 100vh; margin: 0 auto; } .antom-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } header { width: 100%; height: 72px; background: #fdfdfd; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .header-content { margin: 0 auto; width: 70%; height: 100%; display: flex; align-items: center; justify-content: flex-start; } .header-content-img { width: 120px; } .header-content .subtitle { margin-left: 28px; color: #bcbcbc; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; } .content { display: flex; flex-direction: column; position: relative; overflow: hidden; margin-top: 82px; height: 800px; flex-shrink: 0; border-radius: 40px; background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .headerContent { display: flex; align-items: center; justify-content: flex-start; } .headerContent .logo { margin: 0 10px; } .headerContent .testDemo { width: 62px; height: 16px; display: flex; align-items: center; justify-content: center; border-radius: 4px; background: rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.4); font-size: 8px; font-weight: 400; } .checkout-container { margin: 0 auto; width: 100%; display: flex; flex-direction: column; flex-grow: 1; width: 660px; height: 100%; padding: 162px 64px 76px 56px; box-sizing: border-box; } p { display: inline-flex; align-items: center; gap: 10px; color: #2a3a52; } .payment-option { border: 2px solid #000; padding: 10px; margin-bottom: 20px; display: none; cursor: pointer; } .payment-option.selected { border-color: #1650ff; } .show { display: block; } .submit { width: 100%; height: 56px; border-radius: 12px; background: #1650ff; color: #fff; border: none; text-decoration: none; cursor: pointer; font-size: 16px; display: block; margin-top: 32px; } .radio-group { display: flex; flex-direction: column; } .radio-group label { display: flex; align-items: center; margin-bottom: 8px; padding: 8px 16px; border: 1px solid #ebebeb; background: #fff; border-radius: 12px; color: #2a3a52; font-size: 16px; font-weight: 400; line-height: 24px; } .radio-group label.show { display: flex; } .radio-input { display: none; } .radio-button { width: 14px; height: 14px; border: 1px solid #abb9cc; margin-right: 8px; border-radius: 50%; } .radio-input:checked + .radio-button { border: 4px solid #1650ff; width: 8px; height: 8px; } .payment-icon { vertical-align: middle; display: flex; width: 32px; height: 32px; margin: 0 12px; padding: 4px 4.001px 3.996px 3.999px; justify-content: center; align-items: center; border-radius: 8px; border: 0.5px solid #f5f5f5; background: #fcfcfc; } .disabled { cursor: not-allowed; opacity: 0.5; pointer-events: none; } .hidden { display: none; } #result-container { display: flex; flex-direction: column; margin-top: 14px; align-items: flex-start; border-radius: 12px; border: 1px solid rgba(0, 0, 0, 0); padding: 12px 16px; color: #2a3a52; font-size: 13px; font-weight: 500; line-height: 20px; } .result-title { display: flex; align-items: center; } .result-title img { width: 20px; margin-right: 12px; } #content { color: #7c8ca3; text-align: center; font-size: 12px; font-weight: 400; line-height: 18px; margin-top: 8px; padding-left: 32px; } .mockup { display: none; z-index: 1000; width: 100vw; height: 100vh; position: fixed; top: 0px; left: 0px; background: rgba(0, 0, 0, 0.6); } .container-desktop { display: none; width: 370px; height: 248px; position: fixed; top: 50%; left: 50%; z-index: 1001; border-radius: 12px; overflow: hidden; transform-origin: 50% 50%; transform: translate(-50%, -50%); box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1); padding: 40px 0px 24px 0px; background-color: #fff; } @keyframes container-zoom-in { 0% { transform: translate(-50%, -50%) scale(0.4); opacity: 0; } 80% { opacity: 1; } 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); } } .desktop-animation { animation: container-zoom-in 0.3s ease-in-out; animation-fill-mode: forwards; } .container-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } .container-content img { width: 64px; height: 64px; } .container-title { color: var(--Content-Primary, #2a3a52); text-align: center; font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .container-subTitle { color: #7c8ca3; text-align: center; font-size: 14px; font-weight: 400; line-height: 20px; margin-top: 24px; } .container-btn { display: flex; width: 338px; height: 48px; padding: 0px 24px; justify-content: center; align-items: center; border-radius: var(---Button, 12px); background: var(--Action-Normal, #1650ff); border: none; cursor: pointer; color: var(--Content-Quaternary, #fff); font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .footer { display: flex; justify-content: center; margin-top: 20px; color: #bcbcbc; font-size: 16px; font-weight: 500; line-height: 24px; } .gotoTest { color: #1650ff; margin: 0 4px; text-decoration: none; } .overlay { position: fixed; display: none; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); align-items: center; justify-content: center; z-index: 1000; } .loader { border: 5px solid rgba(0, 0, 0, 0.1); border-left-color: #3498db; border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } `] }, `Web-HTML-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.css', when: { client: 'HTML', integration_type: 'API' }, unless: { server: 'Java' }, children: _jsx(AntomFile, { language: `css`, filename: 'client/receiveAuthCode.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `css`, steps: [``], chunks: [`.overlay { position: fixed; display: none; top: 0; left: 0; width: 100%; height: 100%; align-items: center; justify-content: center; z-index: 1000; } .loader { border: 5px solid rgba(0, 0, 0, 0.1); border-left-color: #3498db; border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } `] }, `Web-HTML-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.html', when: { client: 'HTML', server: 'Java', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `html`, filename: 'src/main/resources/static/index.html', downloadOnly: false, steps: [`build-the-autodebit-page`], children: _jsx(AntomChunk, { language: `html`, steps: [`build-the-autodebit-page`], chunks: [` Antom Demo Auto Debit

Auto Debit Demo

Choose your payment method

`] }, `Web-HTML-SDK-code1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.js', when: { client: 'HTML', server: 'Java', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'src/main/resources/static/index.js', downloadOnly: false, steps: [`initialize-instantiate-the-sdk`, `get-a-consult-session`, `invoke-the-sdk`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`/** * The integration method of the Antom SDK. */ window.selectedPaymentOptionId = "RABBIT_LINE_PAY"; window.amount = { currency: "THB", value: "10000.00", mul: 1 }; const paymentOptions = [ { label: "Rabbit Line Pay", value: "RABBIT_LINE_PAY", icon: "https://gw.alipay.com/icon/medium/default/RABBIT_LINE_PAY.svg", }, { label: "GCASH", value: "GCASH", icon: "https://gw.alipay.com/icon/medium/default/GCASH.svg", }, { label: "GrabPay SG", value: "GRABPAY_SG", icon: "https://gw.alipay.com/icon/medium/default/GRABPAY_SG.svg", }, ]; const currencyMap = { 'RABBIT_LINE_PAY': { currency: 'THB', value: '10000.00', }, 'GCASH': { currency: 'PHP', value: '5500.00', }, 'GRABPAY_SG': { currency: 'SGD', value: '380.00', }, } // Step 1: Create an SDK instance.`] }, `Web-HTML-SDK-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`initialize-instantiate-the-sdk`], chunks: [`const autoDebitApp = new window.AMSAutoDebit({ environment: "sandbox", locale: "en_US", onEventCallback, }); `] }, `Web-HTML-SDK-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 2: Create onEventCallback Handler function onEventCallback({ code }){ switch (code) { // Payment event codes provided by the SDK case 'SDK_PAYMENT_SUCCESSFUL': console.log('Payment successful. We recommend redirecting you to the payment results page.'); break; case 'SDK_PAYMENT_PROCESSING': console.log( 'Payment is being processed. We recommend that your server check the payment status or wait for the payment result notification.' ); break; case 'SDK_PAYMENT_FAIL': console.log( 'Payment failed. We recommend referring to the paymentResultCode error code for details and then guiding the user to retry the payment.' ); break; case 'SDK_PAYMENT_CANCEL': console.log( 'The buyer did not click to complete the payment and closed the payment window. You can use the paymentSessionData within its validity period to re-initiate the SDK. If it has expired, you\\'ll need to request a new paymentSessionData.' ); break; case 'SDK_PAYMENT_ERROR': console.log( 'Payment status is abnormal. We recommend that your server check the payment status or wait for the payment result notification.' ); break; case 'SDK_CALL_URL_SUCCESS': window.close(); break; default: console.log(code); } }; // Step 3: Create the Auto Debit payment rendering component.`] }, `Web-HTML-SDK-other2`), _jsx(AntomChunk, { language: `javascript`, steps: [`invoke-the-sdk`], chunks: [`async function createPopupAutoDebit(paymentSessionData) { try { await autoDebitApp.createComponent({ sessionData: paymentSessionData, notRedirectAfterComplete: false, }); } catch (error) { showAlert(error.code, error.message || "Invalid response format", "error"); } } `] }, `Web-HTML-SDK-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 4: Get payment session data from the endpoint. async function handleSubmit() { try { const consultResponse = await getConsultSessionData(); if ( consultResponse && consultResponse?.data?.result?.resultStatus === "S" && consultResponse?.data?.paymentSessionData !== null ) { await createPopupAutoDebit(consultResponse.data.paymentSessionData); } else if (consultResponse?.paymentRequestId) { console.error(consultResponse); } } catch (error) { showAlert("Error", error.message || "Failed to process payment", "error"); } } // Step 5: Call createConsultSession endpoint.`] }, `Web-HTML-SDK-other3`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-a-consult-session`], chunks: [`async function getConsultSessionData() { setBtnLoading(true); if (!window.selectedPaymentOptionId) { showAlert("Warning", "Please select a payment method!", "warning"); setBtnLoading(false); return null; } // Define the URL for your backend endpoint const url = "http://localhost:8080/authorizations/createConsultSession"; try { const response = await fetch(url, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ // in practice, amount should be calculated on your server side amountValue: window.amount.value, currency: window.amount.currency, paymentMethodType: window.selectedPaymentOptionId, }), }); if (!response.ok) { throw new Error("HTTP error! Status: " + response.status); } const res = await response.json(); if (res.status === "success") return res; throw new Error(res.message || "Invalid response format"); } catch (error) { showAlert( "Error", error.message || "Failed to fetch payment session data", "error" ); return null; } finally { setBtnLoading(false); } } `] }, `Web-HTML-SDK-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 6: Call inquiryPayment to get the payment status.`] }, `Web-HTML-SDK-other4`), _jsx(AntomChunk, { language: `javascript`, steps: [`display-the-payment-result`], chunks: [`async function inquiryPayment(paymentRequestId) { // Define the URL for your backend endpoint const baseUrl = "http://localhost:8080/payment/inquiryPayment"; const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ paymentRequestId }), }; const response = await fetch(baseUrl, config); if (!response.ok) throw new Error("Network response was not ok"); const res = await response.json(); return res.status === "success" ? res.data.paymentStatus : "ERROR"; } `] }, `Web-HTML-SDK-code4`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 7: Create Polling mechanism to retrieve the payment result. async function pollPaymentResult() { const paymentRequestId = new URLSearchParams(window.location.search).get( "paymentRequestId" ); if (!paymentRequestId) return; const poll = async () => { let status = "PROCESSING"; let retries = 0; const maxRetries = 5; while (retries < maxRetries) { try { const statusResult = await inquiryPayment(paymentRequestId); status = statusResult ?? "ERROR"; } catch (error) { status = "ERROR"; } retries += 1; if (status === "SUCCESS" || retries === maxRetries) { return handlePaymentStatus(status); } await new Promise((resolve) => setTimeout(resolve, 2000)); } }; poll(); } // Step 8: Bind handleSubmit function to submit button. document.getElementById("submit").addEventListener("click", handleSubmit); // Step 9: Render payment options & check run polling result. document.addEventListener("DOMContentLoaded", () => { appendPaymentOptions(paymentOptions); pollPaymentResult(); }); // ------- User Interaction Section ------- function appendPaymentOptions(options) { const paymentOptionsContainer = document.getElementById("checkout-box"); paymentOptionsContainer.innerHTML = ""; const frag = document.createDocumentFragment(); options.forEach((option) => { const label = document.createElement("label"); label.className = "payment-option"; const input = document.createElement("input"); input.type = "radio"; input.className = "radio-input"; input.name = "radio"; input.value = option.value; input.checked = option.value === window.selectedPaymentOptionId; if (input.checked) { label.classList.add("selected"); } input.addEventListener("change", selectPaymentOption); const span = document.createElement("span"); span.className = "radio-button"; const icon = document.createElement("img"); icon.src = option.icon; icon.className = "payment-icon"; const textNode = document.createTextNode(option.label); label.append(input, span, icon, textNode); frag.appendChild(label); }); paymentOptionsContainer.appendChild(frag); } function selectPaymentOption(event) { const targetValue = event.target.value; if (targetValue) { document .querySelectorAll(".payment-option") .forEach((label) => label.classList.remove("selected")); const selectedLabel = event.target.parentElement; selectedLabel.classList.add("selected"); window.selectedPaymentOptionId = targetValue; window.amount = { ...window.amount, currency: currencyMap[targetValue].currency, value: currencyMap[targetValue].value, } const submitElement = document.getElementById("submit");`, ' submitElement.innerText = `Pay \${window.amount.currency} \${window.amount.value}`;', ` } } function handlePaymentStatus(status) { switch (status) { case "SUCCESS": showPaymentResult( "Payment Successful", "Thank you for your payment! We will ship out your order as soon as possible.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ", "#e5f7f1", "#b7e9d9" ); break; case "FAIL": showPaymentResult( "Payment Failed", "Please return to the merchant order page and resubmit your payment.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", "rgba(255, 91, 77, 0.10)", "rgba(255, 91, 77, 0.20)" ); break; case "ERROR": showPaymentResult( "Error", "An error occurred while checking the payment status. Please try again or contact support.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", "rgba(255, 91, 77, 0.10)", "rgba(255, 91, 77, 0.20)" ); break; default: showPaymentResult( "Payment Processing", "Please return to the merchant order page and resubmit your payment.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ", "rgba(255, 159, 26, 0.10)", "rgba(255, 159, 26, 0.20) " ); } } function setBtnLoading(isLoading) { const submitElement = document.getElementById("submit"); submitElement.disabled = isLoading; submitElement.classList.toggle("disabled", isLoading); } function showPaymentResult(title, message, icon, bgColor, borderColor) { const messageContainer = document.querySelector("#result-container"); if (!messageContainer) return; messageContainer.classList.remove("hidden"); messageContainer.style.backgroundColor = bgColor; messageContainer.style.borderColor = borderColor; document.getElementById("message").innerText = title; document.getElementById("content").innerText = message; document.getElementById("resultIcon").setAttribute("src", icon); setTimeout(() => { messageContainer.classList.add("hidden"); messageContainer.style.backgroundColor = ""; messageContainer.style.borderColor = ""; document.getElementById("message").innerText = ""; document.getElementById("content").innerText = ""; document.getElementById("resultIcon").setAttribute("src", ""); window.location.href = "./index.html"; }, 8000); } function showAlert(title, subTitle, type) { const icons = { warning: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ", error: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", success: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ", }; const containerDesktop = document.getElementById("container-desktop"); const mockup = document.getElementById("mockup"); const alertIcon = document.getElementById("alert-icon"); const containerTitle = document.getElementById("container-title"); const containerSubTitle = document.getElementById("container-subTitle"); containerDesktop.style.display = "block"; mockup.style.display = "block"; alertIcon.src = icons[type] || ""; containerTitle.textContent = title || ""; containerSubTitle.textContent = subTitle || ""; alertIcon.style.display = icons[type] ? "block" : "none"; containerTitle.style.display = title ? "block" : "none"; containerSubTitle.style.display = subTitle ? "block" : "none"; } function closeAlert() { document.getElementById("container-desktop").style.display = "none"; document.getElementById("mockup").style.display = "none"; } document.getElementById("alert-ok-btn").addEventListener("click", closeAlert); `] }, `Web-HTML-SDK-other5`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.html', when: { client: 'HTML', server: 'Java', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `html`, filename: 'src/main/resources/static/receiveAuthCode.html', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `html`, steps: [``], chunks: [` Antom Demo Checkout

`] }, `Web-HTML-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.js', when: { client: 'HTML', server: 'Java', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'src/main/resources/static/receiveAuthCode.js', downloadOnly: false, steps: [`get-and-process-auth-info`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`/** * The integration method of the Antom API. */ `] }, `Web-HTML-SDK-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-and-process-auth-info`], chunks: [`async function validateAuthCode(){ // Define the URL for your backend endpoint const url = 'http://localhost:8080/authorizations/applyTokenAndPay'; const urlObject = new URL(window.location.href); const queryString = urlObject.search; const params = new URLSearchParams(queryString); const authCode = params.get('authCode'); const authState = params.get('authState'); if(!authCode || !authState) { return window.location.href= "/"; }; setShowLoader(true); const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ authCode, authState }), }; try { const response = await fetch(url, config); if (!response.ok) throw new Error("Network response was not ok"); const res = await response.json(); if(res.status === "success" ) { const baseUrl = 'http://localhost:5173'; const params = new URLSearchParams({ paymentRequestId: res.data.paymentRequestId, }).toString();`, ' window.location.href = `\${baseUrl}?\${params}`;', ` } } finally { setShowLoader(false); } } `] }, `Web-HTML-SDK-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`document.addEventListener("DOMContentLoaded", async () => { validateAuthCode(); }); // ------- User Interaction Section ------- // Set Loading State function setShowLoader(show) { const loader = document.getElementById('overlay'); loader.style.display = show === true ? 'flex' : 'none'; } `] }, `Web-HTML-SDK-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.css', when: { client: 'HTML', server: 'Java', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'src/main/resources/static/index.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`body { margin: 0; padding: 0; font-family: 'PingFang SC'; display: flex; flex-direction: column; height: 100vh; margin: 0 auto; } .antom-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } header { width: 100%; height: 72px; background: #fdfdfd; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .header-content { margin: 0 auto; width: 70%; height: 100%; display: flex; align-items: center; justify-content: flex-start; } .header-content-img { width: 120px; } .header-content .subtitle { margin-left: 28px; color: #bcbcbc; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; } .content { display: flex; flex-direction: column; position: relative; overflow: hidden; margin-top: 82px; height: 800px; flex-shrink: 0; border-radius: 40px; background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .headerContent { display: flex; align-items: center; justify-content: flex-start; } .headerContent .logo { margin: 0 10px; } .headerContent .testDemo { width: 62px; height: 16px; display: flex; align-items: center; justify-content: center; border-radius: 4px; background: rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.4); font-size: 8px; font-weight: 400; } .checkout-container { margin: 0 auto; width: 100%; display: flex; flex-direction: column; flex-grow: 1; width: 660px; height: 100%; padding: 162px 64px 76px 56px; box-sizing: border-box; } p { display: inline-flex; align-items: center; gap: 10px; color: #2a3a52; } .payment-option { border: 2px solid #000; padding: 10px; margin-bottom: 20px; display: none; cursor: pointer; } .payment-option.selected { border-color: #1650ff; } .show { display: block; } .submit { width: 100%; height: 56px; border-radius: 12px; background: #1650ff; color: #fff; border: none; text-decoration: none; cursor: pointer; font-size: 16px; display: block; margin-top: 32px; } .radio-group { display: flex; flex-direction: column; } .radio-group label { display: flex; align-items: center; margin-bottom: 8px; padding: 8px 16px; border: 1px solid #ebebeb; background: #fff; border-radius: 12px; color: #2a3a52; font-size: 16px; font-weight: 400; line-height: 24px; } .radio-group label.show { display: flex; } .radio-input { display: none; } .radio-button { width: 14px; height: 14px; border: 1px solid #abb9cc; margin-right: 8px; border-radius: 50%; } .radio-input:checked + .radio-button { border: 4px solid #1650ff; width: 8px; height: 8px; } .payment-icon { vertical-align: middle; display: flex; width: 32px; height: 32px; margin: 0 12px; padding: 4px 4.001px 3.996px 3.999px; justify-content: center; align-items: center; border-radius: 8px; border: 0.5px solid #f5f5f5; background: #fcfcfc; } .disabled { cursor: not-allowed; opacity: 0.5; pointer-events: none; } .hidden { display: none; } #result-container { display: flex; flex-direction: column; margin-top: 14px; align-items: flex-start; border-radius: 12px; border: 1px solid rgba(0, 0, 0, 0); padding: 12px 16px; color: #2a3a52; font-size: 13px; font-weight: 500; line-height: 20px; } .result-title { display: flex; align-items: center; } .result-title img { width: 20px; margin-right: 12px; } #content { color: #7c8ca3; text-align: center; font-size: 12px; font-weight: 400; line-height: 18px; margin-top: 8px; padding-left: 32px; } .mockup { display: none; z-index: 1000; width: 100vw; height: 100vh; position: fixed; top: 0px; left: 0px; background: rgba(0, 0, 0, 0.6); } .container-desktop { display: none; width: 370px; height: 248px; position: fixed; top: 50%; left: 50%; z-index: 1001; border-radius: 12px; overflow: hidden; transform-origin: 50% 50%; transform: translate(-50%, -50%); box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1); padding: 40px 0px 24px 0px; background-color: #fff; } @keyframes container-zoom-in { 0% { transform: translate(-50%, -50%) scale(0.4); opacity: 0; } 80% { opacity: 1; } 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); } } .desktop-animation { animation: container-zoom-in 0.3s ease-in-out; animation-fill-mode: forwards; } .container-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } .container-content img { width: 64px; height: 64px; } .container-title { color: var(--Content-Primary, #2a3a52); text-align: center; font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .container-subTitle { color: #7c8ca3; text-align: center; font-size: 14px; font-weight: 400; line-height: 20px; margin-top: 24px; } .container-btn { display: flex; width: 338px; height: 48px; padding: 0px 24px; justify-content: center; align-items: center; border-radius: var(---Button, 12px); background: var(--Action-Normal, #1650ff); border: none; cursor: pointer; color: var(--Content-Quaternary, #fff); font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .footer { display: flex; justify-content: center; margin-top: 20px; color: #bcbcbc; font-size: 16px; font-weight: 500; line-height: 24px; } .gotoTest { color: #1650ff; margin: 0 4px; text-decoration: none; } `] }, `Web-HTML-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.css', when: { client: 'HTML', server: 'Java', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'src/main/resources/static/receiveAuthCode.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`.overlay { position: fixed; display: none; top: 0; left: 0; width: 100%; height: 100%; align-items: center; justify-content: center; z-index: 1000; } .loader { border: 5px solid rgba(0, 0, 0, 0.1); border-left-color: #3498db; border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } `] }, `Web-HTML-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.html', when: { client: 'HTML', integration_type: 'SDK' }, unless: { server: 'Java' }, children: _jsx(AntomFile, { language: `html`, filename: 'client/index.html', downloadOnly: false, steps: [`build-the-autodebit-page`], children: _jsx(AntomChunk, { language: `html`, steps: [`build-the-autodebit-page`], chunks: [` Antom Demo Auto Debit

Auto Debit Demo

Choose your payment method

`] }, `Web-HTML-SDK-code1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.js', when: { client: 'HTML', integration_type: 'SDK' }, unless: { server: 'Java' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/index.js', downloadOnly: false, steps: [`initialize-instantiate-the-sdk`, `get-a-consult-session`, `invoke-the-sdk`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`/** * The integration method of the Antom SDK. */ window.selectedPaymentOptionId = "RABBIT_LINE_PAY"; window.amount = { currency: "THB", value: "10000.00", mul: 1 }; const paymentOptions = [ { label: "Rabbit Line Pay", value: "RABBIT_LINE_PAY", icon: "https://gw.alipay.com/icon/medium/default/RABBIT_LINE_PAY.svg", }, { label: "GCASH", value: "GCASH", icon: "https://gw.alipay.com/icon/medium/default/GCASH.svg", }, { label: "GrabPay SG", value: "GRABPAY_SG", icon: "https://gw.alipay.com/icon/medium/default/GRABPAY_SG.svg", }, ]; const currencyMap = { 'RABBIT_LINE_PAY': { currency: 'THB', value: '10000.00', }, 'GCASH': { currency: 'PHP', value: '5500.00', }, 'GRABPAY_SG': { currency: 'SGD', value: '380.00', }, } // Step 1: Create an SDK instance.`] }, `Web-HTML-SDK-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`initialize-instantiate-the-sdk`], chunks: [`const autoDebitApp = new window.AMSAutoDebit({ environment: "sandbox", locale: "en_US", onEventCallback, }); `] }, `Web-HTML-SDK-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 2: Create onEventCallback Handler function onEventCallback({ code }){ switch (code) { // Payment event codes provided by the SDK case 'SDK_PAYMENT_SUCCESSFUL': console.log('Payment successful. We recommend redirecting you to the payment results page.'); break; case 'SDK_PAYMENT_PROCESSING': console.log( 'Payment is being processed. We recommend that your server check the payment status or wait for the payment result notification.' ); break; case 'SDK_PAYMENT_FAIL': console.log( 'Payment failed. We recommend referring to the paymentResultCode error code for details and then guiding the user to retry the payment.' ); break; case 'SDK_PAYMENT_CANCEL': console.log( 'The buyer did not click to complete the payment and closed the payment window. You can use the paymentSessionData within its validity period to re-initiate the SDK. If it has expired, you\\'ll need to request a new paymentSessionData.' ); break; case 'SDK_PAYMENT_ERROR': console.log( 'Payment status is abnormal. We recommend that your server check the payment status or wait for the payment result notification.' ); break; case 'SDK_CALL_URL_SUCCESS': window.close(); break; default: console.log(code); } }; // Step 3: Create the Auto Debit payment rendering component.`] }, `Web-HTML-SDK-other2`), _jsx(AntomChunk, { language: `javascript`, steps: [`invoke-the-sdk`], chunks: [`async function createPopupAutoDebit(paymentSessionData) { try { await autoDebitApp.createComponent({ sessionData: paymentSessionData, notRedirectAfterComplete: false, }); } catch (error) { showAlert(error.code, error.message || "Invalid response format", "error"); } } `] }, `Web-HTML-SDK-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 4: Get payment session data from the endpoint. async function handleSubmit() { try { const consultResponse = await getConsultSessionData(); if ( consultResponse && consultResponse?.data?.result?.resultStatus === "S" && consultResponse?.data?.paymentSessionData !== null ) { await createPopupAutoDebit(consultResponse.data.paymentSessionData); } else if (consultResponse?.paymentRequestId) { console.error(consultResponse); } } catch (error) { showAlert("Error", error.message || "Failed to process payment", "error"); } } // Step 5: Call createConsultSession endpoint.`] }, `Web-HTML-SDK-other3`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-a-consult-session`], chunks: [`async function getConsultSessionData() { setBtnLoading(true); if (!window.selectedPaymentOptionId) { showAlert("Warning", "Please select a payment method!", "warning"); setBtnLoading(false); return null; } // Define the URL for your backend endpoint const url = "http://localhost:8080/authorizations/createConsultSession"; try { const response = await fetch(url, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ // in practice, amount should be calculated on your server side amountValue: window.amount.value, currency: window.amount.currency, paymentMethodType: window.selectedPaymentOptionId, }), }); if (!response.ok) { throw new Error("HTTP error! Status: " + response.status); } const res = await response.json(); if (res.status === "success") return res; throw new Error(res.message || "Invalid response format"); } catch (error) { showAlert( "Error", error.message || "Failed to fetch payment session data", "error" ); return null; } finally { setBtnLoading(false); } } `] }, `Web-HTML-SDK-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 6: Call inquiryPayment to get the payment status.`] }, `Web-HTML-SDK-other4`), _jsx(AntomChunk, { language: `javascript`, steps: [`display-the-payment-result`], chunks: [`async function inquiryPayment(paymentRequestId) { // Define the URL for your backend endpoint const baseUrl = "http://localhost:8080/payment/inquiryPayment"; const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ paymentRequestId }), }; const response = await fetch(baseUrl, config); if (!response.ok) throw new Error("Network response was not ok"); const res = await response.json(); return res.status === "success" ? res.data.paymentStatus : "ERROR"; } `] }, `Web-HTML-SDK-code4`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// Step 7: Create Polling mechanism to retrieve the payment result. async function pollPaymentResult() { const paymentRequestId = new URLSearchParams(window.location.search).get( "paymentRequestId" ); if (!paymentRequestId) return; const poll = async () => { let status = "PROCESSING"; let retries = 0; const maxRetries = 5; while (retries < maxRetries) { try { const statusResult = await inquiryPayment(paymentRequestId); status = statusResult ?? "ERROR"; } catch (error) { status = "ERROR"; } retries += 1; if (status === "SUCCESS" || retries === maxRetries) { return handlePaymentStatus(status); } await new Promise((resolve) => setTimeout(resolve, 2000)); } }; poll(); } // Step 8: Bind handleSubmit function to submit button. document.getElementById("submit").addEventListener("click", handleSubmit); // Step 9: Render payment options & check run polling result. document.addEventListener("DOMContentLoaded", () => { appendPaymentOptions(paymentOptions); pollPaymentResult(); }); // ------- User Interaction Section ------- function appendPaymentOptions(options) { const paymentOptionsContainer = document.getElementById("checkout-box"); paymentOptionsContainer.innerHTML = ""; const frag = document.createDocumentFragment(); options.forEach((option) => { const label = document.createElement("label"); label.className = "payment-option"; const input = document.createElement("input"); input.type = "radio"; input.className = "radio-input"; input.name = "radio"; input.value = option.value; input.checked = option.value === window.selectedPaymentOptionId; if (input.checked) { label.classList.add("selected"); } input.addEventListener("change", selectPaymentOption); const span = document.createElement("span"); span.className = "radio-button"; const icon = document.createElement("img"); icon.src = option.icon; icon.className = "payment-icon"; const textNode = document.createTextNode(option.label); label.append(input, span, icon, textNode); frag.appendChild(label); }); paymentOptionsContainer.appendChild(frag); } function selectPaymentOption(event) { const targetValue = event.target.value; if (targetValue) { document .querySelectorAll(".payment-option") .forEach((label) => label.classList.remove("selected")); const selectedLabel = event.target.parentElement; selectedLabel.classList.add("selected"); window.selectedPaymentOptionId = targetValue; window.amount = { ...window.amount, currency: currencyMap[targetValue].currency, value: currencyMap[targetValue].value, } const submitElement = document.getElementById("submit");`, ' submitElement.innerText = `Pay \${window.amount.currency} \${window.amount.value}`;', ` } } function handlePaymentStatus(status) { switch (status) { case "SUCCESS": showPaymentResult( "Payment Successful", "Thank you for your payment! We will ship out your order as soon as possible.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ", "#e5f7f1", "#b7e9d9" ); break; case "FAIL": showPaymentResult( "Payment Failed", "Please return to the merchant order page and resubmit your payment.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", "rgba(255, 91, 77, 0.10)", "rgba(255, 91, 77, 0.20)" ); break; case "ERROR": showPaymentResult( "Error", "An error occurred while checking the payment status. Please try again or contact support.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", "rgba(255, 91, 77, 0.10)", "rgba(255, 91, 77, 0.20)" ); break; default: showPaymentResult( "Payment Processing", "Please return to the merchant order page and resubmit your payment.", "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ", "rgba(255, 159, 26, 0.10)", "rgba(255, 159, 26, 0.20) " ); } } function setBtnLoading(isLoading) { const submitElement = document.getElementById("submit"); submitElement.disabled = isLoading; submitElement.classList.toggle("disabled", isLoading); } function showPaymentResult(title, message, icon, bgColor, borderColor) { const messageContainer = document.querySelector("#result-container"); if (!messageContainer) return; messageContainer.classList.remove("hidden"); messageContainer.style.backgroundColor = bgColor; messageContainer.style.borderColor = borderColor; document.getElementById("message").innerText = title; document.getElementById("content").innerText = message; document.getElementById("resultIcon").setAttribute("src", icon); setTimeout(() => { messageContainer.classList.add("hidden"); messageContainer.style.backgroundColor = ""; messageContainer.style.borderColor = ""; document.getElementById("message").innerText = ""; document.getElementById("content").innerText = ""; document.getElementById("resultIcon").setAttribute("src", ""); window.location.href = "./index.html"; }, 8000); } function showAlert(title, subTitle, type) { const icons = { warning: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ", error: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ", success: "https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ", }; const containerDesktop = document.getElementById("container-desktop"); const mockup = document.getElementById("mockup"); const alertIcon = document.getElementById("alert-icon"); const containerTitle = document.getElementById("container-title"); const containerSubTitle = document.getElementById("container-subTitle"); containerDesktop.style.display = "block"; mockup.style.display = "block"; alertIcon.src = icons[type] || ""; containerTitle.textContent = title || ""; containerSubTitle.textContent = subTitle || ""; alertIcon.style.display = icons[type] ? "block" : "none"; containerTitle.style.display = title ? "block" : "none"; containerSubTitle.style.display = subTitle ? "block" : "none"; } function closeAlert() { document.getElementById("container-desktop").style.display = "none"; document.getElementById("mockup").style.display = "none"; } document.getElementById("alert-ok-btn").addEventListener("click", closeAlert); `] }, `Web-HTML-SDK-other5`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.html', when: { client: 'HTML', integration_type: 'SDK' }, unless: { server: 'Java' }, children: _jsx(AntomFile, { language: `html`, filename: 'client/receiveAuthCode.html', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `html`, steps: [``], chunks: [` Antom Demo Checkout

`] }, `Web-HTML-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.js', when: { client: 'HTML', integration_type: 'SDK' }, unless: { server: 'Java' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/receiveAuthCode.js', downloadOnly: false, steps: [`get-and-process-auth-info`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`/** * The integration method of the Antom API. */ `] }, `Web-HTML-SDK-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-and-process-auth-info`], chunks: [`async function validateAuthCode(){ // Define the URL for your backend endpoint const url = 'http://localhost:8080/authorizations/applyTokenAndPay'; const urlObject = new URL(window.location.href); const queryString = urlObject.search; const params = new URLSearchParams(queryString); const authCode = params.get('authCode'); const authState = params.get('authState'); if(!authCode || !authState) { return window.location.href= "/"; }; setShowLoader(true); const config = { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify({ authCode, authState }), }; try { const response = await fetch(url, config); if (!response.ok) throw new Error("Network response was not ok"); const res = await response.json(); if(res.status === "success" ) { const baseUrl = 'http://localhost:5173'; const params = new URLSearchParams({ paymentRequestId: res.data.paymentRequestId, }).toString();`, ' window.location.href = `\${baseUrl}?\${params}`;', ` } } finally { setShowLoader(false); } } `] }, `Web-HTML-SDK-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`document.addEventListener("DOMContentLoaded", async () => { validateAuthCode(); }); // ------- User Interaction Section ------- // Set Loading State function setShowLoader(show) { const loader = document.getElementById('overlay'); loader.style.display = show === true ? 'flex' : 'none'; } `] }, `Web-HTML-SDK-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/index.css', when: { client: 'HTML', integration_type: 'SDK' }, unless: { server: 'Java' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/index.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`body { margin: 0; padding: 0; font-family: 'PingFang SC'; display: flex; flex-direction: column; height: 100vh; margin: 0 auto; } .antom-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } header { width: 100%; height: 72px; background: #fdfdfd; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .header-content { margin: 0 auto; width: 70%; height: 100%; display: flex; align-items: center; justify-content: flex-start; } .header-content-img { width: 120px; } .header-content .subtitle { margin-left: 28px; color: #bcbcbc; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; } .content { display: flex; flex-direction: column; position: relative; overflow: hidden; margin-top: 82px; height: 800px; flex-shrink: 0; border-radius: 40px; background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .headerContent { display: flex; align-items: center; justify-content: flex-start; } .headerContent .logo { margin: 0 10px; } .headerContent .testDemo { width: 62px; height: 16px; display: flex; align-items: center; justify-content: center; border-radius: 4px; background: rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.4); font-size: 8px; font-weight: 400; } .checkout-container { margin: 0 auto; width: 100%; display: flex; flex-direction: column; flex-grow: 1; width: 660px; height: 100%; padding: 162px 64px 76px 56px; box-sizing: border-box; } p { display: inline-flex; align-items: center; gap: 10px; color: #2a3a52; } .payment-option { border: 2px solid #000; padding: 10px; margin-bottom: 20px; display: none; cursor: pointer; } .payment-option.selected { border-color: #1650ff; } .show { display: block; } .submit { width: 100%; height: 56px; border-radius: 12px; background: #1650ff; color: #fff; border: none; text-decoration: none; cursor: pointer; font-size: 16px; display: block; margin-top: 32px; } .radio-group { display: flex; flex-direction: column; } .radio-group label { display: flex; align-items: center; margin-bottom: 8px; padding: 8px 16px; border: 1px solid #ebebeb; background: #fff; border-radius: 12px; color: #2a3a52; font-size: 16px; font-weight: 400; line-height: 24px; } .radio-group label.show { display: flex; } .radio-input { display: none; } .radio-button { width: 14px; height: 14px; border: 1px solid #abb9cc; margin-right: 8px; border-radius: 50%; } .radio-input:checked + .radio-button { border: 4px solid #1650ff; width: 8px; height: 8px; } .payment-icon { vertical-align: middle; display: flex; width: 32px; height: 32px; margin: 0 12px; padding: 4px 4.001px 3.996px 3.999px; justify-content: center; align-items: center; border-radius: 8px; border: 0.5px solid #f5f5f5; background: #fcfcfc; } .disabled { cursor: not-allowed; opacity: 0.5; pointer-events: none; } .hidden { display: none; } #result-container { display: flex; flex-direction: column; margin-top: 14px; align-items: flex-start; border-radius: 12px; border: 1px solid rgba(0, 0, 0, 0); padding: 12px 16px; color: #2a3a52; font-size: 13px; font-weight: 500; line-height: 20px; } .result-title { display: flex; align-items: center; } .result-title img { width: 20px; margin-right: 12px; } #content { color: #7c8ca3; text-align: center; font-size: 12px; font-weight: 400; line-height: 18px; margin-top: 8px; padding-left: 32px; } .mockup { display: none; z-index: 1000; width: 100vw; height: 100vh; position: fixed; top: 0px; left: 0px; background: rgba(0, 0, 0, 0.6); } .container-desktop { display: none; width: 370px; height: 248px; position: fixed; top: 50%; left: 50%; z-index: 1001; border-radius: 12px; overflow: hidden; transform-origin: 50% 50%; transform: translate(-50%, -50%); box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1); padding: 40px 0px 24px 0px; background-color: #fff; } @keyframes container-zoom-in { 0% { transform: translate(-50%, -50%) scale(0.4); opacity: 0; } 80% { opacity: 1; } 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); } } .desktop-animation { animation: container-zoom-in 0.3s ease-in-out; animation-fill-mode: forwards; } .container-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } .container-content img { width: 64px; height: 64px; } .container-title { color: var(--Content-Primary, #2a3a52); text-align: center; font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .container-subTitle { color: #7c8ca3; text-align: center; font-size: 14px; font-weight: 400; line-height: 20px; margin-top: 24px; } .container-btn { display: flex; width: 338px; height: 48px; padding: 0px 24px; justify-content: center; align-items: center; border-radius: var(---Button, 12px); background: var(--Action-Normal, #1650ff); border: none; cursor: pointer; color: var(--Content-Quaternary, #fff); font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .footer { display: flex; justify-content: center; margin-top: 20px; color: #bcbcbc; font-size: 16px; font-weight: 500; line-height: 24px; } .gotoTest { color: #1650ff; margin: 0 4px; text-decoration: none; } `] }, `Web-HTML-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/html/receiveAuthCode.css', when: { client: 'HTML', integration_type: 'SDK' }, unless: { server: 'Java' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/receiveAuthCode.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`.overlay { position: fixed; display: none; top: 0; left: 0; width: 100%; height: 100%; align-items: center; justify-content: center; z-index: 1000; } .loader { border: 5px solid rgba(0, 0, 0, 0.1); border-left-color: #3498db; border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } `] }, `Web-HTML-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/Home.jsx', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/src/components/Home/Home.jsx', downloadOnly: false, steps: [`build-the-autodebit-page`, `initialize-instantiate-the-sdk`, `get-a-consult-session`, `invoke-the-sdk`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import { useEffect, useRef, useState } from 'react'; import { AMSAutoDebit } from '@alipay/ams-checkout'; import { useNavigate } from 'react-router-dom'; import './Home.css'; function Home() { const navigate = useNavigate(); const amount = { currency: 'THB', value: '10000.00', mul: 1 }; const [selectedPaymentOptionId, setSelectedPaymentOptionId] = useState('RABBIT_LINE_PAY'); const [isLoading, setBtnLoading] = useState(false); const [paymentResult, setPaymentResult] = useState({ title: '', message: '', icon: '', bgColor: '', borderColor: '', }); const [alert, setAlert] = useState({ title: '', subTitle: '', iconType: '', }); const autoDebitAppRef = useRef(null); const paymentOptions = [ { label: 'Rabbit Line Pay', value: 'RABBIT_LINE_PAY', icon: 'https://gw.alipay.com/icon/medium/default/RABBIT_LINE_PAY.svg', }, { label: 'GCASH', value: 'GCASH', icon: 'https://gw.alipay.com/icon/medium/default/GCASH.svg', }, { label: 'GrabPay SG', value: 'GRABPAY_SG', icon: 'https://gw.alipay.com/icon/medium/default/GRABPAY_SG.svg', }, ]; const currencyMap = { RABBIT_LINE_PAY: { currency: 'THB', value: '10000.00', }, GCASH: { currency: 'PHP', value: '5500.00', }, GRABPAY_SG: { currency: 'SGD', value: '380.00', }, }; const renderAlert = () => { if (!alert.title) return; const icons = { warning: 'https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ', error: 'https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ', success: 'https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ', }; return ( <>

{alert.title}

{alert.subTitle}

); }; const renderPaymentResult = () => { if (!paymentResult) return; const { title, message, icon, bgColor, borderColor } = paymentResult; return (

{title}

{message}

); }; const handlePaymentStatus = (status) => { setTimeout(() => { setPaymentResult(); navigate('/'); }, 5000); switch (status) { case 'SUCCESS': setPaymentResult({ title: 'Payment Successful', message: 'Thank you for your payment! We will ship out your order as soon as possible.', icon: 'https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*ZLggSbkLKoMAAAAAAAAAAAAAAQAAAQ', bgColor: '#e5f7f1', borderColor: '#b7e9d9', }); break; case 'FAIL': setPaymentResult({ title: 'Payment Failed', message: 'Please return to the merchant order page and resubmit your payment.', icon: 'https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ', bgColor: 'rgba(255, 91, 77, 0.10)', borderColor: 'rgba(255, 91, 77, 0.20)', }); break; case 'ERROR': setPaymentResult({ title: 'Error', message: 'An error occurred while checking the payment status. Please try again or contact support.', icon: 'https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*QzBHQ40jKZAAAAAAAAAAAAAAAQAAAQ', bgColor: 'rgba(255, 91, 77, 0.10)', borderColor: 'rgba(255, 91, 77, 0.20)', }); break; default: setPaymentResult({ title: 'Payment Processing', message: 'Please return to the merchant order page and resubmit your payment.', icon: 'https://mdn.alipayobjects.com/portal_pdqp4x/afts/file/A*7ShHRKjYcjoAAAAAAAAAAAAAAQAAAQ', bgColor: 'rgba(255, 159, 26, 0.10)', borderColor: 'rgba(255, 159, 26, 0.20) ', }); } }; // Step 6: Create Polling mechanism to retrieve the payment result. const pollPaymentResult = async () => { const paymentRequestId = new URLSearchParams( window.location.search ).get('paymentRequestId'); if (!paymentRequestId) return; const poll = async () => { let status = "PROCESSING"; let retries = 0; const maxRetries = 5; while (retries < maxRetries) { try { const statusResult = await inquiryPayment(paymentRequestId); status = statusResult ?? "ERROR"; } catch (error) { status = "ERROR"; } retries += 1; if (status === "SUCCESS" || retries === maxRetries) { return handlePaymentStatus(status); } await new Promise((resolve) => setTimeout(resolve, 2000)); } }; poll(); }; // Step 5: Call inquiryPayment to get the payment status.`] }, `Web-React-SDK-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`display-the-payment-result`], chunks: [` const inquiryPayment = async (paymentRequestId) => { // Define the URL for your backend endpoint const baseUrl = 'http://localhost:8080/payment/inquiryPayment'; const config = { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ paymentRequestId }), }; const response = await fetch(baseUrl, config); if (!response.ok) throw new Error('Network response was not ok'); const res = await response.json(); return res.status === 'success' ? res.data.paymentStatus : 'ERROR'; }; `] }, `Web-React-SDK-code5`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` // Step 4: Get payment session data from the endpoint. const handleSubmit = async () => {`] }, `Web-React-SDK-other2`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-a-consult-session`], chunks: [` const getConsultSessionData = async () => { setBtnLoading(true); if (!selectedPaymentOptionId) { setAlert({ title: 'Warning', subTitle: 'Please select a payment method!', iconType: 'warning', }); setBtnLoading(false); return null; } try { // Define the URL for your backend endpoint const url = 'http://localhost:8080/authorizations/createConsultSession'; const body = JSON.stringify({ currency: amount.currency, amountValue: amount.value, paymentMethodType: selectedPaymentOptionId, }); const response = await fetch(url, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body, }); if (!response.ok) { throw new Error('HTTP error! Status: ' + response.status); } const res = await response.json(); if (res.status === 'success') return res; throw new Error(res.message || 'Invalid response format'); } catch (error) { setAlert({ title: 'Error', subTitle: error.message || 'Failed to fetch payment session data', iconType: 'error', }); return null; } finally { setBtnLoading(false); } }; `] }, `Web-React-SDK-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` try { const paymentResponse = await getConsultSessionData(); if ( paymentResponse && paymentResponse?.data?.result?.resultStatus === 'S' && paymentResponse?.data?.paymentSessionData !== null ) { await createPopupAutoDebit( paymentResponse.data.paymentSessionData ); } else if (paymentResponse?.paymentRequestId) { // exception handling console.error(paymentResponse); } } catch (error) { setAlert({ title: 'Error', subTitle: error.message || 'Failed to process payment', iconType: 'error', }); } }; // Step 3: Create the Auto Debit payment rendering component.`] }, `Web-React-SDK-other3`), _jsx(AntomChunk, { language: `javascript`, steps: [`invoke-the-sdk`], chunks: [` const createPopupAutoDebit = async (paymentSessionData) => { try { if (!autoDebitAppRef.current) return; await autoDebitAppRef.current.createComponent({ sessionData: paymentSessionData, notRedirectAfterComplete: false, }); } catch (error) { setAlert({ title: error.code, subTitle: error.message || 'Invalid response format', iconType: 'error', }); } }; `] }, `Web-React-SDK-code4`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` // Step 2: Create onEventCallback Handler const onEventCallback = ({ code }) => { switch (code) { // Payment event codes provided by the SDK. case 'SDK_PAYMENT_SUCCESSFUL': console.log( 'Payment successful. It is recommended to redirect to the payment result page.' ); break; case 'SDK_PAYMENT_PROCESSING': console.log( 'Payment in process. It is recommended that your server queries the payment status or waits for the payment result notification.' ); break; case 'SDK_PAYMENT_FAIL': console.log( 'Payment failed. It is recommended to prompt based on the paymentResultCode error code and guide the user to retry the payment.' ); break; case 'SDK_PAYMENT_CANCEL': console.log( 'The buyer did not click to pay and closed the payment window. You can reuse the paymentSessionData within its validity period to recall the SDK. If it has expired, you need to request new paymentSessionData.' ); break; case 'SDK_PAYMENT_ERROR': console.log( 'Payment status abnormal. It is recommended that your server queries the payment status or waits for the payment result notification.' ); break; case 'SDK_CALL_URL_SUCCESS': // window.close(); break; default: console.log(code); } }; useEffect(() => { // Step 1: Create an SDK instance.`] }, `Web-React-SDK-other4`), _jsx(AntomChunk, { language: `javascript`, steps: [`initialize-instantiate-the-sdk`], chunks: [` autoDebitAppRef.current = new AMSAutoDebit({ environment: 'sandbox', locale: 'en_US', onEventCallback, }); `] }, `Web-React-SDK-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` // Step 7: Poll for the payment status pollPaymentResult(); }, []); `] }, `Web-React-SDK-other5`), _jsx(AntomChunk, { language: `javascript`, steps: [`build-the-autodebit-page`], chunks: [` return ( <>

Auto Debit Demo

Choose your payment method

{paymentOptions.map( ({ label, value, icon }) => { return ( setSelectedPaymentOptionId( event.target.value ) } checked={ selectedPaymentOptionId === value } />

{label} ); } )}

{renderPaymentResult()}

{renderAlert()}

This page is used only for sandbox testing, for more testing information, please refer Testing resources

); } `] }, `Web-React-SDK-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`export default Home; `] }, `Web-React-SDK-other6`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/ReceiveAuthCode.jsx', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/src/components/ReceiveAuthCode/ReceiveAuthCode.jsx', downloadOnly: false, steps: [`get-and-process-auth-info`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import { useEffect, useState } from 'react'; import { useSearchParams, useNavigate } from 'react-router-dom'; import './ReceiveAuthCode.css'; function ReceiveAuthCode() { const [showLoader, setShowLoader] = useState(false); const [searchParams] = useSearchParams(); const navigate = useNavigate(); useEffect(() => { const authCode = searchParams.get('authCode'); const authState = searchParams.get('authState'); if (!authCode || !authState) { navigate('/'); } setShowLoader(true); `] }, `Web-React-SDK-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-and-process-auth-info`], chunks: [` const validateAuthCode = async () => { // Define the URL for your backend endpoint const url = 'http://localhost:8080/authorizations/applyTokenAndPay'; const config = { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ authCode, authState, }), }; try { const response = await fetch(url, config); if (!response.ok) throw new Error('Network response was not ok'); const res = await response.json(); if (res.status === 'success') {`, ' navigate(`/?paymentRequestId=\${res.data.paymentRequestId}`);', ` } } finally { setShowLoader(false); } }; `] }, `Web-React-SDK-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` validateAuthCode(); }, [searchParams]); return ( <> {showLoader && (

)} ); } export default ReceiveAuthCode; `] }, `Web-React-SDK-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/index.html', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/index.html', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` Antom Demo Checkout

`] }, `Web-React-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/package.json', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/package.json', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`{ "name": "antom-sdk-merchant-react-client", "author": "rongzhao.lee", "version": "0.0.0", "type": "module", "scripts": { "dev": "vite", "build": "vite build", "preview": "vite preview", "format": "prettier --write .", "lint": "eslint ." }, "dependencies": { "@alipay/ams-checkout": "^1.18.0", "react": "^18.3.1", "react-dom": "^18.3.1", "react-router-dom": "^6.26.1" }, "devDependencies": { "@eslint/js": "^9.8.0", "@types/react": "^18.3.3", "@types/react-dom": "^18.3.0", "@vitejs/plugin-react": "^4.3.1", "eslint": "^9.8.0", "eslint-plugin-react": "^7.35.0", "eslint-plugin-react-hooks": "^5.1.0-rc.0", "eslint-plugin-react-refresh": "^0.4.9", "globals": "^15.9.0", "prettier": "^3.3.3", "vite": "^5.4.0" }, "repository": "https://code.alipay.com/antom-example/antom-online-payment-sample-web.git" } `] }, `Web-React-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/README.md', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`# Project Title antom-online-payments-demo-using-npm-sdk ## Prerequisites - **Node.js**: Ensure that you have Node.js installed on your machine. You can download it from [nodejs.org](https://nodejs.org/).`, '- **npm**: Node.js comes with npm (Node Package Manager). Ensure you have the latest version by running `npm install -g npm`.', ` ## Getting Started This demo project showcases how Antom payment works. For more detailed information, visit the [Antom Documentation](https://global.alipay.com/docs/). Follow these steps to set up and run the project: ### 1. Install Dependencies Once inside the project directory, install the required dependencies using npm: `, '```bash', `npm install`, '```', ` ### 2. Start the Client `, '```bash', `npm run dev`, '```', ` `] }, `Web-React-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/vite.config.js', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/vite.config.js', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import { defineConfig } from 'vite'; import react from '@vitejs/plugin-react'; // https://vitejs.dev/config/ export default defineConfig({ plugins: [react()], server: { port: 5173, }, }); `] }, `Web-React-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/Home.css', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/components/Home/Home.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`body { margin: 0; padding: 0; font-family: 'PingFang SC'; display: flex; flex-direction: column; height: 100vh; margin: 0 auto; } .antom-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } header { width: 100%; height: 72px; background: #fdfdfd; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .header-content { margin: 0 auto; width: 70%; height: 100%; display: flex; align-items: center; justify-content: flex-start; } .header-content-img { width: 120px; } .header-content .subtitle { margin-left: 28px; color: #bcbcbc; font-size: 16px; font-style: normal; font-weight: 500; line-height: 24px; } .content { display: flex; flex-direction: column; position: relative; overflow: hidden; margin-top: 82px; height: 800px; flex-shrink: 0; border-radius: 40px; background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .headerContent { display: flex; align-items: center; justify-content: flex-start; } .headerContent .logo { margin: 0 10px; } .headerContent .testDemo { width: 62px; height: 16px; display: flex; align-items: center; justify-content: center; border-radius: 4px; background: rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.4); font-size: 8px; font-weight: 400; } .checkout-container { margin: 0 auto; width: 100%; display: flex; flex-direction: column; flex-grow: 1; width: 660px; height: 100%; padding: 162px 64px 76px 56px; box-sizing: border-box; } p { display: inline-flex; align-items: center; gap: 10px; color: #2a3a52; } .payment-option { border: 2px solid #000; padding: 10px; margin-bottom: 20px; display: none; cursor: pointer; } .payment-option.selected { border-color: #1650ff; } .show { display: block; } .submit { width: 100%; height: 56px; border-radius: 12px; background: #1650ff; color: #fff; border: none; text-decoration: none; cursor: pointer; font-size: 16px; display: block; margin-top: 32px; } .radio-group { display: flex; flex-direction: column; } .radio-group label { display: flex; align-items: center; margin-bottom: 8px; padding: 8px 16px; border: 1px solid #ebebeb; background: #fff; border-radius: 12px; color: #2a3a52; font-size: 16px; font-weight: 400; line-height: 24px; } .radio-group label.show { display: flex; } .radio-input { display: none; } .radio-button { width: 14px; height: 14px; border: 1px solid #abb9cc; margin-right: 8px; border-radius: 50%; } .radio-input:checked + .radio-button { border: 4px solid #1650ff; width: 8px; height: 8px; } .payment-icon { vertical-align: middle; display: flex; width: 32px; height: 32px; margin: 0 12px; padding: 4px 4.001px 3.996px 3.999px; justify-content: center; align-items: center; border-radius: 8px; border: 0.5px solid #f5f5f5; background: #fcfcfc; } .disabled { cursor: not-allowed; opacity: 0.5; pointer-events: none; } /* Result */ .hidden { display: none; } #result-container { display: flex; flex-direction: column; margin-top: 14px; align-items: flex-start; border-radius: 12px; border: 1px solid rgba(0, 0, 0, 0); padding: 12px 16px; color: #2a3a52; font-size: 13px; font-weight: 500; line-height: 20px; } .result-title { display: flex; align-items: center; } .result-title img { width: 20px; margin-right: 12px; } #content { color: #7c8ca3; text-align: center; font-size: 12px; font-weight: 400; line-height: 18px; margin-top: 8px; padding-left: 32px; } /* The Modal (background) */ .mockup { /* display: none; */ z-index: 1000; width: 100vw; height: 100vh; position: fixed; top: 0px; left: 0px; background: rgba(0, 0, 0, 0.6); } /* Modal Content/Box */ .container-desktop { /* display: none; */ width: 370px; height: 248px; position: fixed; top: 50%; left: 50%; z-index: 1001; border-radius: 12px; overflow: hidden; transform-origin: 50% 50%; transform: translate(-50%, -50%); box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1); padding: 40px 0px 24px 0px; background-color: #fff; } @keyframes container-zoom-in { 0% { transform: translate(-50%, -50%) scale(0.4); opacity: 0; } 80% { opacity: 1; } 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); } } .desktop-animation { animation: container-zoom-in 0.3s ease-in-out; animation-fill-mode: forwards; } .container-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } .container-content img { width: 64px; height: 64px; } .container-title { color: var(--Content-Primary, #2a3a52); text-align: center; font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .container-subTitle { color: #7c8ca3; text-align: center; font-size: 14px; font-weight: 400; line-height: 20px; margin-top: 24px; } .container-btn { display: flex; width: 338px; height: 48px; padding: 0px 24px; justify-content: center; align-items: center; border-radius: var(---Button, 12px); background: var(--Action-Normal, #1650ff); border: none; cursor: pointer; color: var(--Content-Quaternary, #fff); font-size: 16px; font-weight: 500; line-height: 24px; margin-top: 24px; } .footer { display: flex; justify-content: center; margin-top: 20px; color: #bcbcbc; font-size: 16px; font-weight: 500; line-height: 24px; } .gotoTest { color: #1650ff; margin: 0 4px; text-decoration: none; } `] }, `Web-React-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/ReceiveAuthCode.css', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/components/ReceiveAuthCode/ReceiveAuthCode.css', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`.overlay { position: fixed; display: flex; top: 0; left: 0; width: 100%; height: 100%; align-items: center; justify-content: center; z-index: 1000; } .loader { border: 5px solid rgba(0, 0, 0, 0.1); border-left-color: #3498db; border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } `] }, `Web-React-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/App.jsx', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/App.jsx', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; import Home from './components/Home/Home'; import ReceiveAuthCode from './components/receiveAuthCode/receiveAuthCode'; function App() { return ( <> } /> } /> ); } export default App; `] }, `Web-React-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/react/main.jsx', when: { platform: 'Web', client: 'React', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/main.jsx', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import { StrictMode } from 'react'; import { createRoot } from 'react-dom/client'; import App from './App.jsx'; createRoot(document.getElementById('root')).render( ); `] }, `Web-React-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/Home.vue', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/src/components/Home.vue', downloadOnly: false, steps: [`build-the-autodebit-page`, `initialize-instantiate-the-sdk`, `get-a-consult-session`, `invoke-the-sdk`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [`build-the-autodebit-page`], chunks: [` `] }, `Web-Vue-SDK-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` `] }, `Web-Vue-SDK-other5`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/ReceiveAuthCode.vue', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/src/components/ReceiveAuthCode.vue', downloadOnly: false, steps: [`get-and-process-auth-info`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` `] }, `Web-Vue-SDK-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/App.vue', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/App.vue', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/main.ts', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/main.ts', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import { createApp } from 'vue'; import App from './App.vue'; import router from './router'; const app = createApp(App); app.use(router); app.mount('#app'); `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/router.ts', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/router.ts', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import { createRouter, createWebHistory } from 'vue-router'; import Home from './components/Home.vue'; import ReceiveAuthCode from './components/ReceiveAuthCode.vue'; const routes = [ { path: '/', component: Home }, { path: '/receiveAuthCode', component: ReceiveAuthCode }, ]; const router = createRouter({ history: createWebHistory(), routes, }); export default router; `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/vite-env.d.ts', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/vite-env.d.ts', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`/// `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/tsconfig.node.json', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/tsconfig.node.json', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`{ "compilerOptions": { "target": "ES2022", "lib": ["ES2023"], "module": "ESNext", "skipLibCheck": true, /* Bundler mode */ "moduleResolution": "bundler", "allowImportingTsExtensions": true, "isolatedModules": true, "moduleDetection": "force", "noEmit": true, /* Linting */ "strict": true, "noUnusedLocals": true, "noUnusedParameters": true, "noFallthroughCasesInSwitch": true }, "include": ["vite.config.ts"] } `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/index.html', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/index.html', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` Antom Demo Checkout

`] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/tsconfig.app.json', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/tsconfig.app.json', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`{ "compilerOptions": { "target": "ES2020", "useDefineForClassFields": true, "module": "ESNext", "lib": ["ES2020", "DOM", "DOM.Iterable"], "skipLibCheck": true, /* Bundler mode */ "moduleResolution": "bundler", "allowImportingTsExtensions": true, "isolatedModules": true, "moduleDetection": "force", "noEmit": true, "jsx": "preserve", /* Linting */ "strict": true, "noUnusedLocals": true, "noUnusedParameters": true, "noFallthroughCasesInSwitch": true }, "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"] } `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/README.md', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`# Project Title antom-online-payments-demo-using-npm-sdk ## Prerequisites - **Node.js**: Ensure that you have Node.js installed on your machine. You can download it from [nodejs.org](https://nodejs.org/).`, '- **npm**: Node.js comes with npm (Node Package Manager). Ensure you have the latest version by running `npm install -g npm`.', ` ## Getting Started This demo project showcases how Antom payment works. For more detailed information, visit the [Antom Documentation](https://global.alipay.com/docs/). Follow these steps to set up and run the project: ### 1. Install Dependencies Once inside the project directory, install the required dependencies using npm: `, '```bash', `npm install`, '```', ` ### 2. Start the Client `, '```bash', `npm run dev`, '```', ` `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/package.json', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/package.json', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`{ "name": "antom-sdk-merchant-vue-client", "author": "rongzhao.lee", "version": "0.0.0", "type": "module", "scripts": { "dev": "vite", "build": "vue-tsc -b && vite build", "preview": "vite preview", "format": "prettier --write .", "lint": "eslint ." }, "dependencies": { "@alipay/ams-checkout": "^1.18.0", "vue": "^3.4.35", "vue-router": "^4.4.3" }, "devDependencies": { "@eslint/js": "^9.9.0", "@vitejs/plugin-vue": "^5.1.2", "prettier": "^3.3.3", "sass-embedded": "^1.77.8", "typescript": "^5.5.3", "vite": "^5.4.0", "vue-tsc": "^2.0.29" } } `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/tsconfig.json', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/tsconfig.json', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`{ "files": [], "references": [ { "path": "./tsconfig.app.json" }, { "path": "./tsconfig.node.json" } ] } `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/web/vue/vite.config.ts', when: { platform: 'Web', client: 'Vue', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/vite.config.ts', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import { defineConfig } from 'vite'; import vue from '@vitejs/plugin-vue'; // https://vitejs.dev/config/ export default defineConfig({ plugins: [vue()], }); `] }, `Web-Vue-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/MainActivity.java', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `java`, filename: 'client/src/main/java/com/antom/auto_debit_api_java/MainActivity.java', downloadOnly: false, steps: [`build-the-autodebit-page`, `get-auth-continuation-link`, `handle-the-auth-redirection`, `listen-for-callback-addresses`, `get-and-process-auth-info`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`package com.antom.auto_debit_api_java; import android.content.Intent; import android.graphics.drawable.Drawable; import android.net.Uri; import android.os.Bundle; import android.text.TextUtils; import android.view.View; import android.widget.Button; import android.widget.RadioButton; import android.widget.TextView; import androidx.appcompat.app.AppCompatActivity; import androidx.core.content.ContextCompat; import com.antom.auto_debit_api_java.Common.*; import org.json.JSONObject; import java.util.Objects; import java.util.concurrent.ExecutorService; import java.util.concurrent.Executors; public class MainActivity extends AppCompatActivity { PaymentMethodView selectPayment; RadioButton paymentMethod1; RadioButton paymentMethod2; RadioButton paymentMethod3; Button tvPay; ExecutorService executorService = Executors.newSingleThreadExecutor(); `] }, `Android-Java-API-other1`), _jsx(AntomChunk, { language: `java`, steps: [`build-the-autodebit-page`], chunks: [` @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); paymentMethod1 = findViewById(R.id.payment_method_1); paymentMethod2 = findViewById(R.id.payment_method_2); paymentMethod3 = findViewById(R.id.payment_method_3); ((TextView) findViewById(R.id.title)).setText("AUTO DEBIT API"); tvPay = findViewById(R.id.tv_pay); createPaymentMethodView(paymentMethod1, new PaymentMethodView(R.drawable.rabbit_line_pay, "Rabbit Line Pay", "RABBIT_LINE_PAY", "THB", "10000")); createPaymentMethodView(paymentMethod2, new PaymentMethodView(R.drawable.gcash, "GCash", "GCASH", "PHP", "5500")); createPaymentMethodView(paymentMethod3, new PaymentMethodView(R.drawable.grabpay_sg, "GrabPay SG", "GRABPAY_SG", "SGD", "380")); tvPay.setEnabled(selectPayment == null); tvPay.setOnClickListener(view -> { autodebitPayment(); }); } private void createPaymentMethodView(RadioButton radioButton, PaymentMethodView paymentMethodView) { Drawable image = ContextCompat.getDrawable(this, paymentMethodView.getDrawableResId()); if (image == null) return; image.setBounds(0, 0, 120, 120); radioButton.setCompoundDrawables(image, null, null, null); radioButton.setText(paymentMethodView.getTitle()); radioButton.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { selectPayment = paymentMethodView; tvPay.setEnabled(true); tvPay.setText(String.format("Pay-%s-%s ", selectPayment.getCurrency(), selectPayment.getAmount())); } }); } `] }, `Android-Java-API-code1`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` String bodyAutodebitParamsJson() { // you can use Gson or other Json format utils return "{" + "\\"amountValue\\":\\"" + selectPayment.getAmount() + "\\"," + "\\"currency\\":\\"" + selectPayment.getCurrency() + "\\"," + "\\"paymentMethodType\\":\\"" + selectPayment.getPaymentMethodCode() + "\\"," + "\\"terminalType\\":\\"" + "APP" + "\\"," + "\\"osType\\":\\"" + "ANDROID" + "\\"" + "}"; } `] }, `Android-Java-API-other2`), _jsx(AntomChunk, { language: `java`, steps: [`get-auth-continuation-link`], chunks: [` public void autodebitPayment() { if (selectPayment == null) { AlertUtils.showAlertWithMessage(this, "please select paymentMethod"); return; } LoadingIndicator.getInstance().showLoading(this); executorService.submit(() -> { HttpService.HttpResponse response = HttpService.instance.request(HttpService.Method.POST, "/authorizations/consult", bodyAutodebitParamsJson(), null); runOnUiThread(() -> { LoadingIndicator.getInstance().dismissLoading(); if (response.getErrorMessage() != null) { AlertUtils.showAlertWithMessage(MainActivity.this, response.getErrorMessage()); } else { if (response.isSuccess()) { autoDebitRedirect(Objects.requireNonNull(response.getResponseBody().optJSONObject("data"))); } else { AlertUtils.showAlertWithMessage(MainActivity.this, "No data response"); } } }); }); } `] }, `Android-Java-API-code2`), _jsx(AntomChunk, { language: `java`, steps: [`handle-the-auth-redirection`], chunks: [` private void autoDebitRedirect(JSONObject data) { String schemeUrl = !data.isNull("schemeUrl") ? data.optString("schemeUrl") : null; String appLinkUrl = !data.isNull("schemeUrl") ? data.optString("applinkUrl") : null; String normalUrl = !data.isNull("normalUrl") ? data.optString("normalUrl") : null; if (!TextUtils.isEmpty(schemeUrl)) { String packageName = data.optString("appIdentifier"); schemeUrlRedirect(schemeUrl, appLinkUrl, normalUrl, packageName); return; } if (!TextUtils.isEmpty(appLinkUrl)) { String packageName = data.optString("appIdentifier"); appLinkUrlRedirect(appLinkUrl, normalUrl, packageName); } if (!TextUtils.isEmpty(normalUrl)) { normalUrlRedirect(normalUrl); } } `] }, `Android-Java-API-code3`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` private void schemeUrlRedirect(String schemeUrl, String appLinkUrl, String normalUrl, String packageName) { try { Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(schemeUrl)); if (!TextUtils.isEmpty(packageName)) { intent.setPackage(packageName); } intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK); this.startActivity(intent, null); } catch (Exception e) { appLinkUrlRedirect(appLinkUrl, normalUrl, packageName); } } private void appLinkUrlRedirect(String applinkUrl, String normalUrl, String packageName) { try { Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(applinkUrl)); if (!TextUtils.isEmpty(packageName)) { intent.setPackage(packageName); } intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK); this.startActivity(intent, null); } catch (Exception e) { normalUrlRedirect(normalUrl); } } private void normalUrlRedirect(String normalUrl) { try { Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(normalUrl)); intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK); this.startActivity(intent, null); } catch (Exception e) { AlertUtils.showAlertWithMessage(this, "Fail to redirect"); } } // url scheme callback merchant custom logic `] }, `Android-Java-API-other3`), _jsx(AntomChunk, { language: `java`, steps: [`listen-for-callback-addresses`], chunks: [` @Override protected void onNewIntent(Intent intent) { super.onNewIntent(intent); Uri uri = intent.getData(); if (uri != null && "/receiveAuthCode".equals(uri.getPath())) { onAuthRedirect(uri); } } `] }, `Android-Java-API-code4`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` public void onAuthRedirect(Uri uri) { if (uri == null) return; String authCode = uri.getQueryParameter("authCode"); String authState = uri.getQueryParameter("authState"); applyTokenAndPay(authCode, authState); } String bodyApplyTokenParamsJson(String authCode, String authState) { // you can use Gson or other Json format utils return "{" + "\\"authCode\\":\\"" + authCode + "\\"," + "\\"authState\\":\\"" + authState + "\\"" + "}"; } `] }, `Android-Java-API-other4`), _jsx(AntomChunk, { language: `java`, steps: [`get-and-process-auth-info`], chunks: [` private void applyTokenAndPay(String authCode, String authState) { if (authCode == null || authState == null) { AlertUtils.showAlertWithMessage(this, "Missing authCode and authState"); return; } LoadingIndicator.getInstance().showLoading(this); executorService.submit(() -> { String bodyParams = bodyApplyTokenParamsJson(authCode, authState); HttpService.HttpResponse response = HttpService.instance.request(HttpService.Method.POST, "/authorizations/applyTokenAndPay", bodyParams, null); runOnUiThread(() -> { LoadingIndicator.getInstance().dismissLoading(); if (response.isSuccess()) { ApplyTokenAndPayResult result = new ApplyTokenAndPayResult( response.getResponseBody().optJSONObject("data"), response.getResponseBody().optString("paymentRequestId"), response.getResponseBody().optString("authState"), response.getResponseBody().optString("status"), response.getResponseBody().optString("message")); onInquiryPaymentAction(result); } else { AlertUtils.showAlertWithMessage(MainActivity.this, response.getErrorMessage()); } }); }); } `] }, `Android-Java-API-code5`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` String bodyInquiryPaymentParamsJson(String paymentRequestId) { // you can use Gson or other Json format utils return "{" + "\\"paymentRequestId\\":\\"" + paymentRequestId + "\\"" + "}"; }`] }, `Android-Java-API-other5`), _jsx(AntomChunk, { language: `java`, steps: [`display-the-payment-result`], chunks: [` private void onInquiryPaymentAction(ApplyTokenAndPayResult result) { LoadingIndicator.getInstance().showLoading(this); executorService.submit(() -> { String resultSuccessMessage = ""; int maxCount = 5; int currentCount = 0; while (currentCount < maxCount) { try { HttpService.HttpResponse response = HttpService.instance.request(HttpService.Method.POST, "/payment/inquiryPayment", bodyInquiryPaymentParamsJson(result.getPaymentRequestId()), null); if (response.isSuccess()) { InquiryPaymentResult paymentResult = new InquiryPaymentResult( response.getResponseBody().optJSONObject("data"), response.getResponseBody().optString("paymentRequestId"), response.getResponseBody().optString("authState"), response.getResponseBody().optString("status"), response.getResponseBody().optString("message")); JSONObject dataresult = paymentResult.getData().optJSONObject("result"); String resultCode = dataresult != null ? dataresult.optString("resultCode") : null; if ("SUCCESS".equals(resultCode)) { resultSuccessMessage = "Payment Success"; break; } resultSuccessMessage = resultCode; currentCount++; } } catch (Exception e) { runOnUiThread(() -> { LoadingIndicator.getInstance().dismissLoading(); AlertUtils.showAlertWithMessage(MainActivity.this, "Payment Failed"); }); break; } } String finalResultSuccessMessage = resultSuccessMessage; runOnUiThread(() -> { LoadingIndicator.getInstance().dismissLoading(); AlertUtils.showAlertWithMessage(MainActivity.this, finalResultSuccessMessage); }); }); } `] }, `Android-Java-API-code6`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`} `] }, `Android-Java-API-other6`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/Common.java', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/java/com/antom/auto_debit_api_java/Common.java', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`package com.antom.auto_debit_api_java; import android.app.Activity; import android.app.Dialog; import android.content.Context; import android.content.DialogInterface; import android.util.Log; import android.view.Window; import android.view.WindowManager; import android.widget.ProgressBar; import androidx.annotation.DrawableRes; import androidx.appcompat.app.AlertDialog; import org.json.JSONObject; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import java.io.OutputStream; import java.net.HttpURLConnection; import java.net.URL; import java.net.URLEncoder; import java.nio.charset.StandardCharsets; import java.util.Map; public class Common { static public class AlertUtils { public static void showAlertWithMessage(Activity context, String message) { if (context == null || context.isFinishing() || (context.isDestroyed())) { return; } new AlertDialog.Builder(context) .setMessage(message) .setCancelable(true) .setPositiveButton("OK", new DialogInterface.OnClickListener() { public void onClick(DialogInterface dialog, int id) { dialog.dismiss(); } }) .show(); } } public static class ApplyTokenAndPayResult { private final JSONObject data; private final String paymentRequestId; private final String authState; private final String status; private final String message; public ApplyTokenAndPayResult(JSONObject data, String paymentRequestId, String authState, String status, String message) { this.data = data; this.paymentRequestId = paymentRequestId; this.authState = authState; this.status = status; this.message = message; } public JSONObject getData() { return data; } public String getPaymentRequestId() { return paymentRequestId; } public String getAuthState() { return authState; } public String getMessage() { return message; } public String getStatus() { return status; } } public static class HttpService { public static final String TAG = "HttpInfo"; public static final HttpService instance = new HttpService(); private static final String HOST_URL = "http://10.0.2.2:8080"; /** * Synchronous call running in a thread */ public HttpService.HttpResponse request(HttpService.Method method, String url, String body, Map requestParam) { String fullUrl = buildUrl(url, requestParam); HttpURLConnection connection = null; try { // Create the connection Log.d(TAG, "Request URL: " + fullUrl); Log.d(TAG, "Request Method: " + method); if (body != null) { Log.d(TAG, "Request Body: " + body); } URL urlObj = new URL(fullUrl); connection = (HttpURLConnection) urlObj.openConnection(); connection.setRequestMethod(method.name()); connection.setRequestProperty("Content-Type", "application/json; charset=UTF-8"); connection.setDoOutput(true); // To send request body // If POST method and body is provided if (method == HttpService.Method.POST && body != null) { try (OutputStream os = connection.getOutputStream()) { byte[] input = body.getBytes(StandardCharsets.UTF_8); os.write(input, 0, input.length); } } // Get the response int responseCode = connection.getResponseCode(); String responseMessage = connection.getResponseMessage(); StringBuilder responseBody = new StringBuilder(); try (BufferedReader in = new BufferedReader(new InputStreamReader( responseCode >= 200 && responseCode < 300 ? connection.getInputStream() : connection.getErrorStream(), StandardCharsets.UTF_8))) { String line; while ((line = in.readLine()) != null) { responseBody.append(line); } } Log.d(TAG, "Response Code: " + responseCode); Log.d(TAG, "Response Message: " + responseMessage); Log.d(TAG, "Response Body: " + responseBody); if (responseCode == HttpURLConnection.HTTP_OK) { JSONObject jsonObject = new JSONObject(responseBody.toString()); return new HttpService.HttpResponse(jsonObject); } else { return new HttpService.HttpResponse(responseMessage.isEmpty() ? "Failed" : responseMessage); } } catch (Exception e) { e.printStackTrace(); return new HttpService.HttpResponse(e.getMessage() != null ? e.getMessage() : "Unknown exception"); } finally { if (connection != null) { connection.disconnect(); } } } private String buildUrl(String url, Map params) { StringBuilder urlBuilder = new StringBuilder(HOST_URL).append(url); if (params != null && !params.isEmpty()) { urlBuilder.append("?"); for (Map.Entry entry : params.entrySet()) { try { urlBuilder.append(URLEncoder.encode(entry.getKey(), StandardCharsets.UTF_8.toString())) .append("=") .append(URLEncoder.encode(entry.getValue(), StandardCharsets.UTF_8.toString())) .append("&"); } catch (IOException e) { e.printStackTrace(); } } urlBuilder.setLength(urlBuilder.length() - 1); // Remove the trailing "&" } return urlBuilder.toString(); } public enum Method { POST, GET } public static class HttpResponse { private final JSONObject responseBody; private final String errorMessage; public HttpResponse(JSONObject responseBody) { this.responseBody = responseBody; this.errorMessage = null; // 成功响应时没有错误信息 } public HttpResponse(String errorMessage) { this.responseBody = null; // 失败响应时没有响应体 this.errorMessage = errorMessage; } public boolean isSuccess() { return responseBody != null; } public JSONObject getResponseBody() { return responseBody; } public String getErrorMessage() { return errorMessage; } } } public static class InquiryPaymentResult { private final JSONObject data; private final String paymentRequestId; private final String authState; private final String status; private final String message; public InquiryPaymentResult(JSONObject data, String paymentRequestId, String authState, String status, String message) { this.data = data; this.paymentRequestId = paymentRequestId; this.authState = authState; this.status = status; this.message = message; } public JSONObject getData() { return data; } public String getPaymentRequestId() { return paymentRequestId; } public String getAuthState() { return authState; } public String getMessage() { return message; } public String getStatus() { return status; } } public static class LoadingIndicator { private static LoadingIndicator instance; private Dialog loadingDialog; private LoadingIndicator() { } public static LoadingIndicator getInstance() { if (instance == null) { instance = new LoadingIndicator(); } return instance; } public void showLoading(Context context) { if (loadingDialog == null) { loadingDialog = new Dialog(context); loadingDialog.setTitle("Loading..."); loadingDialog.requestWindowFeature(Window.FEATURE_NO_TITLE); loadingDialog.setContentView(new ProgressBar(context)); loadingDialog.setCancelable(false); Window window = loadingDialog.getWindow(); if (window != null) { window.setLayout(WindowManager.LayoutParams.WRAP_CONTENT, WindowManager.LayoutParams.WRAP_CONTENT); window.setBackgroundDrawableResource(android.R.color.transparent); // 可选，设置背景透明 } } loadingDialog.show(); } public void dismissLoading() { if (loadingDialog != null && loadingDialog.isShowing()) { loadingDialog.dismiss(); } } } public static class PaymentMethodView { @DrawableRes private final int drawableResId; private final String title; private final String paymentMethodCode; private final String currency; private final String amount; public PaymentMethodView( @DrawableRes int drawableResId, String title, String paymentMethodCode, String currency, String amount ) { this.drawableResId = drawableResId; this.title = title; this.paymentMethodCode = paymentMethodCode; this.currency = currency; this.amount = amount; } public int getDrawableResId() { return drawableResId; } public String getTitle() { return title; } public String getAmount() { return amount; } public String getCurrency() { return currency; } public String getPaymentMethodCode() { return paymentMethodCode; } } } `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/grabpay_sg.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/grabpay_sg.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`

`] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/pay_btn_bg.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/pay_btn_bg.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/rabbit_line_pay.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/rabbit_line_pay.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/gcash.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/gcash.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/selectedboard.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/selectedboard.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/radiobtn_bg.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/radiobtn_bg.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/input_bg.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/input_bg.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/ic_launcher_background.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/ic_launcher_background.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/android/java/activity_main.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/layout/activity_main.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `iOS-Objective-C-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/AppDelegate.h', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/AppDelegate.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// // AppDelegate.h // auto_debit_api_objc // // Created by ant on 2024/9/14. // #import @interface AppDelegate : UIResponder @property (strong, nonatomic) UIWindow * window; @end `] }, `iOS-Objective-C-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/Common.h', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/Common.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` #import #import "UIKit/UIKit.h" NS_ASSUME_NONNULL_BEGIN @interface AlterUtils : NSObject + (void)showAlertWithMessage:(NSString *)message; @end @interface InquiryPaymentResult : NSObject @property (nonatomic, strong, readonly) NSDictionary *data; @property (nonatomic, copy, readonly) NSString *paymentRequestId; @property (nonatomic, copy, readonly) NSString *authState; @property (nonatomic, copy, readonly) NSString *status; @property (nonatomic, copy, readonly) NSString *message; - (instancetype)initWithData:(NSDictionary *)data paymentRequestId:(NSString *)paymentRequestId authState:(NSString *)authState status:(NSString *)status message:(NSString *)message; // 解析方法 + (instancetype)parseFromJSON:(NSDictionary *)json; @end @interface HttpResponse : NSObject @property (nonatomic, strong) NSDictionary *responseBody; @property (nonatomic, strong) NSString *errorMessage; + (instancetype)successWithResponseBody:(NSDictionary *)responseBody; + (instancetype)failureWithErrorMessage:(NSString *)errorMessage; @end typedef NS_ENUM(NSInteger, HttpMethod) { HttpMethodGET, HttpMethodPOST }; @interface HttpService : NSObject - (void)requestWithMethod:(HttpMethod)method urlpath:(NSString *)url body:(NSDictionary *)body requestParam:(NSDictionary *)params completion:(void (^)(HttpResponse *response))completion; + (instancetype)sharedInstance; @end @interface LoadingIndicator : NSObject + (instancetype)sharedInstance; - (void)showLoadingInView:(UIView *)view; - (void)dismissLoading; @end @interface PaymentMethodView : NSObject @property (nonatomic, copy) NSString *icon; @property (nonatomic, copy) NSString *title; @property (nonatomic, copy) NSString *paymentMethodCode; @property (nonatomic, copy) NSString *currency; @property (nonatomic, copy) NSString *amount; - (instancetype)initWithIcon:(NSString *)icon title:(NSString *)title paymentMethodCode:(NSString *)paymentMethodCode currency:(NSString *)currency amount:(NSString*)amount; -(NSString*)formatAmount; @end @class PaymentMethodView; @interface PaymentMethodViewCell : UITableViewCell @property (nonatomic, strong) PaymentMethodView *paymentMethod; @property (weak, nonatomic) IBOutlet UIButton *radioButton; @property (weak, nonatomic) IBOutlet UILabel *title; @property (weak, nonatomic) IBOutlet UIImageView *iconImage; - (void)configureWithPaymentMethod:(PaymentMethodView *)paymentMethod selected:(BOOL)selected; @end @interface ImageBase64Converter : NSObject + (NSString *)imageToBase64:(UIImage *)image; + (UIImage *)base64ToImage:(NSString *)base64String; @end @interface ApplyTokenRequest : NSObject @property(nonatomic,copy) NSString* authCode; @property(nonatomic,copy) NSString* authState; + (instancetype)requestWithAuthCode:(NSString *)authCode authState:(NSString *)authState; -(NSDictionary*)applyTokenParams; @end @interface ApplyTokenResult : NSObject @property (nonatomic, strong, readonly) NSDictionary *data; @property (nonatomic, copy, readonly) NSString *paymentRequestId; @property (nonatomic, copy, readonly) NSString *authState; @property (nonatomic, copy, readonly) NSString *status; @property (nonatomic, copy, readonly) NSString *message; - (instancetype)initWithData:(NSDictionary *)data paymentRequestId:(NSString *)paymentRequestId authState:(NSString *)authState status:(NSString *)status message:(NSString *)message; // 解析方法 + (instancetype)parseFromJSON:(NSDictionary *)json; @end NS_ASSUME_NONNULL_END `] }, `iOS-Objective-C-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/PaymentMethodViewCell.xib', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/PaymentMethodViewCell.xib', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` `] }, `iOS-Objective-C-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/Info.plist', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/Info.plist', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` NSAppTransportSecurity NSAllowsArbitraryLoads CFBundleURLTypes CFBundleURLSchemes autodebitapi `] }, `iOS-Objective-C-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/ViewController.h', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/ViewController.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// // ViewController.h // auto_debit_api_objc // // Created by ant on 2024/9/14. // #import @interface ViewController : UIViewController @end `] }, `iOS-Objective-C-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/ViewController.m', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/ViewController.m', downloadOnly: false, steps: [`build-the-autodebit-page`, `initialize-instantiate-the-sdk`, `get-a-consult-session`, `invoke-the-sdk`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// // ViewController.m // auto_debit_sdk_objc // // Created by ant on 2024/9/14. // `] }, `iOS-Objective-C-SDK-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`build-the-autodebit-page`], chunks: [`#import "ViewController.h" #import "Common.h" #import @interface ViewController () @property(nonatomic,weak) IBOutlet UILabel *titleLabel; @property(nonatomic,weak) IBOutlet UILabel *tipLabel; @property (nonatomic, strong) UITableView *tableView; @property (nonatomic, strong) NSMutableArray *paymentMethods; @property (nonatomic, assign) NSInteger selectedIndex; @property (nonatomic,strong) PaymentMethodView *selectMethod; @property (weak, nonatomic) IBOutlet UIButton *btncheckout; @end @implementation ViewController - (void)updateCheckoutDisplay:(PaymentMethodView *)selectMethod { [self.btncheckout setEnabled: _selectMethod == nil ? NO:YES]; [self.btncheckout setBackgroundColor: _selectMethod == nil ? [UIColor grayColor]: [UIColor blueColor]]; NSString *title = _selectMethod == nil ? @"Pay" : [[NSString alloc]initWithFormat:@"Pay %@", [selectMethod formatAmount]]; [self.btncheckout setTitle:title forState:UIControlStateNormal]; } -(void)setSelectMethod:(PaymentMethodView *)selectMethod{ _selectMethod = selectMethod; [self updateCheckoutDisplay:selectMethod]; } -(NSMutableArray*)paymentMethods{ if (_paymentMethods == nil) { _paymentMethods = [NSMutableArray arrayWithCapacity:0]; [_paymentMethods addObject: [[PaymentMethodView alloc]initWithIcon:@"iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAAAAXNSR0IArs4c6QAAAghJREFUaEPtl7tOAkEUhofEAi0M8QloaYwPoAYKY0+pvAmW8gKW1tpibSwg2lkZE0NLa4yGxEISC82/yUcOC+IwEZPdnWlgZ8/lv5xZ2JIr2CoVjK+LhPPueHQ4OpwzBeJI58zQGTrR4ehwzhQo7kiXe616zsycojNuXPS1MXG43Dv+OtjaXhnnm7fHldX2KTxuXCZcpwg/7567zbUNn/ylYq5e7t3R09lSOX8dHAlrpH0cPh123Um1OTHgdjRIvu9XalOm2H0cJsYnRzG2ZjqHa99JCHJYTTrDrrveaU/6HD50XLvanCFs9yEsofYqNad7WlzfjQZJDfZVX9/1CTHufdQvkj2JoT1f4gsJW2IUhRSNuZYAWsqZtyfQr5/vyRn+jXC6r+rZ+uojwuv9ViKGhNJSHLkSAkGsuAsJa2ztElCaiLCaKoaGKmxjAIkAPg6rBgv3fnIYgcHCNAkPwoMNLgsJixyjI/CMG6Oma5YKC6wFCWGESBMGjGoohhr2uFgSigO4cDF16ilMyqOO4hSjJR6shYQ5PzSypOyZ4eGF2wjBSCEWIy2AVizdtyOoOsSQC+D0+WbfPgfAy7jbSQ16aPk+EdNx//07XDjCTI0Vfq7DBftrWbCXh9DzmbW84r4PZ82pULzR4VDlspIXHc6KU6E4o8OhymUlLzqcFadCcUaHQ5XLSt43HjyvOMjtAswAAAAASUVORK5CYII=" title:@"Rabbit Line Pay" paymentMethodCode:@"RABBIT_LINE_PAY" currency:@"THB" amount:@"10000"]]; [_paymentMethods addObject: [[PaymentMethodView alloc]initWithIcon:@"iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAAAAXNSR0IArs4c6QAAApxJREFUaEPtV0tSGzEQbSUbuIvPgD0Lh8ppzAFc5aiKPXAT7xLsBcMdfBfYgOL+6TcDFqzQIG3Anpbc79OtHgPfbJlvhhca4Kkr3hRuCk+MgWbpiQk6gNMUbgpPjIFmaS/o2i3kf/3bw7Xpaxd8XOG1ewAABRpjtMfvqwaeAmZVESyuFNza/QGAjQDuMOBq/4Tf9bfL86+j/OwvC3X4PZpTDliV7WC7w40IUJeFwyUC9Gu1fyZy7pZnRECy6Id/bgC0NLAc3GNyRknMR2todu9IrCxXPSYADgpa2O7w+QZAkqRoM4fDLwKGQA0mfwxyYDZ3y7OUOALyQ5wSn4FnvnaefU4Oz2YyeGUxdNaCAOTqjakZA8bnmdIxYE7w2nRwgiVVFkEjYAPO3i7Pg/qze7b/4XJIhCZQFLN7CA7xGvVEvO73DhAiPYmxNQLJMWC2gqobJzvDH9blHq9uLryyq/2zGwGc2oqSM3M+QWx9gtQIENvTAzQK2JEzPHhxoAesBEju4s4ccA/bHVorqOPrjJLFurZlgCUZ3OYBSz0jmZRYFDPoAaLuGPFDhUPN5kRmThpaevvPSv2lhR8sZFc3c1ILlXVgsJ67pFOTIxzWXWbpyOpvxkjdjT3PSeJeIc01Vj5qWu8A1isp7tB4NXHDEnXRXtq0jmAR+GIIOG5aeL299lHHFoueiKE91Piy/RkwjmPQ3jklgBEXDxzauPTeVbN94lpS9rUTv9ikayYKjcQkjSma8sjSIzcB13rWPyRO3FY2eIQxk+9l7OQ8eNAl/6UGj7wXZJ/fGi1zdXUbTi+25pn6/bclHkZw8Zg22ZeHE7ao+XF7H65ZvZLcm8IlLNUc0xSuWb2S3JvCJSzVHNMUrlm9ktybwiUs1RzzH+qpoDj9yVmUAAAAAElFTkSuQmCC" title:@"Gcash" paymentMethodCode:@"GCASH" currency:@"PHP" amount:@"5500"]]; [_paymentMethods addObject: [[PaymentMethodView alloc]initWithIcon:@"iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAAAAXNSR0IArs4c6QAAAldJREFUaEPtV116wiAQBHsw9QLVnijNiaq9gHqwSr9ZGRwI+jX6VCQvKiHszs/uRu9e7PIvhtd1wK0r3hXuCjfGQLd0Y4JO4HSFu8KNMdAtnQn6tV25j93xaZH32890xmZ3/f70wfMPqCv8vTlkRwW3cs6P7tFk/wLY9oQhh/BEzBtcTAHvN8HA+bC0ZwgWv9/36/mcOudmAfbjNUYYnHfHh+NWks0Bk2UE+fFjZme1N76/hcHI4F4cjjUliY7AuWd3dAs4JYKwff6UXMPYm/01JzgNMc5+bbloXAskDuA9zbuylgNmAA1ak1RdgKQtdlgaSUaErNEVkzKJe0AEwNQAcw2ASZbFcpe+QsIRA+AW4ZDIwX2uCTFXwLSdWpcMKWiCgVJkngRgH1TVs0ACkmWJUAGqDoKQ8D3AEKAmhjoAsWcBVnBaq1p/SBqA+UnLWmCxJ4JzLZEVBlc6h6orYFVPbUtStXGqglYycxRmkvgs68DYiyolhaOat54DUSSGoMvGdxewP1ndcywCcNnAngackpQxlDUK7aAFYBIBBdQtWs9sVACSaj0qX7O0llLN0mmU+fHSFMMhI0XvR2dMx5JaMY0mNBhNLGZCeyVSpFmV1i9LQxtcqvuK7Qk6qSlNq5wIJIVj1UZq3s3rLx6qNGuKdW2B40GTepKxUwJCXG1mtdJhA6tNBj5vZRLHIXIq+0c5WqF6tUvfCvKf1stXYR1rsRe09eeBTTCV0/SVuC3AZcmUo9LK/8WuDrh1wbvCXeHGGOiWbkzQCZyucFe4MQa6pRsTdALnF36o6Dh7llC2AAAAAElFTkSuQmCC" title:@"GRabpay SG" paymentMethodCode:@"GRABPAY_SG" currency:@"SGD" amount:@"380"]]; }; return _paymentMethods; } -(UITableView *)tableView{ if (_tableView == nil) { _tableView = [[UITableView alloc]initWithFrame:CGRectMake(0,CGRectGetMaxY(self.tipLabel.frame) + 20 ,[UIScreen mainScreen].bounds.size.width, 300)]; [_tableView registerNib:[UINib nibWithNibName:@"PaymentMethodViewCell" bundle:nil] forCellReuseIdentifier:@"PaymentMethodViewCell"]; _tableView.delegate = self; _tableView.dataSource = self; _tableView.separatorStyle = UITableViewCellSeparatorStyleNone; } return _tableView; } - (void)viewDidLoad { [super viewDidLoad]; [self initConfiguration]; [self setUpView]; } -(void)setUpView{ self.selectedIndex = -1; [self.view addSubview:self.tableView]; [self.btncheckout addTarget:self action:@selector(autodebitPayment) forControlEvents:UIControlEventTouchUpInside]; [self initConfiguration]; } - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{ return self.paymentMethods.count; } - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{ PaymentMethodViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"PaymentMethodViewCell" forIndexPath:indexPath]; PaymentMethodView *paymentMethod = self.paymentMethods[indexPath.row]; BOOL isSelected = (indexPath.row == self.selectedIndex); [cell configureWithPaymentMethod:paymentMethod selected:isSelected]; return cell; } -(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{ return 100; } - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { if (self.selectedIndex != indexPath.row) { self.selectedIndex = indexPath.row; [tableView reloadData]; self.selectMethod = self.paymentMethods[self.selectedIndex]; } } - (NSDictionary *)dicWithPaymethod:(PaymentMethodView*)paymethod { return @{ @"amountValue":paymethod.amount, @"currency":paymethod.currency, @"paymentMethodType":paymethod.paymentMethodCode }; }`] }, `iOS-Objective-C-SDK-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [`initialize-instantiate-the-sdk`], chunks: [`- (void)initConfiguration { AMSAutoDebitConfiguration *componentConfig = [AMSAutoDebitConfiguration new]; componentConfig.options = @{@"sandbox":@"true",@"showLoading":@"true"}; [[AMSAutoDebit shared] initConfiguration:componentConfig]; [[AMSAutoDebit shared]initConfiguration:componentConfig]; }`] }, `iOS-Objective-C-SDK-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-a-consult-session`], chunks: [`- (void)autodebitPayment{ if (self.selectMethod == nil) { [AlterUtils showAlertWithMessage:@"Please choose your method "]; } [[LoadingIndicator sharedInstance] showLoadingInView:self.view]; [[HttpService sharedInstance]requestWithMethod:HttpMethodPOST urlpath:@"/authorizations/createConsultSession" body:[self dicWithPaymethod:self.selectMethod] requestParam:nil completion:^(HttpResponse *response) { dispatch_async(dispatch_get_main_queue(), ^{ [[LoadingIndicator sharedInstance]dismissLoading]; if (response.errorMessage) { NSLog(@"Antom --- Error: %@", response.errorMessage); [AlterUtils showAlertWithMessage:response.errorMessage]; } else { NSLog(@"Antom --- Response: %@", response.responseBody); if (response.responseBody[@"data"][@"paymentSessionData"] != nil) { NSString *sessionData = (NSString*)response.responseBody[@"data"][@"paymentSessionData"]; [self createAMSCheckout:sessionData]; } } }); }]; }`] }, `iOS-Objective-C-SDK-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [`invoke-the-sdk`], chunks: [`-(void)createAMSCheckout:(NSString*)sessionData{ [[AMSAutoDebit shared] createComponent:sessionData]; }`] }, `iOS-Objective-C-SDK-code4`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`-(void)onEventCallback:(NSString *)eventCode eventResult:(AMSEventResult *)eventResult{ NSLog(@"AMSCallback ---- %@%@",eventCode,eventResult); } @end `] }, `iOS-Objective-C-SDK-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/AppDelegate.m', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/AppDelegate.m', downloadOnly: false, steps: [`listen-for-callback-addresses`, `get-and-process-auth-info`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// // AppDelegate.m // auto_debit_api_objc // // Created by ant on 2024/9/14. // #import "AppDelegate.h" #import "Common.h" @interface AppDelegate () @end @implementation AppDelegate `] }, `iOS-Objective-C-SDK-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`listen-for-callback-addresses`], chunks: [`-(BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary *)options{ // custom scheme logic NSLog(@"----%@",url); if ([url.scheme isEqualToString:@"autodebitsdk"]) { [self handleRedirectUrl:url]; } return YES; }`] }, `iOS-Objective-C-SDK-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-and-process-auth-info`], chunks: [`- (void)handleRedirectUrl:(NSURL *)url { NSURLComponents *components = [NSURLComponents componentsWithURL:url resolvingAgainstBaseURL:NO]; NSMutableDictionary *queryItemsDict = [NSMutableDictionary dictionary]; for (NSURLQueryItem *item in components.queryItems) { queryItemsDict[item.name] = item.value; } // get authCode and authState NSString *authCode = queryItemsDict[@"authCode"]; NSString *authState = queryItemsDict[@"authState"]; NSLog(@"Auth Code: %@", authCode); NSLog(@"Auth State: %@", authState); if (authCode == nil || authState == nil) { [AlterUtils showAlertWithMessage:@"authCode or authState can not be nil"]; return; } [[LoadingIndicator sharedInstance] showLoadingInView:self.window]; ApplyTokenRequest *applyRequest = [ApplyTokenRequest requestWithAuthCode:authCode authState:authState]; [[HttpService sharedInstance]requestWithMethod:HttpMethodPOST urlpath:@"/authorizations/applyTokenAndPay" body:[applyRequest applyTokenParams] requestParam:nil completion:^(HttpResponse *response) { dispatch_async(dispatch_get_main_queue(), ^{ [[LoadingIndicator sharedInstance]dismissLoading]; if (response.errorMessage) { NSLog(@"Antom --- Error: %@", response.errorMessage); [AlterUtils showAlertWithMessage:response.errorMessage]; } else { NSLog(@"Antom --- Response: %@", response.responseBody); if([response.responseBody isKindOfClass:[NSDictionary class]]){ ApplyTokenResult *applyresponse = [ApplyTokenResult parseFromJSON:response.responseBody]; if ([applyresponse paymentRequestId] == nil) { [AlterUtils showAlertWithMessage:@"applyTokenAndPay paymentRequestId failedd"]; } else{ NSString *resultCode = [applyresponse.data[@"result"] objectForKey:@"resultCode"]; if ([resultCode isEqualToString:@"SUCCESS"]) { [self inquiryPaymentProcess:applyresponse.paymentRequestId]; } else{ [AlterUtils showAlertWithMessage:[applyresponse.data[@"result"] objectForKey:@"resultMessage"]]; } } } else{ [AlterUtils showAlertWithMessage:@"applyTokenAndPay error"]; } } }); }]; }`] }, `iOS-Objective-C-SDK-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`- (void)inquiryPaymentDisplay:(HttpResponse *)response { InquiryPaymentResult *inquiryPaymentResult = [InquiryPaymentResult parseFromJSON:response.responseBody]; if (inquiryPaymentResult.data != nil) { NSString *resultCode = [inquiryPaymentResult.data[@"result"] objectForKey:@"resultCode"]; if ([resultCode isEqualToString:@"SUCCESS"]) { [AlterUtils showAlertWithMessage:@"Payment Success"]; } }else{ [AlterUtils showAlertWithMessage:@"inquiryPaymentResult data is empty"]; } }`] }, `iOS-Objective-C-SDK-other2`), _jsx(AntomChunk, { language: `javascript`, steps: [`display-the-payment-result`], chunks: [`-(void)inquiryPaymentProcess:(NSString*)paymentRequestId{ [[LoadingIndicator sharedInstance]showLoadingInView:self.window]; [[HttpService sharedInstance]requestWithMethod:HttpMethodPOST urlpath:@"/payment/inquiryPayment" body:@{@"paymentRequestId":paymentRequestId} requestParam:nil completion:^(HttpResponse *response) { dispatch_async(dispatch_get_main_queue(), ^{ [[LoadingIndicator sharedInstance]dismissLoading]; if (response.errorMessage) { NSLog(@"Antom --- Error: %@", response.errorMessage); [AlterUtils showAlertWithMessage:response.errorMessage]; } else { NSLog(@"Antom --- Response: %@", response.responseBody); if([response.responseBody isKindOfClass:[NSDictionary class]]){ [self inquiryPaymentDisplay:response]; } else{ [AlterUtils showAlertWithMessage:@"inquiryPayment error"]; } } }); }]; } `] }, `iOS-Objective-C-SDK-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`@end `] }, `iOS-Objective-C-SDK-other3`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/Common.m', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/Common.m', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// // Common.m // auto_debit_sdk_objc // // Created by ant on 2024/11/12. // #import "Common.h" #import "UIKit/UIKit.h" static NSString * const HOST_URL = @"http://127.0.0.1:8080"; @implementation AlterUtils + (void)showAlertWithMessage:(NSString *)message { UIViewController *topViewController = [self topViewController]; if (topViewController) { UIAlertController *alertController = [UIAlertController alertControllerWithTitle:@"Tip" message:message preferredStyle:UIAlertControllerStyleAlert]; UIAlertAction *okAction = [UIAlertAction actionWithTitle:@"Close" style:UIAlertActionStyleDefault handler:nil]; [alertController addAction:okAction]; [topViewController presentViewController:alertController animated:YES completion:nil]; } } + (UIViewController *)topViewController { UIViewController *rootViewController = [UIApplication sharedApplication].keyWindow.rootViewController; return [self topViewControllerFrom:rootViewController]; } + (UIViewController *)topViewControllerFrom:(UIViewController *)vc { if ([vc presentedViewController]) { return [self topViewControllerFrom:[vc presentedViewController]]; } else if ([vc isKindOfClass:[UINavigationController class]]) { UINavigationController *navController = (UINavigationController *)vc; return [self topViewControllerFrom:[navController visibleViewController]]; } else if ([vc isKindOfClass:[UITabBarController class]]) { UITabBarController *tabBarController = (UITabBarController *)vc; return [self topViewControllerFrom:[tabBarController selectedViewController]]; } else { return vc; } } @end @implementation InquiryPaymentResult - (instancetype)initWithData:(NSDictionary *)data paymentRequestId:(NSString *)paymentRequestId authState:(NSString *)authState status:(NSString *)status message:(NSString *)message { self = [super init]; if (self) { _data = data; _paymentRequestId = [paymentRequestId copy]; _authState = [authState copy]; _status = [status copy]; _message = [message copy]; } return self; } + (instancetype)parseFromJSON:(NSDictionary *)json { NSDictionary *data = json[@"data"]; NSString *paymentRequestId = json[@"paymentRequestId"]; NSString *authState = json[@"authState"]; NSString *status = json[@"status"]; NSString *message = json[@"message"]; return [[self alloc] initWithData:data paymentRequestId:paymentRequestId authState:authState status:status message:message]; } @end @implementation HttpResponse + (instancetype)successWithResponseBody:(NSDictionary *)responseBody { HttpResponse *response = [[HttpResponse alloc] init]; response.responseBody = responseBody; return response; } + (instancetype)failureWithErrorMessage:(NSString *)errorMessage { HttpResponse *response = [[HttpResponse alloc] init]; response.errorMessage = errorMessage; return response; } @end @implementation HttpService - (void)requestWithMethod:(HttpMethod)method urlpath:(NSString *)url body:(NSDictionary *)body requestParam:(NSDictionary *)params completion:(void (^)(HttpResponse *response))completion { NSString *fullUrl = [self buildUrl:url params:params]; NSMutableURLRequest *request = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:fullUrl]]; [request setValue:@"application/json" forHTTPHeaderField:@"Content-Type"]; if (method == HttpMethodPOST) { NSError *error; NSData *jsonData = [NSJSONSerialization dataWithJSONObject:body options:0 error:&error]; if (!jsonData) { completion([HttpResponse failureWithErrorMessage:error.localizedDescription]); return; } [request setHTTPMethod:@"POST"]; [request setHTTPBody:jsonData]; } else { [request setHTTPMethod:@"GET"]; } NSLog(@"Requesting URL: %@", fullUrl); NSLog(@"Request Method: %@", method == HttpMethodPOST ? @"POST" : @"GET"); NSLog(@"Request Headers: %@", request.allHTTPHeaderFields); NSLog(@"Request Body: %@", body); NSURLSessionDataTask *task = [[NSURLSession sharedSession] dataTaskWithRequest:request completionHandler:^(NSData *data, NSURLResponse *response, NSError *error) { if (error) { completion([HttpResponse failureWithErrorMessage:error.localizedDescription]); return; } if (data) { NSError *jsonError; NSDictionary *jsonResponse = [NSJSONSerialization JSONObjectWithData:data options:0 error:&jsonError]; id status = jsonResponse[@"status"]; if (jsonError) { completion([HttpResponse failureWithErrorMessage:jsonError.localizedDescription]); } else if (![status isEqual:@"success"]){ completion([HttpResponse failureWithErrorMessage:[[NSString alloc]initWithFormat:@"%@,%@",fullUrl,status]]); } else { completion([HttpResponse successWithResponseBody:jsonResponse]); } } else { completion([HttpResponse failureWithErrorMessage:@"No data received"]); } }]; [task resume]; } - (NSString *)buildUrl:(NSString *)url params:(NSDictionary *)params { NSMutableString *urlString = [NSMutableString stringWithFormat:@"%@%@", HOST_URL, url]; if (params.count > 0) { [urlString appendString:@"?"]; NSMutableArray *queryItems = [NSMutableArray array]; for (NSString *key in params.allKeys) { NSString *value = params[key]; NSString *encodedKey = [self urlEncode:key]; NSString *encodedValue = [self urlEncode:value]; [queryItems addObject:[NSString stringWithFormat:@"%@=%@", encodedKey, encodedValue]]; } [urlString appendString:[queryItems componentsJoinedByString:@"&"]]; } return [urlString copy]; } - (NSString *)urlEncode:(NSString *)string { return [string stringByAddingPercentEncodingWithAllowedCharacters:[NSCharacterSet URLQueryAllowedCharacterSet]]; } + (instancetype)sharedInstance { static HttpService *sharedInstance = nil; static dispatch_once_t onceToken; dispatch_once(&onceToken, ^{ sharedInstance = [[self alloc] init]; }); return sharedInstance; } @end @interface LoadingIndicator () @property (strong, nonatomic) UIActivityIndicatorView *activityIndicator; @property (strong, nonatomic) UIView *overlayView; @end @implementation LoadingIndicator + (instancetype)sharedInstance { static LoadingIndicator *sharedInstance = nil; static dispatch_once_t onceToken; dispatch_once(&onceToken, ^{ sharedInstance = [[self alloc] init]; }); return sharedInstance; } - (void)showLoadingInView:(UIView *)view { if (!self.overlayView) { self.overlayView = [[UIView alloc] initWithFrame:view.bounds]; self.overlayView.backgroundColor = [UIColor colorWithWhite:0 alpha:0.3]; self.activityIndicator = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhite]; self.activityIndicator.center = self.overlayView.center; [self.overlayView addSubview:self.activityIndicator]; } [self.activityIndicator startAnimating]; [view addSubview:self.overlayView]; self.overlayView.alpha = 0.0; [UIView animateWithDuration:0.3 animations:^{ self.overlayView.alpha = 1.0; }]; } - (void)dismissLoading { [UIView animateWithDuration:0.3 animations:^{ self.overlayView.alpha = 0.0; } completion:^(BOOL finished) { [self.activityIndicator stopAnimating]; [self.overlayView removeFromSuperview]; self.overlayView = nil; self.activityIndicator = nil; }]; } @end @implementation PaymentMethodView - (instancetype)initWithIcon:(NSString *)icon title:(NSString *)title paymentMethodCode:(NSString *)paymentMethodCode currency:(NSString *)currency amount:(NSString*)amount { self = [super init]; if (self) { _icon = icon; _title = title; _paymentMethodCode = paymentMethodCode; _currency = currency; _amount = amount; } return self; } -(NSString*)formatAmount { return [[NSString alloc]initWithFormat:@"%@ %@",self.currency,self.amount]; } @end @implementation PaymentMethodViewCell -(void)awakeFromNib{ [super awakeFromNib]; self.selectionStyle = UITableViewCellSelectionStyleNone; if (@available(iOS 13.0, *)) { [_radioButton setImage:[UIImage systemImageNamed:@"circle"] forState:UIControlStateNormal]; [_radioButton setImage:[UIImage systemImageNamed:@"checkmark.circle"] forState:UIControlStateSelected]; } else { //TODO: custom image } } - (void)configureWithPaymentMethod:(PaymentMethodView *)paymentMethod selected:(BOOL)selected { _paymentMethod = paymentMethod; // Set the radio button state _radioButton.selected = selected; self.iconImage.image = [ImageBase64Converter base64ToImage:paymentMethod.icon]; self.title.text = [paymentMethod title]; } @end @implementation ImageBase64Converter + (NSString *)imageToBase64:(UIImage *)image { NSData *imageData = UIImagePNGRepresentation(image); if (!imageData) { return nil; } return [imageData base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength]; } + (UIImage *)base64ToImage:(NSString *)base64String { NSData *imageData = [[NSData alloc] initWithBase64EncodedString:base64String options:NSDataBase64DecodingIgnoreUnknownCharacters]; if (!imageData) { return nil; } return [UIImage imageWithData:imageData]; } @end @implementation ApplyTokenRequest + (instancetype)requestWithAuthCode:(NSString *)authCode authState:(NSString *)authState { ApplyTokenRequest *request = [[self alloc] init]; request.authCode = authCode; request.authState = authState; return request; } -(NSDictionary *)applyTokenParams{ return @{@"authCode":self.authCode,@"authState":self.authState}; } @end @implementation ApplyTokenResult - (instancetype)initWithData:(NSDictionary *)data paymentRequestId:(NSString *)paymentRequestId authState:(NSString *)authState status:(NSString *)status message:(NSString *)message { self = [super init]; if (self) { _data = data; _paymentRequestId = [paymentRequestId copy]; _authState = [authState copy]; _status = [status copy]; _message = [message copy]; } return self; } + (instancetype)parseFromJSON:(NSDictionary *)json { NSDictionary *data = json[@"data"]; NSString *paymentRequestId = json[@"paymentRequestId"]; NSString *authState = json[@"authState"]; NSString *status = json[@"status"]; NSString *message = json[@"message"]; return [[self alloc] initWithData:data paymentRequestId:paymentRequestId authState:authState status:status message:message]; } @end `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/Main.storyboard', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/Base.lproj/Main.storyboard', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/AppDelegate.h', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/AppDelegate.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// // AppDelegate.h // auto_debit_sdk_objc // // Created by ant on 2024/9/14. // #import @interface AppDelegate : UIResponder @property(nonatomic,strong) UIWindow *window; @end `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/File.swift', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/File.swift', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// // File.swift // auto_debit_sdk_objc // // Created by 伟龙 on 2024/11/25. // import Foundation `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/Common.h', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/Common.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` #import #import "UIKit/UIKit.h" NS_ASSUME_NONNULL_BEGIN @interface AlterUtils : NSObject + (void)showAlertWithMessage:(NSString *)message; @end @interface InquiryPaymentResult : NSObject @property (nonatomic, strong, readonly) NSDictionary *data; @property (nonatomic, copy, readonly) NSString *paymentRequestId; @property (nonatomic, copy, readonly) NSString *authState; @property (nonatomic, copy, readonly) NSString *status; @property (nonatomic, copy, readonly) NSString *message; - (instancetype)initWithData:(NSDictionary *)data paymentRequestId:(NSString *)paymentRequestId authState:(NSString *)authState status:(NSString *)status message:(NSString *)message; // 解析方法 + (instancetype)parseFromJSON:(NSDictionary *)json; @end @interface HttpResponse : NSObject @property (nonatomic, strong) NSDictionary *responseBody; @property (nonatomic, strong) NSString *errorMessage; + (instancetype)successWithResponseBody:(NSDictionary *)responseBody; + (instancetype)failureWithErrorMessage:(NSString *)errorMessage; @end typedef NS_ENUM(NSInteger, HttpMethod) { HttpMethodGET, HttpMethodPOST }; @interface HttpService : NSObject - (void)requestWithMethod:(HttpMethod)method urlpath:(NSString *)url body:(NSDictionary *)body requestParam:(NSDictionary *)params completion:(void (^)(HttpResponse *response))completion; + (instancetype)sharedInstance; @end @interface LoadingIndicator : NSObject + (instancetype)sharedInstance; - (void)showLoadingInView:(UIView *)view; - (void)dismissLoading; @end @interface PaymentMethodView : NSObject @property (nonatomic, copy) NSString *icon; @property (nonatomic, copy) NSString *title; @property (nonatomic, copy) NSString *paymentMethodCode; @property (nonatomic, copy) NSString *currency; @property (nonatomic, copy) NSString *amount; - (instancetype)initWithIcon:(NSString *)icon title:(NSString *)title paymentMethodCode:(NSString *)paymentMethodCode currency:(NSString *)currency amount:(NSString*)amount; -(NSString*)formatAmount; @end @class PaymentMethodView; @interface PaymentMethodViewCell : UITableViewCell @property (nonatomic, strong) PaymentMethodView *paymentMethod; @property (weak, nonatomic) IBOutlet UIButton *radioButton; @property (weak, nonatomic) IBOutlet UILabel *title; @property (weak, nonatomic) IBOutlet UIImageView *iconImage; - (void)configureWithPaymentMethod:(PaymentMethodView *)paymentMethod selected:(BOOL)selected; @end @interface ImageBase64Converter : NSObject + (NSString *)imageToBase64:(UIImage *)image; + (UIImage *)base64ToImage:(NSString *)base64String; @end @interface ApplyTokenRequest : NSObject @property(nonatomic,copy) NSString* authCode; @property(nonatomic,copy) NSString* authState; + (instancetype)requestWithAuthCode:(NSString *)authCode authState:(NSString *)authState; -(NSDictionary*)applyTokenParams; @end @interface ApplyTokenResult : NSObject @property (nonatomic, strong, readonly) NSDictionary *data; @property (nonatomic, copy, readonly) NSString *paymentRequestId; @property (nonatomic, copy, readonly) NSString *authState; @property (nonatomic, copy, readonly) NSString *status; @property (nonatomic, copy, readonly) NSString *message; - (instancetype)initWithData:(NSDictionary *)data paymentRequestId:(NSString *)paymentRequestId authState:(NSString *)authState status:(NSString *)status message:(NSString *)message; // 解析方法 + (instancetype)parseFromJSON:(NSDictionary *)json; @end NS_ASSUME_NONNULL_END `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/auto_debit_sdk_objc-Bridging-Header.h', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/auto_debit_sdk_objc-Bridging-Header.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// // Use this file to import your target's public headers that you would like to expose to Swift. // `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/PaymentMethodViewCell.xib', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/PaymentMethodViewCell.xib', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/Podfile', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/Podfile', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`# Uncomment the next line to define a global platform for your project # https://docs.antom.com/ac/sdks/ios "pod mode requires account secret configuration" source 'https://mirrors.tuna.tsinghua.edu.cn/git/CocoaPods/Specs.git' source 'https://globaltech.alipay.com/api/v1/file/common/5700989804217335/antom' platform :ios, '11.0' target 'auto_debit_sdk_objc' do use_frameworks! pod 'AMSComponent' pod 'AMSSecurity' end `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/Info.plist', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/Info.plist', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` CFBundleURLTypes CFBundleURLSchemes autodebitsdk NSAppTransportSecurity NSAllowsArbitraryLoads `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/objective-c/ViewController.h', when: { platform: 'iOS', client: 'Objective-C', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/ViewController.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`// // ViewController.h // auto_debit_sdk_objc // // Created by ant on 2024/9/14. // #import @interface ViewController : UIViewController @end `] }, `iOS-Objective-C-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/ViewController.swift', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `swift`, filename: 'client/ViewController.swift', downloadOnly: false, steps: [`build-the-autodebit-page`, `get-auth-continuation-link`, `handle-the-auth-redirection`], children: [_jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`// // ViewController.swift // auto_debit_api_swift // // Created by ant on 2024/9/14. // import UIKit`] }, `iOS-Swift-API-other1`), _jsx(AntomChunk, { language: `swift`, steps: [`build-the-autodebit-page`], chunks: [`class ViewController: UIViewController ,UITableViewDelegate,UITableViewDataSource{ @IBOutlet weak var titleLabel: UILabel! @IBOutlet weak var tipLabel: UILabel! @IBOutlet weak var btnCheckout: UIButton! lazy var tableView: UITableView = { let tableView = UITableView(frame: CGRect(x: 0, y: self.tipLabel.frame.maxY + 20, width: UIScreen.main.bounds.width, height: 300)) tableView.register(UINib(nibName: "SwiftPaymentMethodViewCell", bundle: nil), forCellReuseIdentifier: "SwiftPaymentMethodViewCell") tableView.delegate = self tableView.dataSource = self tableView.separatorStyle = .none return tableView }() lazy var paymentMethods:[SwiftPaymentMethodView] = { var methods:[SwiftPaymentMethodView] = []; methods = [ SwiftPaymentMethodView(icon: "iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAAAAXNSR0IArs4c6QAAAghJREFUaEPtl7tOAkEUhofEAi0M8QloaYwPoAYKY0+pvAmW8gKW1tpibSwg2lkZE0NLa4yGxEISC82/yUcOC+IwEZPdnWlgZ8/lv5xZ2JIr2CoVjK+LhPPueHQ4OpwzBeJI58zQGTrR4ehwzhQo7kiXe616zsycojNuXPS1MXG43Dv+OtjaXhnnm7fHldX2KTxuXCZcpwg/7567zbUNn/ylYq5e7t3R09lSOX8dHAlrpH0cPh123Um1OTHgdjRIvu9XalOm2H0cJsYnRzG2ZjqHa99JCHJYTTrDrrveaU/6HD50XLvanCFs9yEsofYqNad7WlzfjQZJDfZVX9/1CTHufdQvkj2JoT1f4gsJW2IUhRSNuZYAWsqZtyfQr5/vyRn+jXC6r+rZ+uojwuv9ViKGhNJSHLkSAkGsuAsJa2ztElCaiLCaKoaGKmxjAIkAPg6rBgv3fnIYgcHCNAkPwoMNLgsJixyjI/CMG6Oma5YKC6wFCWGESBMGjGoohhr2uFgSigO4cDF16ilMyqOO4hSjJR6shYQ5PzSypOyZ4eGF2wjBSCEWIy2AVizdtyOoOsSQC+D0+WbfPgfAy7jbSQ16aPk+EdNx//07XDjCTI0Vfq7DBftrWbCXh9DzmbW84r4PZ82pULzR4VDlspIXHc6KU6E4o8OhymUlLzqcFadCcUaHQ5XLSt43HjyvOMjtAswAAAAASUVORK5CYII=", title: "Rabbit Line Pay", paymentMethodCode: "RABBIT_LINE_PAY", currency: "THB", amount: "10000"), SwiftPaymentMethodView(icon: "iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAAAAXNSR0IArs4c6QAAApxJREFUaEPtV0tSGzEQbSUbuIvPgD0Lh8ppzAFc5aiKPXAT7xLsBcMdfBfYgOL+6TcDFqzQIG3Anpbc79OtHgPfbJlvhhca4Kkr3hRuCk+MgWbpiQk6gNMUbgpPjIFmaS/o2i3kf/3bw7Xpaxd8XOG1ewAABRpjtMfvqwaeAmZVESyuFNza/QGAjQDuMOBq/4Tf9bfL86+j/OwvC3X4PZpTDliV7WC7w40IUJeFwyUC9Gu1fyZy7pZnRECy6Id/bgC0NLAc3GNyRknMR2todu9IrCxXPSYADgpa2O7w+QZAkqRoM4fDLwKGQA0mfwxyYDZ3y7OUOALyQ5wSn4FnvnaefU4Oz2YyeGUxdNaCAOTqjakZA8bnmdIxYE7w2nRwgiVVFkEjYAPO3i7Pg/qze7b/4XJIhCZQFLN7CA7xGvVEvO73DhAiPYmxNQLJMWC2gqobJzvDH9blHq9uLryyq/2zGwGc2oqSM3M+QWx9gtQIENvTAzQK2JEzPHhxoAesBEju4s4ccA/bHVorqOPrjJLFurZlgCUZ3OYBSz0jmZRYFDPoAaLuGPFDhUPN5kRmThpaevvPSv2lhR8sZFc3c1ILlXVgsJ67pFOTIxzWXWbpyOpvxkjdjT3PSeJeIc01Vj5qWu8A1isp7tB4NXHDEnXRXtq0jmAR+GIIOG5aeL299lHHFoueiKE91Piy/RkwjmPQ3jklgBEXDxzauPTeVbN94lpS9rUTv9ikayYKjcQkjSma8sjSIzcB13rWPyRO3FY2eIQxk+9l7OQ8eNAl/6UGj7wXZJ/fGi1zdXUbTi+25pn6/bclHkZw8Zg22ZeHE7ao+XF7H65ZvZLcm8IlLNUc0xSuWb2S3JvCJSzVHNMUrlm9ktybwiUs1RzzH+qpoDj9yVmUAAAAAElFTkSuQmCC", title: "Gcash", paymentMethodCode: "GCASH", currency: "PHP", amount: "5500"), SwiftPaymentMethodView(icon: "iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAAAAXNSR0IArs4c6QAAAldJREFUaEPtV116wiAQBHsw9QLVnijNiaq9gHqwSr9ZGRwI+jX6VCQvKiHszs/uRu9e7PIvhtd1wK0r3hXuCjfGQLd0Y4JO4HSFu8KNMdAtnQn6tV25j93xaZH32890xmZ3/f70wfMPqCv8vTlkRwW3cs6P7tFk/wLY9oQhh/BEzBtcTAHvN8HA+bC0ZwgWv9/36/mcOudmAfbjNUYYnHfHh+NWks0Bk2UE+fFjZme1N76/hcHI4F4cjjUliY7AuWd3dAs4JYKwff6UXMPYm/01JzgNMc5+bbloXAskDuA9zbuylgNmAA1ak1RdgKQtdlgaSUaErNEVkzKJe0AEwNQAcw2ASZbFcpe+QsIRA+AW4ZDIwX2uCTFXwLSdWpcMKWiCgVJkngRgH1TVs0ACkmWJUAGqDoKQ8D3AEKAmhjoAsWcBVnBaq1p/SBqA+UnLWmCxJ4JzLZEVBlc6h6orYFVPbUtStXGqglYycxRmkvgs68DYiyolhaOat54DUSSGoMvGdxewP1ndcywCcNnAngackpQxlDUK7aAFYBIBBdQtWs9sVACSaj0qX7O0llLN0mmU+fHSFMMhI0XvR2dMx5JaMY0mNBhNLGZCeyVSpFmV1i9LQxtcqvuK7Qk6qSlNq5wIJIVj1UZq3s3rLx6qNGuKdW2B40GTepKxUwJCXG1mtdJhA6tNBj5vZRLHIXIq+0c5WqF6tUvfCvKf1stXYR1rsRe09eeBTTCV0/SVuC3AZcmUo9LK/8WuDrh1wbvCXeHGGOiWbkzQCZyucFe4MQa6pRsTdALnF36o6Dh7llC2AAAAAElFTkSuQmCC", title: "GRabpay Sg", paymentMethodCode: "GRABPAY_SG", currency: "SGD", amount: "380") ] return methods }() var selectedIndex: Int = -1 var selectMethod: SwiftPaymentMethodView? override func viewDidLoad() { super.viewDidLoad() setUpView() } private func updateCheckoutDisplay(_ method: SwiftPaymentMethodView?) { btnCheckout.isEnabled = method != nil btnCheckout.backgroundColor = method == nil ? UIColor.gray : UIColor.blue let title = method == nil ? "Pay" : "Pay \\(String(describing: method?.formatAmount()))" btnCheckout.setTitle(title, for: .normal) } private func setUpView() { view.addSubview(self.tableView) btnCheckout.addTarget(self, action: #selector(autodebitPayment), for: .touchUpInside) } // MARK: - UITableView DataSource Methods func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return self.paymentMethods.count } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "SwiftPaymentMethodViewCell") as? SwiftPaymentMethodViewCell let paymentMethod = self.paymentMethods[indexPath.row] let isSelected = indexPath.row == selectedIndex cell?.configure(with: paymentMethod, selected: isSelected) return cell! } func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat { return 100 } func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) { if selectedIndex != indexPath.row { selectedIndex = indexPath.row tableView.reloadData() selectMethod = paymentMethods[selectedIndex] } } private func dicWithPaymethod(_ paymethod: SwiftPaymentMethodView) -> [String: Any] { return [ "amountValue": paymethod.amount, "currency": paymethod.currency, "paymentMethodType": paymethod.paymentMethodCode, "terminalType": "APP", "osType": "IOS" ] } `] }, `iOS-Swift-API-code1`), _jsx(AntomChunk, { language: `swift`, steps: [`get-auth-continuation-link`], chunks: [` @objc func autodebitPayment() { guard let method = selectMethod else { AlterUtils.showAlertWithMessage( "Please choose your method") return } LoadingIndicator.sharedInstance.showLoading(in:self.view) HttpService.sharedInstance.request(method: HttpMethod.POST, urlPath: "/authorizations/consult", body: dicWithPaymethod(method), requestParam: nil) {[weak self] response in`, ' guard let `self` = self else {return}', ` DispatchQueue.main.async { LoadingIndicator.sharedInstance.dismissLoading() if let errorMessage = response.errorMessage { print("Antom --- Error: \\(errorMessage)") AlterUtils.showAlertWithMessage( errorMessage) } else { print("Antom --- Response: \\(response.responseBody ?? [:])") if let data = response.responseBody?["data"] as? [String: Any] { self.cashierRedirect(urlData: data) } } } } }`] }, `iOS-Swift-API-code2`), _jsx(AntomChunk, { language: `swift`, steps: [`handle-the-auth-redirection`], chunks: [` private func cashierRedirect(urlData: [String: Any]) { guard let schemeUrl = urlData["schemeUrl"] as? String, !schemeUrl.isEmpty else { handleFallback(urlData: urlData) return } schemeUrlRedirect(schemeUrl: schemeUrl, appLinkUrl: urlData["applinkUrl"] as? String, normalUrl: urlData["normalUrl"] as? String) } `] }, `iOS-Swift-API-code3`), _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` private func handleFallback(urlData: [String: Any]) { if let appLinkUrl = urlData["applinkUrl"] as? String, !appLinkUrl.isEmpty { appLinkUrlRedirect(appLinkUrl: appLinkUrl, normalUrl: urlData["normalUrl"] as? String) } else if let normalUrl = urlData["normalUrl"] as? String, !normalUrl.isEmpty { normalUrlRedirect(normalUrl: normalUrl) } else { AlterUtils.showAlertWithMessage( "No valid URL provided.") } } private func schemeUrlRedirect(schemeUrl: String, appLinkUrl: String?, normalUrl: String?) { if let url = URL(string: schemeUrl) { UIApplication.shared.open(url, options: [:], completionHandler: nil) } else { handleFallback(urlData: ["applinkUrl": appLinkUrl ?? "", "normalUrl": normalUrl ?? ""]) } } private func appLinkUrlRedirect(appLinkUrl: String, normalUrl: String?) { if let url = URL(string: appLinkUrl) { UIApplication.shared.open(url, options: [:], completionHandler: nil) } else { normalUrlRedirect(normalUrl: normalUrl) } } private func normalUrlRedirect(normalUrl: String?) { if let normalUrl = normalUrl, let url = URL(string: normalUrl) { UIApplication.shared.open(url, options: [:], completionHandler: nil) } else { AlterUtils.showAlertWithMessage( "Fail to redirect") } } } `] }, `iOS-Swift-API-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/AppDelegate.swift', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `swift`, filename: 'client/AppDelegate.swift', downloadOnly: false, steps: [`listen-for-callback-addresses`, `get-and-process-auth-info`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` import UIKit @main class AppDelegate: UIResponder, UIApplicationDelegate { var window: UIWindow!`] }, `iOS-Swift-API-other1`), _jsx(AntomChunk, { language: `swift`, steps: [`listen-for-callback-addresses`], chunks: [` func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool { // custom scheme logic print("----\\(url)") if url.scheme == "autodebitapiswift" { handlecashierUrl(url) } return true } `] }, `iOS-Swift-API-code1`), _jsx(AntomChunk, { language: `swift`, steps: [`get-and-process-auth-info`], chunks: [` func handlecashierUrl(_ url: URL) { var queryItemsDict = [String: String]() if let components = URLComponents(url: url, resolvingAgainstBaseURL: false) { for item in components.queryItems ?? [] { queryItemsDict[item.name] = item.value } } // get authCode and authState let authCode = queryItemsDict["authCode"] let authState = queryItemsDict["authState"] print("Auth Code: \\(authCode ?? "")") print("Auth State: \\(authState ?? "")") guard let authCode = authCode, let authState = authState else { AlterUtils.showAlertWithMessage("authCode or authState can not be nil") return } LoadingIndicator.sharedInstance.showLoading(in: self.window) let applyRequest = ApplyTokenRequest(authCode: authCode, authState: authState) HttpService.sharedInstance.request(method: HttpMethod.POST, urlPath: "/authorizations/applyTokenAndPay", body: applyRequest.applyTokenParams(), requestParam: nil) {[weak self] response in`, ' guard let `self` = self else {return}', ` DispatchQueue.main.async { LoadingIndicator.sharedInstance.dismissLoading() if let errorMessage = response.errorMessage { print("Antom --- Error: \\(errorMessage)") AlterUtils.showAlertWithMessage( errorMessage) } else { print("Antom --- Response: \\(response.responseBody ?? [:])") if let responseBody = response.responseBody { let applyresponse = ApplyTokenResult.parse(from: responseBody) if applyresponse?.paymentRequestId == nil { AlterUtils.showAlertWithMessage( "applyTokenAndPay paymentRequestId failedd") } else { if let resultCode = (applyresponse?.data?["result"] as? [String:Any])?["resultCode"] as? String { if resultCode == "SUCCESS"{ self.inquiryPaymentProcess(applyresponse?.paymentRequestId) } else { if let result = applyresponse?.data?["result"] as? [String:Any] , let resultMessage = result["resultMessage"] as? String { AlterUtils.showAlertWithMessage( resultMessage) } } } } } else { AlterUtils.showAlertWithMessage( "applyTokenAndPay error") } } } } } `] }, `iOS-Swift-API-code2`), _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` func inquiryPaymentDisplay(_ response: [String:Any]) { guard let inquiryPaymentResult = InquiryPaymentResult.parse(from: response) else { AlterUtils.showAlertWithMessage( "inquiryPaymentResult data is empty") return } if let result = inquiryPaymentResult.data?["result"] as? [String:Any] ,let resultCode = result["resultCode"] as? String { if resultCode == "SUCCESS" { AlterUtils.showAlertWithMessage( "Payment Success") } } } `] }, `iOS-Swift-API-other2`), _jsx(AntomChunk, { language: `swift`, steps: [`display-the-payment-result`], chunks: [` func inquiryPaymentProcess(_ paymentRequestId: String?) { guard let paymentRequestId = paymentRequestId else { AlterUtils.showAlertWithMessage("Empty paymentRequestId") return } LoadingIndicator.sharedInstance.showLoading(in: self.window) HttpService.sharedInstance.request(method: HttpMethod.POST, urlPath: "/payment/inquiryPayment", body: ["paymentRequestId": paymentRequestId], requestParam: nil) { response in DispatchQueue.main.async { LoadingIndicator.sharedInstance.dismissLoading() if let errorMessage = response.errorMessage { print("Antom --- Error: \\(errorMessage)") AlterUtils.showAlertWithMessage( errorMessage) } else { print("Antom --- Response: \\(String(describing: response.responseBody))") if let response = response.responseBody { self.inquiryPaymentDisplay(response) } else { AlterUtils.showAlertWithMessage( "inquiryPayment error") } } } } } `] }, `iOS-Swift-API-code3`), _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` } `] }, `iOS-Swift-API-other3`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/Common.swift', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/Common.swift', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`// // Common.swift // subscription_payment_swift // // Created by ant on 2024/11/13. // import Foundation import UIKit class LoadingIndicator { static let sharedInstance = LoadingIndicator() private var activityIndicator: UIActivityIndicatorView! private var overlayView: UIView! func showLoading(in view: UIView) { if overlayView == nil { overlayView = UIView(frame: view.bounds) overlayView.backgroundColor = UIColor(white: 0, alpha: 0.3) activityIndicator = UIActivityIndicatorView(style: .white) activityIndicator.center = overlayView.center overlayView.addSubview(activityIndicator) } activityIndicator.startAnimating() view.addSubview(overlayView) overlayView.alpha = 0.0 UIView.animate(withDuration: 0.3) { self.overlayView.alpha = 1.0 } } func dismissLoading() { UIView.animate(withDuration: 0.3, animations: { self.overlayView.alpha = 0.0 }) { _ in self.activityIndicator.stopAnimating() self.overlayView.removeFromSuperview() self.overlayView = nil self.activityIndicator = nil } } } class AlterUtils: NSObject { static func showAlertWithMessage(_ message: String) { let topViewController = self.topViewController() if let topVC = topViewController { let alertController = UIAlertController(title: "Tip", message: message, preferredStyle: .alert) let okAction = UIAlertAction(title: "Close", style: .default, handler: nil) alertController.addAction(okAction) topVC.present(alertController, animated: true, completion: nil) } } static func topViewController() -> UIViewController? { if let rootViewController = UIApplication.shared.keyWindow?.rootViewController { return topViewControllerFrom(rootViewController) } return nil } static func topViewControllerFrom(_ vc: UIViewController?) -> UIViewController? { if let presentedViewController = vc?.presentedViewController { return topViewControllerFrom(presentedViewController) } else if let navController = vc as? UINavigationController { return topViewControllerFrom(navController.visibleViewController) } else if let tabBarController = vc as? UITabBarController { return topViewControllerFrom(tabBarController.selectedViewController) } else { return vc } } } // HttpMethod Enum enum HttpMethod: String { case GET case POST } // HttpResponse Class class HttpResponse { var responseBody: [String: Any]? var errorMessage: String? static func success(with responseBody: [String: Any]) -> HttpResponse { let response = HttpResponse() response.responseBody = responseBody return response } static func failure(with errorMessage: String) -> HttpResponse { let response = HttpResponse() response.errorMessage = errorMessage return response } } // HttpService Singleton Class class HttpService { static let sharedInstance = HttpService() private let HOST_URL = "http://127.0.0.1:8080" private init() {} func request(method: HttpMethod, urlPath: String, body: [String: Any]?, requestParam: [String: Any]?, completion: @escaping (HttpResponse) -> Void) { let fullUrl = buildUrl(urlPath: urlPath, params: requestParam) guard let url = URL(string: fullUrl) else { completion(HttpResponse.failure(with: "Invalid URL")) return } var request = URLRequest(url: url) request.setValue("application/json", forHTTPHeaderField: "Content-Type") if method == .POST { guard let body = body else { completion(HttpResponse.failure(with: "Body is nil for POST request")) return } do { let jsonData = try JSONSerialization.data(withJSONObject: body, options: []) request.httpMethod = method.rawValue request.httpBody = jsonData } catch { completion(HttpResponse.failure(with: error.localizedDescription)) return } } else { request.httpMethod = method.rawValue } print("Requesting URL: \\(fullUrl)") print("Request Method: \\(method.rawValue)") print("Request Headers: \\(String(describing: request.allHTTPHeaderFields))") print("Request Body: \\(String(describing: body))") let task = URLSession.shared.dataTask(with: request) { data, response, error in if let error = error { completion(HttpResponse.failure(with: error.localizedDescription)) return } guard let data = data else { completion(HttpResponse.failure(with: "No data received")) return } do { if let jsonResponse = try JSONSerialization.jsonObject(with: data, options: []) as? [String: Any], let status = jsonResponse["status"] as? String, status == "success" { completion(HttpResponse.success(with: jsonResponse)) } else { completion(HttpResponse.failure(with: "Error or status not successful")) } } catch { completion(HttpResponse.failure(with: error.localizedDescription)) } } task.resume() } private func buildUrl(urlPath: String, params: [String: Any]?) -> String { var urlString = "\\(HOST_URL)\\(urlPath)" if let params = params, !params.isEmpty { urlString.append("?") let queryItems = params.map { key, value in "\\(urlEncode(key))=\\(urlEncode("\\(value)"))" } urlString.append(queryItems.joined(separator: "&")) } return urlString } private func urlEncode(_ string: String) -> String { return string.addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed) ?? string } } struct ImageBase64Converter { static func imageToBase64(image: UIImage) -> String? { guard let imageData = image.pngData() else { return nil } return imageData.base64EncodedString(options: .lineLength64Characters) } static func base64ToImage(base64String: String) -> UIImage? { guard let imageData = Data(base64Encoded: base64String) else { return nil } return UIImage(data: imageData) } } class SwiftPaymentMethodView: Codable { var icon: String var title: String var paymentMethodCode: String var currency: String var amount: String // Initializer init(icon: String, title: String, paymentMethodCode: String, currency: String, amount: String) { self.icon = icon self.title = title self.paymentMethodCode = paymentMethodCode self.currency = currency self.amount = amount } func formatAmount() -> String { return "\\(currency) \\(amount)" } } class SwiftPaymentMethodViewCell: UITableViewCell { @IBOutlet weak var radioButton: UIButton! @IBOutlet weak var titleLabel: UILabel! // Renamed for clarity @IBOutlet weak var iconImageView: UIImageView! override func awakeFromNib() { super.awakeFromNib() self.selectionStyle = .none if #available(iOS 13.0, *) { radioButton.setImage(UIImage.init(systemName: "circle"), for: .normal) radioButton.setImage(UIImage(systemName: "checkmark.circle"), for: .selected) } else { //TODO: custom image } } func configure(with paymentMethod: SwiftPaymentMethodView, selected: Bool) { self.paymentMethod = paymentMethod // Set the radio button state radioButton.isSelected = selected self.iconImageView.image = ImageBase64Converter.base64ToImage(base64String: paymentMethod.icon) self.titleLabel.text = paymentMethod.title } private var paymentMethod: SwiftPaymentMethodView! } class InquiryPaymentResult { var data: [String: Any]? var paymentRequestId: String? var authState: String? var status: String? var message: String? init(data: [String: Any], paymentRequestId: String, authState: String, status: String, message: String) { self.data = data self.paymentRequestId = paymentRequestId self.authState = authState self.status = status self.message = message } static func parse(from json: [String: Any]) -> InquiryPaymentResult? { guard let data = json["data"] as? [String: Any], let paymentRequestId = json["paymentRequestId"] as? String, let authState = json["authState"] as? String, let status = json["status"] as? String, let message = json["message"] as? String else { return nil } return InquiryPaymentResult(data: data, paymentRequestId: paymentRequestId, authState: authState, status: status, message: message) } } class ApplyTokenRequest { var authCode: String var authState: String init(authCode: String, authState: String) { self.authCode = authCode self.authState = authState } class func request(withAuthCode authCode: String, authState: String) -> ApplyTokenRequest { return ApplyTokenRequest(authCode: authCode, authState: authState) } func applyTokenParams() -> [String: String] { return ["authCode": authCode, "authState": authState] } } class ApplyTokenResult { var data: [String: Any]? var paymentRequestId: String? var authState: String? var status: String? var message: String? init(data: [String: Any], paymentRequestId: String, authState: String, status: String, message: String) { self.data = data self.paymentRequestId = paymentRequestId self.authState = authState self.status = status self.message = message } static func parse(from json: [String: Any]) -> ApplyTokenResult? { guard let data = json["data"] as? [String: Any], let paymentRequestId = json["paymentRequestId"] as? String, let authState = json["authState"] as? String, let status = json["status"] as? String, let message = json["message"] as? String else { return nil } return ApplyTokenResult(data: data, paymentRequestId: paymentRequestId, authState: authState, status: status, message: message) } } `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/Main.storyboard', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/Base.lproj/Main.storyboard', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/auto_debit_api_swift_bridge.h', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/auto_debit_api_swift_bridge.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/Info.plist', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/Info.plist', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` NSAppTransportSecurity NSAllowsArbitraryLoads CFBundleURLTypes CFBundleURLSchemes autodebitapiswift `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/SwiftPaymentMethodViewCell.xib', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/SwiftPaymentMethodViewCell.xib', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/ViewController.swift', when: { platform: 'iOS', client: 'Swift', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `swift`, filename: 'client/ViewController.swift', downloadOnly: false, steps: [`build-the-autodebit-page`, `initialize-instantiate-the-sdk`, `get-a-consult-session`, `invoke-the-sdk`], children: [_jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`// // ViewController.swift // auto_debit_sdk_swift // // Created by ant on 2024/9/14. // import UIKit import AMSComponent`] }, `iOS-Swift-SDK-other1`), _jsx(AntomChunk, { language: `swift`, steps: [`build-the-autodebit-page`], chunks: [`class ViewController: UIViewController ,UITableViewDelegate,UITableViewDataSource,AMSPaymentProtocol{ @IBOutlet weak var titleLabel: UILabel! @IBOutlet weak var tipLabel: UILabel! @IBOutlet weak var btnCheckout: UIButton! lazy var tableView: UITableView = { let tableView = UITableView(frame: CGRect(x: 0, y: self.tipLabel.frame.maxY + 20, width: UIScreen.main.bounds.width, height: 300)) tableView.register(UINib(nibName: "SwiftPaymentMethodViewCell", bundle: nil), forCellReuseIdentifier: "SwiftPaymentMethodViewCell") tableView.delegate = self tableView.dataSource = self tableView.separatorStyle = .none return tableView }() lazy var paymentMethods:[SwiftPaymentMethodView] = { var methods:[SwiftPaymentMethodView] = []; methods = [ SwiftPaymentMethodView(icon: "iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAAAAXNSR0IArs4c6QAAAghJREFUaEPtl7tOAkEUhofEAi0M8QloaYwPoAYKY0+pvAmW8gKW1tpibSwg2lkZE0NLa4yGxEISC82/yUcOC+IwEZPdnWlgZ8/lv5xZ2JIr2CoVjK+LhPPueHQ4OpwzBeJI58zQGTrR4ehwzhQo7kiXe616zsycojNuXPS1MXG43Dv+OtjaXhnnm7fHldX2KTxuXCZcpwg/7567zbUNn/ylYq5e7t3R09lSOX8dHAlrpH0cPh123Um1OTHgdjRIvu9XalOm2H0cJsYnRzG2ZjqHa99JCHJYTTrDrrveaU/6HD50XLvanCFs9yEsofYqNad7WlzfjQZJDfZVX9/1CTHufdQvkj2JoT1f4gsJW2IUhRSNuZYAWsqZtyfQr5/vyRn+jXC6r+rZ+uojwuv9ViKGhNJSHLkSAkGsuAsJa2ztElCaiLCaKoaGKmxjAIkAPg6rBgv3fnIYgcHCNAkPwoMNLgsJixyjI/CMG6Oma5YKC6wFCWGESBMGjGoohhr2uFgSigO4cDF16ilMyqOO4hSjJR6shYQ5PzSypOyZ4eGF2wjBSCEWIy2AVizdtyOoOsSQC+D0+WbfPgfAy7jbSQ16aPk+EdNx//07XDjCTI0Vfq7DBftrWbCXh9DzmbW84r4PZ82pULzR4VDlspIXHc6KU6E4o8OhymUlLzqcFadCcUaHQ5XLSt43HjyvOMjtAswAAAAASUVORK5CYII=", title: "Rabbit Line Pay", paymentMethodCode: "RABBIT_LINE_PAY", currency: "THB", amount: "10000"), SwiftPaymentMethodView(icon: "iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAAAAXNSR0IArs4c6QAAApxJREFUaEPtV0tSGzEQbSUbuIvPgD0Lh8ppzAFc5aiKPXAT7xLsBcMdfBfYgOL+6TcDFqzQIG3Anpbc79OtHgPfbJlvhhca4Kkr3hRuCk+MgWbpiQk6gNMUbgpPjIFmaS/o2i3kf/3bw7Xpaxd8XOG1ewAABRpjtMfvqwaeAmZVESyuFNza/QGAjQDuMOBq/4Tf9bfL86+j/OwvC3X4PZpTDliV7WC7w40IUJeFwyUC9Gu1fyZy7pZnRECy6Id/bgC0NLAc3GNyRknMR2todu9IrCxXPSYADgpa2O7w+QZAkqRoM4fDLwKGQA0mfwxyYDZ3y7OUOALyQ5wSn4FnvnaefU4Oz2YyeGUxdNaCAOTqjakZA8bnmdIxYE7w2nRwgiVVFkEjYAPO3i7Pg/qze7b/4XJIhCZQFLN7CA7xGvVEvO73DhAiPYmxNQLJMWC2gqobJzvDH9blHq9uLryyq/2zGwGc2oqSM3M+QWx9gtQIENvTAzQK2JEzPHhxoAesBEju4s4ccA/bHVorqOPrjJLFurZlgCUZ3OYBSz0jmZRYFDPoAaLuGPFDhUPN5kRmThpaevvPSv2lhR8sZFc3c1ILlXVgsJ67pFOTIxzWXWbpyOpvxkjdjT3PSeJeIc01Vj5qWu8A1isp7tB4NXHDEnXRXtq0jmAR+GIIOG5aeL299lHHFoueiKE91Piy/RkwjmPQ3jklgBEXDxzauPTeVbN94lpS9rUTv9ikayYKjcQkjSma8sjSIzcB13rWPyRO3FY2eIQxk+9l7OQ8eNAl/6UGj7wXZJ/fGi1zdXUbTi+25pn6/bclHkZw8Zg22ZeHE7ao+XF7H65ZvZLcm8IlLNUc0xSuWb2S3JvCJSzVHNMUrlm9ktybwiUs1RzzH+qpoDj9yVmUAAAAAElFTkSuQmCC", title: "Gcash", paymentMethodCode: "GCASH", currency: "PHP", amount: "5500"), SwiftPaymentMethodView(icon: "iVBORw0KGgoAAAANSUhEUgAAADwAAAAoCAYAAACiu5n/AAAAAXNSR0IArs4c6QAAAldJREFUaEPtV116wiAQBHsw9QLVnijNiaq9gHqwSr9ZGRwI+jX6VCQvKiHszs/uRu9e7PIvhtd1wK0r3hXuCjfGQLd0Y4JO4HSFu8KNMdAtnQn6tV25j93xaZH32890xmZ3/f70wfMPqCv8vTlkRwW3cs6P7tFk/wLY9oQhh/BEzBtcTAHvN8HA+bC0ZwgWv9/36/mcOudmAfbjNUYYnHfHh+NWks0Bk2UE+fFjZme1N76/hcHI4F4cjjUliY7AuWd3dAs4JYKwff6UXMPYm/01JzgNMc5+bbloXAskDuA9zbuylgNmAA1ak1RdgKQtdlgaSUaErNEVkzKJe0AEwNQAcw2ASZbFcpe+QsIRA+AW4ZDIwX2uCTFXwLSdWpcMKWiCgVJkngRgH1TVs0ACkmWJUAGqDoKQ8D3AEKAmhjoAsWcBVnBaq1p/SBqA+UnLWmCxJ4JzLZEVBlc6h6orYFVPbUtStXGqglYycxRmkvgs68DYiyolhaOat54DUSSGoMvGdxewP1ndcywCcNnAngackpQxlDUK7aAFYBIBBdQtWs9sVACSaj0qX7O0llLN0mmU+fHSFMMhI0XvR2dMx5JaMY0mNBhNLGZCeyVSpFmV1i9LQxtcqvuK7Qk6qSlNq5wIJIVj1UZq3s3rLx6qNGuKdW2B40GTepKxUwJCXG1mtdJhA6tNBj5vZRLHIXIq+0c5WqF6tUvfCvKf1stXYR1rsRe09eeBTTCV0/SVuC3AZcmUo9LK/8WuDrh1wbvCXeHGGOiWbkzQCZyucFe4MQa6pRsTdALnF36o6Dh7llC2AAAAAElFTkSuQmCC", title: "GRabpay Sg", paymentMethodCode: "GRABPAY_SG", currency: "SGD", amount: "380") ] return methods }() var selectedIndex: Int = -1 var selectMethod: SwiftPaymentMethodView? override func viewDidLoad() { super.viewDidLoad() initAMSAUtoDebit() setUpView() } private func updateCheckoutDisplay(_ method: SwiftPaymentMethodView?) { btnCheckout.isEnabled = method != nil btnCheckout.backgroundColor = method == nil ? UIColor.gray : UIColor.blue let title = method == nil ? "Pay" : "Pay \\(String(describing: method?.formatAmount()))" btnCheckout.setTitle(title, for: .normal) } private func setUpView() { view.addSubview(self.tableView) btnCheckout.addTarget(self, action: #selector(autodebitPayment), for: .touchUpInside) } // MARK: - UITableView DataSource Methods func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return self.paymentMethods.count } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "SwiftPaymentMethodViewCell") as? SwiftPaymentMethodViewCell let paymentMethod = self.paymentMethods[indexPath.row] let isSelected = indexPath.row == selectedIndex cell?.configure(with: paymentMethod, selected: isSelected) return cell! } func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat { return 100 } func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) { if selectedIndex != indexPath.row { selectedIndex = indexPath.row tableView.reloadData() selectMethod = paymentMethods[selectedIndex] } } private func dicWithPaymethod(_ paymethod: SwiftPaymentMethodView) -> [String: Any] { return [ "amountValue": paymethod.amount, "currency": paymethod.currency, "paymentMethodType": paymethod.paymentMethodCode, "terminalType": "APP", "osType": "IOS" ] } `] }, `iOS-Swift-SDK-code1`), _jsx(AntomChunk, { language: `swift`, steps: [`initialize-instantiate-the-sdk`], chunks: [` func initAMSAUtoDebit(){ let configuration = AMSAutoDebitConfiguration() configuration.options = ["sandbox": "true","showLoading":"true"] AMSAutoDebit.shared().initConfiguration(configuration) AMSAutoDebit.shared().paymentDelegate = self } `] }, `iOS-Swift-SDK-code2`), _jsx(AntomChunk, { language: `swift`, steps: [`get-a-consult-session`], chunks: [` @objc func autodebitPayment() { guard let method = selectMethod else { AlterUtils.showAlertWithMessage( "Please choose your method") return } LoadingIndicator.sharedInstance.showLoading(in:self.view) HttpService.sharedInstance.request(method: HttpMethod.POST, urlPath: "/authorizations/createConsultSession", body: dicWithPaymethod(method), requestParam: nil) {[weak self] response in`, ' guard let `self` = self else {return}', ` DispatchQueue.main.async { LoadingIndicator.sharedInstance.dismissLoading() if let errorMessage = response.errorMessage { print("Antom --- Error: \\(errorMessage)") AlterUtils.showAlertWithMessage( errorMessage) } else { print("Antom --- Response: \\(response.responseBody ?? [:])") if let data = response.responseBody?["data"] as? [String : Any], let sessionData = data["paymentSessionData"] as? String{ self.createAMSCheckout(sessionData: sessionData) } } } } } `] }, `iOS-Swift-SDK-code3`), _jsx(AntomChunk, { language: `swift`, steps: [`invoke-the-sdk`], chunks: [` func createAMSCheckout(sessionData: String) { AMSAutoDebit.shared().createComponent(sessionData) } `] }, `iOS-Swift-SDK-code4`), _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`} `] }, `iOS-Swift-SDK-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/AppDelegate.swift', when: { platform: 'iOS', client: 'Swift', integration_type: 'SDK' }, children: _jsxs(AntomFile, { language: `swift`, filename: 'client/AppDelegate.swift', downloadOnly: false, steps: [`listen-for-callback-addresses`, `get-and-process-auth-info`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` import UIKit @main class AppDelegate: UIResponder, UIApplicationDelegate { var window: UIWindow!`] }, `iOS-Swift-SDK-other1`), _jsx(AntomChunk, { language: `swift`, steps: [`listen-for-callback-addresses`], chunks: [` func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool { // custom scheme logic print("----\\(url)") if url.scheme == "autodebitsdk" { handlecashierUrl(url) } return true } `] }, `iOS-Swift-SDK-code1`), _jsx(AntomChunk, { language: `swift`, steps: [`get-and-process-auth-info`], chunks: [` func handlecashierUrl(_ url: URL) { var queryItemsDict = [String: String]() if let components = URLComponents(url: url, resolvingAgainstBaseURL: false) { for item in components.queryItems ?? [] { queryItemsDict[item.name] = item.value } } // get authCode and authState let authCode = queryItemsDict["authCode"] let authState = queryItemsDict["authState"] print("Auth Code: \\(authCode ?? "")") print("Auth State: \\(authState ?? "")") guard let authCode = authCode, let authState = authState else { AlterUtils.showAlertWithMessage("authCode or authState can not be nil") return } LoadingIndicator.sharedInstance.showLoading(in: self.window) let applyRequest = ApplyTokenRequest(authCode: authCode, authState: authState) HttpService.sharedInstance.request(method: HttpMethod.POST, urlPath: "/authorizations/applyTokenAndPay", body: applyRequest.applyTokenParams(), requestParam: nil) {[weak self] response in`, ' guard let `self` = self else {return}', ` DispatchQueue.main.async { LoadingIndicator.sharedInstance.dismissLoading() if let errorMessage = response.errorMessage { print("Antom --- Error: \\(errorMessage)") AlterUtils.showAlertWithMessage( errorMessage) } else { print("Antom --- Response: \\(response.responseBody ?? [:])") if let responseBody = response.responseBody as? [String: Any] { let applyresponse = ApplyTokenResult.parse(from: responseBody) if applyresponse?.paymentRequestId == nil { AlterUtils.showAlertWithMessage( "applyTokenAndPay paymentRequestId failedd") } else { if let resultCode = (applyresponse?.data?["result"] as? [String:Any])?["resultCode"] as? String { if resultCode == "SUCCESS" { self.inquiryPaymentProcess(applyresponse?.paymentRequestId) } else { if let result = applyresponse?.data?["result"] as? [String:Any] , let resultMessage = result["resultMessage"] as? String { AlterUtils.showAlertWithMessage( resultMessage) } } } } } else { AlterUtils.showAlertWithMessage( "applyTokenAndPay error") } } } } } `] }, `iOS-Swift-SDK-code2`), _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` func inquiryPaymentDisplay(_ response: [String:Any]) { guard let inquiryPaymentResult = InquiryPaymentResult.parse(from: response) else { AlterUtils.showAlertWithMessage( "inquiryPaymentResult data is empty") return } if let result = inquiryPaymentResult.data?["result"] as? [String:Any] ,let resultCode = result["resultCode"] as? String { if resultCode == "SUCCESS" { AlterUtils.showAlertWithMessage( "Payment Success") } } } `] }, `iOS-Swift-SDK-other2`), _jsx(AntomChunk, { language: `swift`, steps: [`display-the-payment-result`], chunks: [` func inquiryPaymentProcess(_ paymentRequestId: String?) { guard let paymentRequestId = paymentRequestId else { AlterUtils.showAlertWithMessage("paymentRequestId empty") return } LoadingIndicator.sharedInstance.showLoading(in: self.window) HttpService.sharedInstance.request(method: HttpMethod.POST, urlPath: "/payment/inquiryPayment", body: ["paymentRequestId": paymentRequestId], requestParam: nil) {[weak self] response in`, ' guard let `self` = self else{ return}', ` DispatchQueue.main.async { LoadingIndicator.sharedInstance.dismissLoading() if let errorMessage = response.errorMessage { print("Antom --- Error: \\(errorMessage)") AlterUtils.showAlertWithMessage( errorMessage) } else { print("Antom --- Response: \\(response.responseBody)") if let response = response.responseBody { self.inquiryPaymentDisplay(response) } else { AlterUtils.showAlertWithMessage( "inquiryPayment error") } } } } } `] }, `iOS-Swift-SDK-code3`), _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` } `] }, `iOS-Swift-SDK-other3`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/Common.swift', when: { platform: 'iOS', client: 'Swift', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/Common.swift', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`// // Common.swift // subscription_payment_swift // // Created by ant on 2024/11/13. // import Foundation import UIKit class LoadingIndicator { static let sharedInstance = LoadingIndicator() private var activityIndicator: UIActivityIndicatorView! private var overlayView: UIView! func showLoading(in view: UIView) { if overlayView == nil { overlayView = UIView(frame: view.bounds) overlayView.backgroundColor = UIColor(white: 0, alpha: 0.3) activityIndicator = UIActivityIndicatorView(style: .white) activityIndicator.center = overlayView.center overlayView.addSubview(activityIndicator) } activityIndicator.startAnimating() view.addSubview(overlayView) overlayView.alpha = 0.0 UIView.animate(withDuration: 0.3) { self.overlayView.alpha = 1.0 } } func dismissLoading() { UIView.animate(withDuration: 0.3, animations: { self.overlayView.alpha = 0.0 }) { _ in self.activityIndicator.stopAnimating() self.overlayView.removeFromSuperview() self.overlayView = nil self.activityIndicator = nil } } } class AlterUtils: NSObject { static func showAlertWithMessage(_ message: String) { let topViewController = self.topViewController() if let topVC = topViewController { let alertController = UIAlertController(title: "Tip", message: message, preferredStyle: .alert) let okAction = UIAlertAction(title: "Close", style: .default, handler: nil) alertController.addAction(okAction) topVC.present(alertController, animated: true, completion: nil) } } static func topViewController() -> UIViewController? { if let rootViewController = UIApplication.shared.keyWindow?.rootViewController { return topViewControllerFrom(rootViewController) } return nil } static func topViewControllerFrom(_ vc: UIViewController?) -> UIViewController? { if let presentedViewController = vc?.presentedViewController { return topViewControllerFrom(presentedViewController) } else if let navController = vc as? UINavigationController { return topViewControllerFrom(navController.visibleViewController) } else if let tabBarController = vc as? UITabBarController { return topViewControllerFrom(tabBarController.selectedViewController) } else { return vc } } } // HttpMethod Enum enum HttpMethod: String { case GET case POST } // HttpResponse Class class HttpResponse { var responseBody: [String: Any]? var errorMessage: String? static func success(with responseBody: [String: Any]) -> HttpResponse { let response = HttpResponse() response.responseBody = responseBody return response } static func failure(with errorMessage: String) -> HttpResponse { let response = HttpResponse() response.errorMessage = errorMessage return response } } // HttpService Singleton Class class HttpService { static let sharedInstance = HttpService() private let HOST_URL = "http://127.0.0.1:8080" private init() {} func request(method: HttpMethod, urlPath: String, body: [String: Any]?, requestParam: [String: Any]?, completion: @escaping (HttpResponse) -> Void) { let fullUrl = buildUrl(urlPath: urlPath, params: requestParam) guard let url = URL(string: fullUrl) else { completion(HttpResponse.failure(with: "Invalid URL")) return } var request = URLRequest(url: url) request.setValue("application/json", forHTTPHeaderField: "Content-Type") if method == .POST { guard let body = body else { completion(HttpResponse.failure(with: "Body is nil for POST request")) return } do { let jsonData = try JSONSerialization.data(withJSONObject: body, options: []) request.httpMethod = method.rawValue request.httpBody = jsonData } catch { completion(HttpResponse.failure(with: error.localizedDescription)) return } } else { request.httpMethod = method.rawValue } print("Requesting URL: \\(fullUrl)") print("Request Method: \\(method.rawValue)") print("Request Headers: \\(String(describing: request.allHTTPHeaderFields))") print("Request Body: \\(String(describing: body))") let task = URLSession.shared.dataTask(with: request) { data, response, error in if let error = error { completion(HttpResponse.failure(with: error.localizedDescription)) return } guard let data = data else { completion(HttpResponse.failure(with: "No data received")) return } do { if let jsonResponse = try JSONSerialization.jsonObject(with: data, options: []) as? [String: Any], let status = jsonResponse["status"] as? String, status == "success" { completion(HttpResponse.success(with: jsonResponse)) } else { completion(HttpResponse.failure(with: "Error or status not successful")) } } catch { completion(HttpResponse.failure(with: error.localizedDescription)) } } task.resume() } private func buildUrl(urlPath: String, params: [String: Any]?) -> String { var urlString = "\\(HOST_URL)\\(urlPath)" if let params = params, !params.isEmpty { urlString.append("?") let queryItems = params.map { key, value in "\\(urlEncode(key))=\\(urlEncode("\\(value)"))" } urlString.append(queryItems.joined(separator: "&")) } return urlString } private func urlEncode(_ string: String) -> String { return string.addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed) ?? string } } struct ImageBase64Converter { static func imageToBase64(image: UIImage) -> String? { guard let imageData = image.pngData() else { return nil } return imageData.base64EncodedString(options: .lineLength64Characters) } static func base64ToImage(base64String: String) -> UIImage? { guard let imageData = Data(base64Encoded: base64String) else { return nil } return UIImage(data: imageData) } } class SwiftPaymentMethodView: Codable { var icon: String var title: String var paymentMethodCode: String var currency: String var amount: String // Initializer init(icon: String, title: String, paymentMethodCode: String, currency: String, amount: String) { self.icon = icon self.title = title self.paymentMethodCode = paymentMethodCode self.currency = currency self.amount = amount } func formatAmount() -> String { return "\\(currency) \\(amount)" } } class SwiftPaymentMethodViewCell: UITableViewCell { @IBOutlet weak var radioButton: UIButton! @IBOutlet weak var titleLabel: UILabel! // Renamed for clarity @IBOutlet weak var iconImageView: UIImageView! override func awakeFromNib() { super.awakeFromNib() self.selectionStyle = .none if #available(iOS 13.0, *) { radioButton.setImage(UIImage.init(systemName: "circle"), for: .normal) radioButton.setImage(UIImage(systemName: "checkmark.circle"), for: .selected) } else { //TODO: custom image } } func configure(with paymentMethod: SwiftPaymentMethodView, selected: Bool) { self.paymentMethod = paymentMethod // Set the radio button state radioButton.isSelected = selected self.iconImageView.image = ImageBase64Converter.base64ToImage(base64String: paymentMethod.icon) self.titleLabel.text = paymentMethod.title } private var paymentMethod: SwiftPaymentMethodView! } class InquiryPaymentResult { var data: [String: Any]? var paymentRequestId: String? var authState: String? var status: String? var message: String? init(data: [String: Any], paymentRequestId: String, authState: String, status: String, message: String) { self.data = data self.paymentRequestId = paymentRequestId self.authState = authState self.status = status self.message = message } static func parse(from json: [String: Any]) -> InquiryPaymentResult? { guard let data = json["data"] as? [String: Any], let paymentRequestId = json["paymentRequestId"] as? String, let authState = json["authState"] as? String, let status = json["status"] as? String, let message = json["message"] as? String else { return nil } return InquiryPaymentResult(data: data, paymentRequestId: paymentRequestId, authState: authState, status: status, message: message) } } class ApplyTokenRequest { var authCode: String var authState: String init(authCode: String, authState: String) { self.authCode = authCode self.authState = authState } class func request(withAuthCode authCode: String, authState: String) -> ApplyTokenRequest { return ApplyTokenRequest(authCode: authCode, authState: authState) } func applyTokenParams() -> [String: String] { return ["authCode": authCode, "authState": authState] } } class ApplyTokenResult { var data: [String: Any]? var paymentRequestId: String? var authState: String? var status: String? var message: String? init(data: [String: Any], paymentRequestId: String, authState: String, status: String, message: String) { self.data = data self.paymentRequestId = paymentRequestId self.authState = authState self.status = status self.message = message } static func parse(from json: [String: Any]) -> ApplyTokenResult? { guard let data = json["data"] as? [String: Any], let paymentRequestId = json["paymentRequestId"] as? String, let authState = json["authState"] as? String, let status = json["status"] as? String, let message = json["message"] as? String else { return nil } return ApplyTokenResult(data: data, paymentRequestId: paymentRequestId, authState: authState, status: status, message: message) } } `] }, `iOS-Swift-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/Main.storyboard', when: { platform: 'iOS', client: 'Swift', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/Base.lproj/Main.storyboard', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` `] }, `iOS-Swift-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/auto_debit_sdk_swift_bridge.h', when: { platform: 'iOS', client: 'Swift', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/auto_debit_sdk_swift_bridge.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` `] }, `iOS-Swift-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/Podfile', when: { platform: 'iOS', client: 'Swift', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/Podfile', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`# Uncomment the next line to define a global platform for your project # https://docs.antom.com/ac/sdks/ios "pod mode requires account secret configuration" source 'https://mirrors.tuna.tsinghua.edu.cn/git/CocoaPods/Specs.git' source 'https://globaltech.alipay.com/api/v1/file/common/5700989804217335/antom' platform :ios, '11.0' #Swift target 'auto_debit_sdk_swift' do # Comment the next line if you don't want to use dynamic frameworks use_frameworks! pod 'AMSComponent' pod 'AMSSecurity' # Pods for cashierpayment_sdk_objc end `] }, `iOS-Swift-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/Info.plist', when: { platform: 'iOS', client: 'Swift', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/Info.plist', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` NSAppTransportSecurity NSAllowsArbitraryLoads CFBundleURLTypes CFBundleURLSchemes autodebitsdk `] }, `iOS-Swift-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/autodebit/files/ios/swift/SwiftPaymentMethodViewCell.xib', when: { platform: 'iOS', client: 'Swift', integration_type: 'SDK' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/SwiftPaymentMethodViewCell.xib', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` `] }, `iOS-Swift-SDK-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/web/html/README.md', when: { platform: 'Web', client: 'HTML', server: 'PHP' }, children: _jsx(AntomFile, { language: `txt`, filename: 'client/README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# Project Title antom-online-payments-demo-using-cdn-sdk ## Getting Started This demo project showcases how Antom payment works. For more detailed information, visit the [Antom Documentation](https://global.alipay.com/docs/). Follow these steps to set up and run the project: `, '### 1. Install `http-server`', ` `, "To serve your site, you'll need to install `http-server`, a simple, zero-configuration command-line static HTTP server. You can install it globally using npm (Node Package Manager).", ` Open your terminal and run the following command: `, '``` bash', `npm install -g http-server`, '```', ` ### 2. Start the Client `, '``` bash', `http-server -p 5173 -a localhost`, '```', ` `] }, `Web-HTML-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/web/html/README.md', when: { platform: 'Web', client: 'HTML', server: 'Python' }, children: _jsx(AntomFile, { language: `txt`, filename: 'client/README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# Project Title antom-online-payments-demo-using-cdn-sdk ## Getting Started This demo project showcases how Antom payment works. For more detailed information, visit the [Antom Documentation](https://global.alipay.com/docs/). Follow these steps to set up and run the project: `, '### 1. Install `http-server`', ` `, "To serve your site, you'll need to install `http-server`, a simple, zero-configuration command-line static HTTP server. You can install it globally using npm (Node Package Manager).", ` Open your terminal and run the following command: `, '``` bash', `npm install -g http-server`, '```', ` ### 2. Start the Client `, '``` bash', `http-server -p 5173 -a localhost`, '```', ` `] }, `Web-HTML-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/web/html/README.md', when: { platform: 'Web', client: 'HTML', server: 'Go' }, children: _jsx(AntomFile, { language: `txt`, filename: 'client/README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# Project Title antom-online-payments-demo-using-cdn-sdk ## Getting Started This demo project showcases how Antom payment works. For more detailed information, visit the [Antom Documentation](https://global.alipay.com/docs/). Follow these steps to set up and run the project: `, '### 1. Install `http-server`', ` `, "To serve your site, you'll need to install `http-server`, a simple, zero-configuration command-line static HTTP server. You can install it globally using npm (Node Package Manager).", ` Open your terminal and run the following command: `, '``` bash', `npm install -g http-server`, '```', ` ### 2. Start the Client `, '``` bash', `http-server -p 5173 -a localhost`, '```', ` `] }, `Web-HTML-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/android/java/README.md', when: { platform: 'Android' }, children: _jsx(AntomFile, { language: `txt`, filename: 'client/README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# Directory demo description auto_debit //Signing withholding payment /api /sdk cashier_payment //Cashier payment /api /sdk easy_safe_pay //easypay subscription //subscription payment # Running conditions ## 1. Run the server code locally Select target and use cashier_payment_java api as an example. antom-online-payment-sample-java/src/main/java/com/antom/checkout/api/PaymentServer.java ## 2. Change the service callback address`, '`alipayPayRequest.setPaymentRedirectUrl(', '"cashierapi://app/receivePayment?paymentRequestId=" + paymentRequestId);`', ` ## 3. Config merchant info antom-online-payment-sample-java/src/main/java/com/antom/checkout/api/PaymentServer.java // public static final String CLIENT_ID = ""; // public static final String ANTOM_PUBLIC_KEY = ""; // public static final String MERCHANT_PRIVATE_KEY = ""; ## 4. Change the client joint debugging address HttpServer.java private static final String HOST_URL = "http://10.0.2.2:8080"; //Local IP or server address ## 5. Select the payment method to perform a payment test. ## tips: SDK integration requires first configuring the Podfile https://docs.antom.com/ac/sdks/android "pod mode requires account secret configuration" `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/android/kotlin/README.md', when: { platform: 'Android' }, children: _jsx(AntomFile, { language: `txt`, filename: 'client/README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# Directory demo description auto_debit //Signing withholding payment /api /sdk cashier_payment //Cashier payment /api /sdk easy_safe_pay //easypay subscription //subscription payment # Running conditions ## 1. Run the server code locally Select target and use cashier_payment_java api as an example. antom-online-payment-sample-java/src/main/java/com/antom/checkout/api/PaymentServer.java ## 2. Change the service callback address`, '`alipayPayRequest.setPaymentRedirectUrl(', '"cashierapi://app/receivePayment?paymentRequestId=" + paymentRequestId);`', ` ## 3. Config merchant info antom-online-payment-sample-java/src/main/java/com/antom/checkout/api/PaymentServer.java // public static final String CLIENT_ID = ""; // public static final String ANTOM_PUBLIC_KEY = ""; // public static final String MERCHANT_PRIVATE_KEY = ""; ## 4. Change the client joint debugging address HttpServer.java private static final String HOST_URL = "http://10.0.2.2:8080"; //Local IP or server address ## 5. Select the payment method to perform a payment test. ## tips: SDK integration requires first configuring the Podfile https://docs.antom.com/ac/sdks/android "pod mode requires account secret configuration" `] }, `Android-Kotlin-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/ios/objective-c/README.md', when: { platform: 'iOS' }, children: _jsx(AntomFile, { language: `txt`, filename: 'client/README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# Directory demo description auto_debit_sdk_objc auto_debit_api_objc //Signing withholding payment cashierpayment_api_objc cashierpayment_sdk_objc //Cashier payment easypay_objc //easypay subscription_payment_objc //subscription payment # Running conditions ## 1. Run the server code locally Select target and use cashier_payment_java api as an example. antom-online-payment-sample-java/src/main/java/com/antom/checkout/api/PaymentServer.java ## 2. Change the service callback address`, '`alipayPayRequest.setPaymentRedirectUrl(', '"cashierpaymentapi://app/receivePayment?paymentRequestId=" + paymentRequestId);`', `## 3. Config merchant info antom-online-payment-sample-java/src/main/java/com/antom/checkout/api/PaymentServer.java // public static final String CLIENT_ID = ""; // public static final String ANTOM_PUBLIC_KEY = ""; // public static final String MERCHANT_PRIVATE_KEY = ""; ## 4. Change the client joint debugging address HttpServer.m static NSString * const HOST_URL = @"http://127.0.0.1:8080"; //Local IP or server address ## 5. Select the payment method to perform a payment test. ## tips: SDK integration requires first configuring the Podfile https://docs.antom.com/ac/sdks/ios "pod mode requires account secret configuration" `] }, `iOS-Objective-C-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/ios/swift/README.md', when: { platform: 'iOS' }, children: _jsx(AntomFile, { language: `txt`, filename: 'client/README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# Directory demo description auto_debit_sdk_objc auto_debit_api_objc //Signing withholding payment cashierpayment_api_objc cashierpayment_sdk_objc //Cashier payment easypay_objc //easypay subscription_payment_objc //subscription payment # Running conditions ## 1. Run the server code locally Select target and use cashier_payment_java api as an example. antom-online-payment-sample-java/src/main/java/com/antom/checkout/api/PaymentServer.java ## 2. Change the service callback address`, '`alipayPayRequest.setPaymentRedirectUrl(', '"cashierpaymentapi://app/receivePayment?paymentRequestId=" + paymentRequestId);`', `## 3. Config merchant info antom-online-payment-sample-java/src/main/java/com/antom/checkout/api/PaymentServer.java // public static final String CLIENT_ID = ""; // public static final String ANTOM_PUBLIC_KEY = ""; // public static final String MERCHANT_PRIVATE_KEY = ""; ## 4. Change the client joint debugging address HttpServer.m static NSString * const HOST_URL = @"http://127.0.0.1:8080"; //Local IP or server address ## 5. Select the payment method to perform a payment test. ## tips: SDK integration requires first configuring the Podfile https://docs.antom.com/ac/sdks/ios "pod mode requires account secret configuration" `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/python/README.md', when: { server: 'Python' }, children: _jsx(AntomFile, { language: `txt`, filename: 'README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# antom-online-payments-demo ## Getting Started This is a demo project to show how Antom payment works. For more detailed information, please visit [Antom Docs](https://docs.antom.com/) ## Requirements - Python 3.9 or later ## Config **Please make sure to replace the following parameters with your own to ensure correct integration.** Replace the following parameters in [server.py]()`, '- `CLIENT_ID`: Client ID', '- `ANTOM_PUBLIC_KEY`: Antom Public Key', "- `MERCHANT_PRIVATE_KEY`: Your Private Key (Antom won't save your private key, so you can't see it on dashboard, please refer [API key configuration](https://docs.antom.com/ac/ref/key_config))", ` `, 'You can find `CLIENT_ID` and `ANTOM_PUBLIC_KEY` on [Antom Dashboard](https://dashboard.antom.com/global-payments/developers/quickStart)', ` Follow the information below to configure the callback address information in server.py to ensure that the program works correctly. | platforms | product | integration types | redirectUrl | |-------------|----------------------|-------------------|------------------------------------------------------------------------------------------------------------| | Web | checkout payment | API/SDK/CKP | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "http://localhost:5173/receiveAuthCode.html" | | | | SDK | authRedirectUrl: "http://localhost:5173/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "http://localhost:5173/index.html?subscriptionRequestId=" + subscriptionRequestId | | Android/iOS | checkout payment | API | paymentRedirectUrl: "cashierapi://app?paymentRequestId=" + paymentRequestId | | | | SDK | paymentRedirectUrl: "cashiersdk://app?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "autodebitapi://app/receiveAuthCode" | | | | SDK | authRedirectUrl: "autodebitsdk://app/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "easysafepay://app?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "subscription://app?subscriptionRequestId=" + subscriptionRequestId | ## Run You can run this demo in this way: 1. Build the server ~~~ pip3 install -r requirements.txt ~~~ 2. Run the server ~~~ export FLASK_APP=server.py python3 -m flask run --port=8080 ~~~ `] }, `server-Python-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/python/requirements.txt', when: { server: 'Python' }, children: _jsx(AntomFile, { language: `txt`, filename: 'requirements.txt', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`flask==3.1.0 global-open-sdk-python==1.4.3 real-money==0.1.0 Flask-Cors==4.0.0 `] }, `server-Python-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/java/README.md', when: { server: 'Java' }, children: _jsx(AntomFile, { language: `txt`, filename: 'README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# antom-online-payments-demo ## Getting Started This is a demo project to show how Antom payment works. For more detailed information, please visit [Antom Docs](https://docs.antom.com/) ## Requirements - Java 1.8 or later ## Config **Please make sure to replace the following parameters with your own to ensure correct integration.** Replace the following parameters in [PaymentServer.java]()`, '- `CLIENT_ID`: Client ID', '- `ANTOM_PUBLIC_KEY`: Antom Public Key', "- `MERCHANT_PRIVATE_KEY`: Your Private Key (Antom won't save your private key, so you can't see it on dashboard, please refer [API key configuration](https://docs.antom.com/ac/ref/key_config))", ` `, 'You can find `CLIENT_ID` and `ANTOM_PUBLIC_KEY` on [Antom Dashboard](https://dashboard.antom.com/global-payments/developers/quickStart)', ` Follow the information below to configure the callback address information in PaymentServer.java to ensure that the program works correctly. | platforms | product | integration types | redirectUrl | |----------------|----------------------|-------------------|------------------------------------------------------------------------------------------------------------| | Web(React/Vue) | checkout payment | API/SDK/CKP | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "http://localhost:5173/receiveAuthCode.html" | | | | SDK | authRedirectUrl: "http://localhost:5173/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "http://localhost:5173/index.html?subscriptionRequestId=" + subscriptionRequestId | | Android/iOS | checkout payment | API | paymentRedirectUrl: "cashierapi://app?paymentRequestId=" + paymentRequestId | | | | SDK | paymentRedirectUrl: "cashiersdk://app?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "autodebitapi://app/receiveAuthCode" | | | | SDK | authRedirectUrl: "autodebitsdk://app/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "easysafepay://app?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "subscription://app?subscriptionRequestId=" + subscriptionRequestId | ## Run You can run this demo in two ways: ### Start Locally Start application by running [PaymentServer.java]() After start, visit demo page in browser：[http://localhost:8080](http://localhost:8080) ### Package & Run 1. package project `, ' ``` shell', ` mvn clean package`, ' ```', ` 2. run server `, ' ``` shell', ` java -jar ./target/antom-sample-code-0.0.1.jar`, ' ```', ` `] }, `server-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/java/pom.xml', when: { server: 'Java' }, children: _jsx(AntomFile, { language: `txt`, filename: 'pom.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [` 4.0.0 org.springframework.boot spring-boot-starter-parent 2.7.6 com.antom.global.payment antom-sample-code 0.0.1 antom Demo project for antom payment demo 1.8 org.springframework.boot spring-boot-starter org.springframework.boot spring-boot-starter-web org.joda joda-money 1.0.4 com.alipay.global.sdk global-open-sdk-java 2.0.61 com.alibaba fastjson 1.2.83 org.projectlombok lombok 1.18.30 provided javax.xml.bind jaxb-api 2.3.0 org.springframework.boot spring-boot-maven-plugin `] }, `server-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/php/README.md', when: { server: 'PHP' }, children: _jsx(AntomFile, { language: `txt`, filename: 'README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# antom-online-payments-demo ## Getting Started This is a demo project to show how Antom payment works. For more detailed information, please visit [Antom Docs](https://docs.antom.com/) ## Requirements - PHP 5.6 or later ## Config **Please make sure to replace the following parameters with your own to ensure correct integration.** Replace the following parameters in [server.php]()`, '- `CLIENT_ID`: Client ID', '- `ANTOM_PUBLIC_KEY`: Antom Public Key', "- `MERCHANT_PRIVATE_KEY`: Your Private Key (Antom won't save your private key, so you can't see it on dashboard, please refer [API key configuration](https://docs.antom.com/ac/ref/key_config))", ` `, 'You can find `CLIENT_ID` and `ANTOM_PUBLIC_KEY` on [Antom Dashboard](https://dashboard.antom.com/global-payments/developers/quickStart)', ` Follow the information below to configure the callback address information in server.php to ensure that the program works correctly. | platforms | product | integration types | redirectUrl | |-------------|----------------------|-------------------|------------------------------------------------------------------------------------------------------------| | Web | checkout payment | API/SDK/CKP | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "http://localhost:5173/receiveAuthCode.html" | | | | SDK | authRedirectUrl: "http://localhost:5173/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "http://localhost:5173/index.html?subscriptionRequestId=" + subscriptionRequestId | | Android/iOS | checkout payment | API | paymentRedirectUrl: "cashierapi://app?paymentRequestId=" + paymentRequestId | | | | SDK | paymentRedirectUrl: "cashiersdk://app?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "autodebitapi://app/receiveAuthCode" | | | | SDK | authRedirectUrl: "autodebitsdk://app/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "easysafepay://app?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "subscription://app?subscriptionRequestId=" + subscriptionRequestId | ## Run You can run this demo in this way: 1. Build the server ~~~ composer install ~~~ 2. Run the server ~~~ php -S 127.0.0.1:8080 server.php ~~~ `] }, `server-PHP-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/php/composer.json', when: { server: 'PHP' }, children: _jsx(AntomFile, { language: `txt`, filename: 'composer.json', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`{ "require": { "antom/global-open-sdk-php": "1.4.2", "moneyphp/money": "^3.3", "slim/slim": "2.6.3", "ext-json": "*" }, "config": { "allow-plugins": { "kylekatarnls/update-helper": true } } } `] }, `server-PHP-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/go/README.md', when: { server: 'Go' }, children: _jsx(AntomFile, { language: `txt`, filename: 'README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# antom-online-payments-demo ## Getting Started This is a demo project to show how Antom payment works. For more detailed information, please visit [Antom Docs](https://docs.antom.com/) ## Requirements - Go 1.22.5 or later ## Config **Please make sure to replace the following parameters with your own to ensure correct integration.** Replace the following parameters in [server.go]()`, '- `CLIENT_ID`: Client ID', '- `ANTOM_PUBLIC_KEY`: Antom Public Key', "- `MERCHANT_PRIVATE_KEY`: Your Private Key (Antom won't save your private key, so you can't see it on dashboard, please refer [API key configuration](https://docs.antom.com/ac/ref/key_config))", ` `, 'You can find `CLIENT_ID` and `ANTOM_PUBLIC_KEY` on [Antom Dashboard](https://dashboard.antom.com/global-payments/developers/quickStart)', ` Follow the information below to configure the callback address information in server.go to ensure that the program works correctly. | platforms | product | integration types | redirectUrl | |-------------|----------------------|-------------------|------------------------------------------------------------------------------------------------------------| | Web | checkout payment | API/SDK/CKP | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "http://localhost:5173/receiveAuthCode.html" | | | | SDK | authRedirectUrl: "http://localhost:5173/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "http://localhost:5173/index.html?subscriptionRequestId=" + subscriptionRequestId | | Android/iOS | checkout payment | API | paymentRedirectUrl: "cashierapi://app?paymentRequestId=" + paymentRequestId | | | | SDK | paymentRedirectUrl: "cashiersdk://app?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "autodebitapi://app/receiveAuthCode" | | | | SDK | authRedirectUrl: "autodebitsdk://app/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "easysafepay://app?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "subscription://app?subscriptionRequestId=" + subscriptionRequestId | ## Run You can run this demo in this way: 1. Run the server ~~~ go run server.go ~~~ `] }, `server-Go-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/go/go.mod', when: { server: 'Go' }, children: _jsx(AntomFile, { language: `txt`, filename: 'go.mod', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`module antom-online-payment-sample-go go 1.22.5 require ( github.com/Rhymond/go-money v1.0.14 github.com/alipay/global-open-sdk-go v1.2.10 github.com/google/uuid v1.6.0 ) `] }, `server-Go-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/.net/README.md', when: { server: '.NET' }, children: _jsx(AntomFile, { language: `txt`, filename: 'README.md', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [`# antom-online-payments-demo ## Getting Started This is a demo project to show how Antom payment works. For more detailed information, please visit [Antom Docs](https://docs.antom.com/) ## Requirements - .NET 8.0 or later ## Config **Please make sure to replace the following parameters with your own to ensure correct integration.** Replace the following parameters in [server.cs]()`, '- `CLIENT_ID`: Client ID', '- `ANTOM_PUBLIC_KEY`: Antom Public Key', "- `MERCHANT_PRIVATE_KEY`: Your Private Key (Antom won't save your private key, so you can't see it on dashboard, please refer [API key configuration](https://docs.antom.com/ac/ref/key_config))", ` `, 'You can find `CLIENT_ID` and `ANTOM_PUBLIC_KEY` on [Antom Dashboard](https://dashboard.antom.com/global-payments/developers/quickStart)', ` Follow the information below to configure the callback address information in server.cs to ensure that the program works correctly. | platforms | product | integration types | redirectUrl | |----------------|----------------------|------------------|------------------------------------------------------------------------------------------------------------| | Web(React/Vue) | checkout payment | API/SDK/CKP | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "http://localhost:5173/receiveAuthCode.html" | | | | SDK | authRedirectUrl: "http://localhost:5173/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "http://localhost:5173/index.html?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "http://localhost:5173/index.html?subscriptionRequestId=" + subscriptionRequestId | | Android/iOS | checkout payment | API | paymentRedirectUrl: "cashierapi://app?paymentRequestId=" + paymentRequestId | | | | SDK | paymentRedirectUrl: "cashiersdk://app?paymentRequestId=" + paymentRequestId | | | auto debit | API | authRedirectUrl: "autodebitapi://app/receiveAuthCode" | | | | SDK | authRedirectUrl: "autodebitsdk://app/receiveAuthCode" | | | easysafepay | SDK | paymentRedirectUrl: "easysafepay://app?paymentRequestId=" + paymentRequestId | | | subscription payment | API | subscriptionRedirectUrl: "subscription://app?subscriptionRequestId=" + subscriptionRequestId | ## Run You can run this demo in this way: 1. Build the server ~~~ dotnet restore ~~~ 2. Run the server ~~~ dotnet run ~~~ `] }, `server-.NET-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/antom/files/server/.net/antom-online-payment-sample-dotnet.csproj', when: { server: '.NET' }, children: _jsx(AntomFile, { language: `txt`, filename: 'antom-online-payment-sample-dotnet.csproj', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `txt`, steps: [``], chunks: [` net8.0 enable enable antom_online_payment_sample_dotnet `] }, `server-.NET-API-other1`) }) })] }) }) }); } function MDXContent(props = {}) { const {wrapper: MDXLayout} = props.components || ({}); return MDXLayout ? _jsx(MDXLayout, { ...props, children: _jsx(_createMdxContent, { ...props }) }) : _createMdxContent(props); } return { default: MDXContent }; function _missingMdxReference(id, component) { throw new Error("Expected " + (component ? "component" : "object") + " `" + id + "` to be defined: you likely forgot to import, pass, or provide it."); }

Quick start

Obtain the authorization result