Subscription Payment Demo

"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, Link, MdxDocument, Paragraph, 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 (!Link) _missingMdxReference("Link", true); if (!MdxDocument) _missingMdxReference("MdxDocument", true); if (!Paragraph) _missingMdxReference("Paragraph", 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: { platform: 'Web' }, value: ['HTML', 'Vue', 'React'] }, { 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-subscription-payment-sample.zip', children: [_jsxs(AntomCondition, { when: { integration_type: 'API' }, children: [_jsx(Paragraph, { children: _jsx(_components.p, { children: "使用 Antom 的支付功能创建流畅的订阅流程。Antom 为仅接口集成提供客户端和服务器端的示例代码，帮助您轻松构建支持多种场景的订阅体验。" }) }), _jsx(AntomDownloadBtn, {})] }), _jsx(AntomStepSection, { number: 1, title: '设置服务器' }), _jsxs(AntomStep, { id: 'install-antom-library', when: { server: 'Java' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `install-antom-library`, children: _jsx(_components.p, { children: "安装 Antom Java 库" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsx(_components.p, { children: "要导入 Antom 的 Java 库，请将依赖项添加到" }), _jsx(Text, { isItatic: true, children: _jsxs(_components.p, { children: [_jsx(Spacer, { len: 1 }), "pom.xml", _jsx(Spacer, { len: 1 })] }) }), _jsx(_components.p, { children: "文件中。您可以在" }), _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: "您也可以直接通过" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-java', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "下载源代码来安装 Antom Java 库。" })] }) })] })] }), _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: "安装 Antom Python 库" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsx(_components.p, { children: "要导入 Antom 的 Python 库，请将依赖项添加到" }), _jsx(Text, { isItatic: true, children: _jsxs(_components.p, { children: [_jsx(Spacer, { len: 1 }), "requirements.txt", _jsx(Spacer, { len: 1 })] }) }), _jsx(_components.p, { children: "文件中。您可以在" }), _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: "您也可以直接通过" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-python', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "下载源代码来安装 Antom Python 库。" })] }) })] })] }), _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: "安装 Antom PHP 库" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsx(_components.p, { children: "要导入 Antom 的 PHP 库，请将依赖项添加到" }), _jsx(Text, { isItatic: true, children: _jsxs(_components.p, { children: [_jsx(Spacer, { len: 1 }), "composer.json", _jsx(Spacer, { len: 1 })] }) }), _jsx(_components.p, { children: "文件中。您可以在" }), _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: "您也可以直接通过" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-php', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "下载源代码来安装 Antom PHP 库。" })] }) })] })] }), _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: "安装 Antom Go 库" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsx(_components.p, { children: "要导入 Antom 的 Go 库，请将依赖项添加到" }), _jsx(Text, { isItatic: true, children: _jsxs(_components.p, { children: [_jsx(Spacer, { len: 1 }), "go.mod", _jsx(Spacer, { len: 1 })] }) }), _jsx(_components.p, { children: "文件中。您可以在" }), _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: "您也可以直接通过" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-go', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "下载源代码来安装 Antom Go 库。" })] }) })] })] }), _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: "安装 Antom .NET 库" }) }), _jsxs(TabGroup, { selector: `tabs`, children: [_jsxs(Tab, { id: `maven`, title: `Maven`, children: [_jsxs(Paragraph, { children: [_jsx(_components.p, { children: "要导入 Antom 的 .NET 库，请将依赖项添加到" }), _jsx(Text, { isItatic: true, children: _jsxs(_components.p, { children: [_jsx(Spacer, { len: 1 }), ".csproj", _jsx(Spacer, { len: 1 })] }) }), _jsx(_components.p, { children: "文件中。您可以在" }), _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: "您也可以直接通过" }), _jsx(Link, { href: 'https://github.com/alipay/global-open-sdk-dotnet', target: "_blank", children: _jsxs(_components.p, { children: [' ', "GitHub", ' '] }) }), _jsx(_components.p, { children: "下载源代码来安装 Antom .NET 库。" })] }) })] })] }), _jsxs(AntomStep, { id: `get-integration-resources`, label: `server`, children: [_jsx(Heading, { level: 3, anchored: true, id: `get-integration-resources`, children: _jsx(_components.p, { children: "获取集成资源" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "在 Antom Dashboard 的" }), _jsx(Link, { href: ' https://dashboard.antom.com/global-payments/developers/quickStart', target: "_blank", children: _jsxs(_components.p, { children: [' ', "开发者", ' '] }) }), _jsx(_components.p, { children: "模块获取集成资源。在您的应用中配置获取的集成资源，以便向 Antom 服务器发送请求时能使用这些资源。" })] })] }), _jsxs(AntomStep, { id: 'initiate-a-subscription-request', label: `server`, when: { integration_type: 'API' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `initiate-a-subscription-request`, children: _jsx(_components.p, { children: "发起创建订阅请求" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "在您的服务器上添加一个端点，以调用" }), _jsx(Link, { href: "https://docs.antom.com/ac/ams_zh-cn/create_sub", target: "_blank", children: _jsx(Text, { isBold: true, children: _jsxs(_components.p, { children: [' ', "create", ' '] }) }) }), _jsx(_components.p, { children: "接口。在发送订阅请求时，指定订阅开始时间、订阅结算时间、周期规则、订阅请求 ID、支付信息以及其他订阅必要信息。" })] })] }), _jsxs(AntomStep, { id: 'specify-links', label: `server`, when: { integration_type: 'API' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `specify-links`, children: _jsx(_components.p, { children: "指定链接" }) }), _jsx(Paragraph, { children: _jsxs(_components.p, { children: ["设置接收通知链接，买家在完成订阅后，Antom 服务端将按订阅周期向您设置的订阅、支付通知地址发送信息，首次订阅直接发送通知信息。", _jsx("br", {}), "\n设置订阅重定向链接，买家在完成订阅后将被重定向至该重定向链接。"] }) })] }), _jsxs(AntomStep, { id: 'receive-payment-notification', label: `server`, when: { integration_type: 'API' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `receive-payment-notification`, children: _jsx(_components.p, { children: "接收支付通知" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "在您的服务器上添加一个端点，以接收来自 Antom 服务端的" }), _jsx(Link, { href: "https://docs.antom.com/docs/ac/ams_zh-cn/notify_subpayment", target: "_blank", children: _jsx(Text, { isBold: true, children: _jsxs(_components.p, { children: [' ', "notifyPayment（订阅）"] }) }) }), _jsx(_components.p, { children: "，主要内容包括支付结果、支付时间和订阅请求 ID，您可以更新支付状态并把这些信息保存到数据库中，以便后续查询。" })] })] }), _jsxs(AntomStep, { id: 'receive-subscription-notification', label: `server`, when: { integration_type: 'API' }, children: [_jsx(Heading, { level: 3, anchored: true, id: `receive-subscription-notification`, children: _jsx(_components.p, { children: "接收订阅结果通知" }) }), _jsxs(Paragraph, { children: [_jsx(_components.p, { children: "在您的服务器上添加一个端点，以接收来自 Antom 服务端的" }), _jsx(Link, { href: "https://docs.antom.com/docs/ac/ams_zh-cn/notify_sub", target: "_blank", children: _jsx(Text, { isBold: true, children: _jsxs(_components.p, { children: [' ', "notifySubscription"] }) }) }), _jsx(_components.p, { children: "，主要内容包括订阅状态、订阅请求 ID 和订阅周期规则，您可以更新订阅状态并把这些信息保存到数据库中，以便后续查询。" })] })] }), _jsx(AntomStepSection, { number: 2, title: '在客户端构建订阅页面' }), _jsxs(AntomStep, { id: 'build-the-antom-page', label: `client`, children: [_jsx(Heading, { level: 3, anchored: true, id: 'build-the-antom-page', children: _jsx(_components.p, { children: "构建订阅页面" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "在订阅页面显示您提供给买家的产品信息。" }) })] }), _jsxs(AntomStep, { id: 'get-the-antom-push-link', label: `client`, children: [_jsx(Heading, { level: 3, anchored: true, id: 'get-the-antom-push-link', children: _jsx(_components.p, { children: "获取订阅推进链接" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "在买家选择了相应的产品订阅后，您发送带有相应订阅信息的订阅请求，并从订阅创建响应中获取授权订阅推进链接。" }) })] }), _jsxs(AntomStep, { id: 'handle-the-redirection', when: { integration_type: 'API' }, label: 'client', children: [_jsx(Heading, { level: 3, anchored: true, id: 'handle-the-redirection', children: _jsx(_components.p, { children: "处理重定向" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "将买家重定向至授权订阅推进链接以完成授权。" }) })] }), _jsxs(AntomStep, { id: 'listen-for-callback-addresses', label: `client`, unless: { platform: "Web" }, children: [_jsx(Heading, { level: 3, anchored: true, id: 'listen-for-callback-addresses', children: _jsx(_components.p, { children: "监听授权订阅后的重定向" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "买家在授权订阅成功后，会按照之前设置的授权重定向链接跳转至前端页面，前端需要监听此次跳转以显示订阅成功等其他处理。" }) })] }), _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: "获取订阅结果" }) }), _jsx(Paragraph, { children: _jsx(_components.p, { children: "当买家完成订阅支付后，通过获取重定向链路中的订阅结果来展示订阅状态。也可以通过轮询后端的订阅结果通知来获取订阅状态。" }) })] }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/server/java/PaymentServer.java', when: { server: 'Java', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `java`, filename: 'src/main/java/com/antom/subscription/api/PaymentServer.java', downloadOnly: false, steps: [`get-integration-resources`, `initiate-a-subscription-request`, `specify-links`, `receive-payment-notification`, `receive-subscription-notification`], children: [_jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`package com.antom.subscription.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.notify.AlipaySubscriptionNotify; import com.alipay.global.api.request.ams.notify.AlipaySubscriptionPayNotify; import com.alipay.global.api.request.ams.subscription.AlipaySubscriptionCreateRequest; import com.alipay.global.api.response.ams.subscription.AlipaySubscriptionCreateResponse; 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.*; import javax.servlet.http.HttpServletRequest; import java.math.BigDecimal; import java.time.ZonedDateTime; import java.time.format.DateTimeFormatter; import java.util.UUID; /** * sample payment server using Antom API integration mode **/ @Controller @CrossOrigin @RequestMapping("/subscriptions") @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: [` 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-a-subscription-request`], chunks: [` @PostMapping("/create") public ResponseEntity subscriptionCreate(@RequestBody SubscriptionVO subscription) { AlipaySubscriptionCreateRequest alipaySubscriptionCreateRequest = new AlipaySubscriptionCreateRequest(); // replace with your subscriptionRequestId. // You can save the relationship between the subscriptionRequestId and the user ID for later information retrieval. String subscriptionRequestId = UUID.randomUUID().toString(); alipaySubscriptionCreateRequest.setSubscriptionRequestId(subscriptionRequestId); alipaySubscriptionCreateRequest.setSubscriptionDescription("Subscription Description"); // set subscription start time and end time. you might want to consider time zones // If the start time is earlier than the authorization time, the subscription is successful. // If the start time is later than the authorization time, the payment is made after the successful authorization, which is the pre-sale // For details, please refer to: Samples DateTimeFormatter formatter = DateTimeFormatter.ofPattern("yyyy-MM-dd'T'HH:mm:ssXXX"); alipaySubscriptionCreateRequest.setSubscriptionStartTime(ZonedDateTime.now().format(formatter)); alipaySubscriptionCreateRequest.setSubscriptionEndTime(ZonedDateTime.now().plusYears(3).format(formatter)); // set periodRule PeriodRule periodRule = PeriodRule.builder().periodCount(subscription.periodCount).periodType(subscription.periodType).build(); alipaySubscriptionCreateRequest.setPeriodRule(periodRule); // set paymentMethod PaymentMethod paymentMethod = PaymentMethod.builder().paymentMethodType(subscription.getPaymentMethodType()).build(); alipaySubscriptionCreateRequest.setPaymentMethod(paymentMethod); // 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(subscription.getCurrency()), new BigDecimal(subscription.getAmountValue())).getAmountMinorLong(); Amount amount = Amount.builder().currency(subscription.currency).value(String.valueOf(amountMinorLong)).build(); // set payment amount alipaySubscriptionCreateRequest.setPaymentAmount(amount); // set order info OrderInfo orderInfo = OrderInfo.builder().orderAmount(amount).build(); alipaySubscriptionCreateRequest.setOrderInfo(orderInfo); // set settlement strategy // replace with your existing settlement currency SettlementStrategy settlementStrategy = SettlementStrategy.builder().settlementCurrency("USD").build(); alipaySubscriptionCreateRequest.setSettlementStrategy(settlementStrategy); // set env info Env env = Env.builder().terminalType(TerminalType.valueOf(subscription.terminalType)).build(); if (!TerminalType.WEB.equals(TerminalType.valueOf(subscription.terminalType)) && subscription.osType != null) { env.setOsType(OsType.valueOf(subscription.osType)); } alipaySubscriptionCreateRequest.setEnv(env); `] }, `server-Java-API-code2`), _jsx(AntomChunk, { language: `java`, steps: [`specify-links`], chunks: [` // replace with your notify url // or configure your notify url here: Notification URL alipaySubscriptionCreateRequest.setPaymentNotificationUrl("http://www.yourNotifyUrl.com/subscriptions/receivePaymentNotify"); alipaySubscriptionCreateRequest.setSubscriptionNotificationUrl("http://www.yourNotifyUrl.com/subscriptions/receiveSubscriptionNotify"); // replace with your subscription redirect url alipaySubscriptionCreateRequest.setSubscriptionRedirectUrl("http://localhost:8080/index.html?subscriptionRequestId=" + subscriptionRequestId); `] }, `server-Java-API-code3`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` // do authorization consult AlipaySubscriptionCreateResponse alipaySubscriptionCreateResponse; try { long startTime = System.currentTimeMillis(); System.out.println("subscription create request: " + JSON.toJSONString(alipaySubscriptionCreateRequest)); alipaySubscriptionCreateResponse = CLIENT.execute(alipaySubscriptionCreateRequest); System.out.println("subscription create response: " + JSON.toJSONString(alipaySubscriptionCreateResponse)); System.out.println("subscription create request cost time: " + (System.currentTimeMillis() - startTime) + "ms\\n"); } catch (AlipayApiException e) { // exception handling return ResponseEntity.ok().body(new ApiResponse(subscriptionRequestId, e)); } return ResponseEntity.ok().body(new ApiResponse(subscriptionRequestId, alipaySubscriptionCreateResponse)); } `] }, `server-Java-API-other3`), _jsx(AntomChunk, { language: `java`, steps: [`receive-payment-notification`], chunks: [` /** * receive payment notify * * @param request request * @param notifyBody notify body * @return Result */ @PostMapping("/receivePaymentNotify") @ResponseBody public Result receivePaymentNotify(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 AlipaySubscriptionPayNotify paymentNotify = JSON.parseObject(notifyBody, AlipaySubscriptionPayNotify.class); if (paymentNotify != null && "SUCCESS".equals(paymentNotify.getResult().getResultCode())) { // handle your own business logic. // e.g. The payment information of the user is saved through the relationship between the subscriptionRequestId and the user ID. System.out.println("receive payment notify: " + JSON.toJSONString(paymentNotify)); 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-code4`), _jsx(AntomChunk, { language: `java`, steps: [`receive-subscription-notification`], chunks: [` /** * receive subscription notify * * @param request request * @param notifyBody notify body * @return Result */ @PostMapping("/receiveSubscriptionNotify") @ResponseBody public Result receiveSubscriptionNotify(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 AlipaySubscriptionNotify subscriptionNotify = JSON.parseObject(notifyBody, AlipaySubscriptionNotify.class); if (subscriptionNotify != null && SubscriptionNotificationType.CREATE.equals(subscriptionNotify.getSubscriptionNotificationType())) { // handle your own business logic. // e.g. The subscription information of the user is saved through the relationship between the subscriptionRequestId and the user ID. System.out.println("receive subscription notify: " + JSON.toJSONString(subscriptionNotify)); 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-code5`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` @Data public static class SubscriptionVO { private String periodType; private Integer periodCount; private String amountValue; private String currency; private String paymentMethodType; private String terminalType = "WEB"; private String osType; } @Data private static class ApiResponse { private String status = "success"; private String subscriptionRequestId; private String message; private Object data; public ApiResponse(String subscriptionRequestId, Object data) { this.subscriptionRequestId = subscriptionRequestId; this.data = data; } public ApiResponse(String subscriptionRequestId, Exception e) { this.subscriptionRequestId = subscriptionRequestId; this.status = "error"; this.message = e.getMessage(); } } } `] }, `server-Java-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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-a-subscription-request`, `specify-links`, `receive-payment-notification`, `receive-subscription-notification`], 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 import datetime 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.env import Env from com.alipay.ams.api.model.order_info import OrderInfo from com.alipay.ams.api.model.os_type import OsType from com.alipay.ams.api.model.payment_method import PaymentMethod from com.alipay.ams.api.model.period_rule import PeriodRule from com.alipay.ams.api.model.period_type import PeriodType from com.alipay.ams.api.model.settlement_strategy import SettlementStrategy from com.alipay.ams.api.model.subscription_notification_type import SubscriptionNotificationType from com.alipay.ams.api.model.terminal_type import TerminalType from com.alipay.ams.api.request.notify.alipay_subscription_notify import AlipaySubscriptionNotify from com.alipay.ams.api.request.notify.alipay_subscription_pay_notify import AlipaySubscriptionPayNotify from com.alipay.ams.api.request.subscription.alipay_subscription_create_request import AlipaySubscriptionCreateRequest from com.alipay.ams.api.response.subscription.alipay_subscription_create_response import AlipaySubscriptionCreateResponse from com.alipay.ams.api.tools.webhook_tool import check_signature from flask import Blueprint, 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: [`app = Flask(__name__) sub_bp = Blueprint("subscriptions", __name__, url_prefix="/subscriptions") CORS(app) `] }, `server-Python-API-other2`), _jsx(AntomChunk, { language: `python`, steps: [`initiate-a-subscription-request`], chunks: [`@sub_bp.route("/create", methods=["POST"]) def subscription_create(): sub_vo = request.get_json() terminal_type = sub_vo.get("terminalType", TerminalType.WEB.name) alipay_subscription_create_request = AlipaySubscriptionCreateRequest() # replace with your subscriptionRequestId. # You can save the relationship between the subscriptionRequestId and the user ID for later information retrieval. subscription_request_id = str(uuid.uuid4()) alipay_subscription_create_request.subscription_request_id = subscription_request_id alipay_subscription_create_request.subscription_description = "Subscription Description" # set subscription start time and end time. you might want to consider time zones # If the start time is earlier than the authorization time, the subscription is successful. # If the start time is later than the authorization time, the payment is made after the successful authorization, which is the pre-sale # For details, please refer to: https://docs.antom.com/ac/subscriptionpay/activation#uiqBb timezone = datetime.datetime.now().astimezone().tzinfo current_time = datetime.datetime.now(timezone) alipay_subscription_create_request.subscription_start_time = str(current_time.isoformat(timespec='seconds')) alipay_subscription_create_request.subscription_end_time = str( current_time.replace(year=current_time.year + 3).isoformat(timespec='seconds')) # set periodRule period_rule = PeriodRule() period_rule.period_count = sub_vo['periodCount'] period_rule.period_type = PeriodType[sub_vo['periodType']] alipay_subscription_create_request.period_rule = period_rule # set paymentMethod payment_method = PaymentMethod() payment_method.payment_method_type = sub_vo['paymentMethodType'] alipay_subscription_create_request.payment_method = payment_method # 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(sub_vo['amountValue'], Currency[sub_vo['currency']]).sub_units # set payment amount amount = Amount(sub_vo['currency'], money_sub_units) alipay_subscription_create_request.payment_amount = amount # set buyer info buyer = Buyer() buyer.reference_buyer_id = "your_buyer_id" # set order info order_info = OrderInfo() order_info.order_amount = amount alipay_subscription_create_request.order_info = order_info # set settlement strategy. settlement_strategy = SettlementStrategy() # replace with your existing settlement currency settlement_strategy.settlement_currency = "USD" alipay_subscription_create_request.settlement_strategy = settlement_strategy # set env info env = Env() env.terminal_type = TerminalType[terminal_type] if TerminalType.WEB.name != terminal_type and "osType" in sub_vo: env.os_type = OsType[sub_vo['osType']] alipay_subscription_create_request.env = env `] }, `server-Python-API-code2`), _jsx(AntomChunk, { language: `python`, steps: [`specify-links`], chunks: [` # replace with your notify url # or configure your notify url here: https://dashboard.antom.com/global-payments/developers/iNotify alipay_subscription_create_request.payment_notification_url = "http://www.yourNotifyUrl.com/subscriptions/receivePaymentNotify" alipay_subscription_create_request.subscription_notification_url = "http://www.yourNotifyUrl.com/subscriptions/receiveSubscriptionNotify" # replace with your redirect url alipay_subscription_create_request.subscription_redirect_url = f"http://localhost:5173/index.html?subscriptionRequestId={subscription_request_id}" `] }, `server-Python-API-code3`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` try: start_time = time.time() print(f"subscription create request: {alipay_subscription_create_request.to_ams_json()}") alipay_subscription_create_response_body = default_alipay_client.execute(alipay_subscription_create_request) alipay_subscription_create_response = AlipaySubscriptionCreateResponse(alipay_subscription_create_response_body) print(f"subscription create response: {alipay_subscription_create_response_body}") print(f"subscription create request cost time: {time.time() - start_time}") except AlipayApiException as e: return jsonify(ApiResponse().error(subscription_request_id, e)) return jsonify(ApiResponse().success(subscription_request_id, json.loads(alipay_subscription_create_response_body))) `] }, `server-Python-API-other3`), _jsx(AntomChunk, { language: `python`, steps: [`receive-payment-notification`], chunks: [`# receive payment notify @sub_bp.route("/receivePaymentNotify", methods=['POST']) def receive_payment_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_subscription_pay_notify = AlipaySubscriptionPayNotify(notify_body) if alipay_subscription_pay_notify.result.result_code == "SUCCESS": # handle your own business logic. # e.g. The payment information of the user is saved through the relationship between the subscriptionRequestId and the user ID. print(f"receive payment notify: {notify_body}") 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-code4`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` `] }, `server-Python-API-other4`), _jsx(AntomChunk, { language: `python`, steps: [`receive-subscription-notification`], chunks: [`# receive subscription notify @sub_bp.route("/receiveSubscriptionNotify", methods=['POST']) def receive_subscription_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_subscription_notify = AlipaySubscriptionNotify(notify_body) if SubscriptionNotificationType.CREATE == alipay_subscription_notify.subscription_notification_type: # handle your own business logic. # e.g. The subscription information of the user is saved through the relationship between the subscriptionRequestId and the user ID. print(f"receive subscription notify: {notify_body}") 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-code5`), _jsx(AntomChunk, { language: `python`, steps: [``], chunks: [` class ApiResponse: def __init__(self): self.__status = "success" self.__subscription_request_id = "" self.__message = "" self.__data = None def success(self, subscription_request_id, data): self.__subscription_request_id = subscription_request_id self.__data = data return self.to_json() def error(self, subscription_request_id, e): self.__subscription_request_id = subscription_request_id self.__message = str(e) self.__status = "error" return self.to_json() def to_json(self): return { "status": self.__status, "paymentRequestId": self.__subscription_request_id, "message": self.__message, "data": self.__data } app.register_blueprint(sub_bp) if __name__ == '__main__': app.run(host='localhost', port=8080) `] }, `server-Python-API-other5`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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-a-subscription-request`, `specify-links`, `receive-payment-notification`, `receive-subscription-notification`], 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; public function __construct() { 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-a-subscription-request`], chunks: [` public function subscriptionCreate(\$subscription) { \$alipaySubscriptionCreateRequest = new AlipaySubscriptionCreateRequest(); // replace with your subscriptionRequestId // You can save the relationship between the subscriptionRequestId and the user ID for later information retrieval \$subscriptionRequestId = uniqid('SUB_'); \$alipaySubscriptionCreateRequest->setSubscriptionRequestId(\$subscriptionRequestId); \$alipaySubscriptionCreateRequest->setSubscriptionDescription("Subscription Description"); // set subscription start time and end time. you might want to consider time zones // If the start time is earlier than the authorization time, the subscription is successful // If the start time is later than the authorization time, the payment is made after the successful authorization, which is the pre-sale // For details, please refer to: Samples \$now = new DateTime(); \$alipaySubscriptionCreateRequest->setSubscriptionStartTime(\$now->format('Y-m-d\\TH:i:sP')); \$alipaySubscriptionCreateRequest->setSubscriptionEndTime(\$now->modify('+3 years')->format('Y-m-d\\TH:i:sP')); // set periodRule \$periodRule = new PeriodRule(); \$periodRule->setPeriodCount(\$subscription['periodCount']); \$periodRule->setPeriodType(\$subscription['periodType']); \$alipaySubscriptionCreateRequest->setPeriodRule(\$periodRule); // set paymentMethod \$paymentMethod = new PaymentMethod(); \$paymentMethod->setPaymentMethodType(\$subscription['paymentMethodType']); \$alipaySubscriptionCreateRequest->setPaymentMethod(\$paymentMethod); // 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)\$subscription['amountValue'], new Currency(\$subscription['currency'])); // set amount \$amount = new Amount(); \$amount->setCurrency(\$subscription['currency']); \$amount->setValue(\$money->getAmount()); // set payment amount \$alipaySubscriptionCreateRequest->setPaymentAmount(\$amount); // set order info \$orderInfo = new OrderInfo(); \$orderInfo->setOrderAmount(\$amount); \$alipaySubscriptionCreateRequest->setOrderInfo(\$orderInfo); // set settlement strategy // replace with your existing settlement currency \$settlementStrategy = new SettlementStrategy(); \$settlementStrategy->setSettlementCurrency("USD"); \$alipaySubscriptionCreateRequest->setSettlementStrategy(\$settlementStrategy); // set env info \$env = new Env(); \$subscription['terminalType'] = isset(\$subscription['terminalType']) ? \$subscription['terminalType'] : TerminalType::WEB; \$env->setTerminalType(\$subscription['terminalType']); if (\$subscription['terminalType'] !== TerminalType::WEB && !empty(\$subscription['osType'])) { \$env->setOsType(\$subscription['osType']); } \$alipaySubscriptionCreateRequest->setEnv(\$env); `] }, `server-PHP-API-code2`), _jsx(AntomChunk, { language: `php`, steps: [`specify-links`], chunks: [` // replace with your notify url // or configure your notify url here: Notification URL \$alipaySubscriptionCreateRequest->setPaymentNotificationUrl("http://www.yourNotifyUrl.com/subscriptions/receivePaymentNotify"); \$alipaySubscriptionCreateRequest->setSubscriptionNotificationUrl("http://www.yourNotifyUrl.com/subscriptions/receiveSubscriptionNotify"); // replace with your subscription redirect url \$alipaySubscriptionCreateRequest->setSubscriptionRedirectUrl( "http://localhost:5173/index.html?subscriptionRequestId=" . \$subscriptionRequestId ); `] }, `server-PHP-API-code3`), _jsx(AntomChunk, { language: `php`, steps: [``], chunks: [` try { \$startTime = microtime(true); error_log("subscription create request: " . json_encode(\$alipaySubscriptionCreateRequest)); \$alipaySubscriptionCreateResponse = self::\$CLIENT->execute(\$alipaySubscriptionCreateRequest); error_log("subscription create response: " . json_encode(\$alipaySubscriptionCreateResponse)); error_log("subscription create request cost time: " . (microtime(true) - \$startTime) * 1000 . "ms\\n"); return \$this->apiResponse(\$subscriptionRequestId, \$alipaySubscriptionCreateResponse); } catch (Exception \$e) { // exception handling return \$this->apiResponse(\$subscriptionRequestId, \$e); } } `] }, `server-PHP-API-other2`), _jsx(AntomChunk, { language: `php`, steps: [`receive-payment-notification`], chunks: [` /** * receive payment notify */ public function receivePaymentNotify(\$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 \$paymentNotify = json_decode(\$notifyBody, true); if (\$paymentNotify && \$paymentNotify['result']['resultCode'] === 'SUCCESS') { // handle your own business logic // e.g. The payment information of the user is saved through the relationship between the subscriptionRequestId and the user ID error_log("receive payment notify: " . json_encode(\$paymentNotify)); 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-code4`), _jsx(AntomChunk, { language: `php`, steps: [`receive-subscription-notification`], chunks: [` /** * receive subscription notify */ public function receiveSubscriptionNotify(\$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 \$subscriptionNotify = json_decode(\$notifyBody, true); if (\$subscriptionNotify && \$subscriptionNotify['subscriptionNotificationType'] === 'CREATE') { // handle your own business logic // e.g. The subscription information of the user is saved through the relationship between the subscriptionRequestId and the user ID error_log("receive subscription notify: " . json_encode(\$subscriptionNotify)); 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-code5`), _jsx(AntomChunk, { language: `php`, steps: [``], chunks: [` private function apiResponse(\$subscriptionRequestId, \$data) { if (\$data instanceof Exception) { return array( 'status' => 'error', 'subscriptionRequestId' => \$subscriptionRequestId, 'message' => \$data->getMessage() ); } return array( 'status' => 'success', 'subscriptionRequestId' => \$subscriptionRequestId, 'data' => \$data ); } } // 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('/subscriptions/create', function () use (\$app, \$paymentServer) { \$subscription = \$app->request->getBody(); \$subscription = json_decode(\$subscription, true); \$response = \$paymentServer->subscriptionCreate(\$subscription); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/subscriptions/receivePaymentNotify', function () use (\$app, \$paymentServer) { \$notifyBody = \$app->request->getBody(); \$response = \$paymentServer->receivePaymentNotify(\$app->request, \$notifyBody); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->post('/subscriptions/receiveSubscriptionNotify', function () use (\$app, \$paymentServer) { \$notifyBody = \$app->request->getBody(); \$response = \$paymentServer->receiveSubscriptionNotify(\$app->request, \$notifyBody); \$app->response->headers->set('Content-Type', 'application/json'); echo json_encode(\$response); }); \$app->run(); `] }, `server-PHP-API-other3`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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-a-subscription-request`, `specify-links`, `receive-payment-notification`, `receive-subscription-notification`], children: [_jsx(AntomChunk, { language: `go`, steps: [``], chunks: [`package main import ( "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/notify" "github.com/alipay/global-open-sdk-go/com/alipay/api/request/subscription" "github.com/alipay/global-open-sdk-go/com/alipay/api/response" "github.com/alipay/global-open-sdk-go/com/alipay/api/tools" "io" "log" "net/http" "strconv" "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: [`func main() { // Register routes http.HandleFunc("/subscriptions/create", enableCORS(handleSubscriptionCreate)) http.HandleFunc("/subscriptions/receivePaymentNotify", enableCORS(handleReceivePaymentNotify)) http.HandleFunc("/subscriptions/receiveSubscriptionNotify", enableCORS(handleReceiveSubscriptionNotify)) 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-a-subscription-request`], chunks: [`func handleSubscriptionCreate(w http.ResponseWriter, r *http.Request) { if r.Method != http.MethodPost { http.Error(w, "Method not allowed", http.StatusMethodNotAllowed) return } var subscriptionVO SubscriptionVO json.NewDecoder(r.Body).Decode(&subscriptionVO) // Set default terminal type if not provided if subscriptionVO.TerminalType == "" { subscriptionVO.TerminalType = "WEB" } request, subscriptionCreateRequest := subscription.NewAlipaySubscriptionCreateRequest() // replace with your subscriptionRequestId // You can save the relationship between the subscriptionRequestId and the user ID for later information retrieval. subscriptionRequestId := uuid.New().String() subscriptionCreateRequest.SubscriptionRequestId = subscriptionRequestId subscriptionCreateRequest.SubscriptionDescription = "Subscription Description" // set subscription start time and end time. you might want to consider time zones // If the start time is earlier than the authorization time, the subscription is successful. // If the start time is later than the authorization time, the payment is made after the successful authorization, which is the pre-sale // For details, please refer to: Samples subscriptionCreateRequest.SubscriptionStartTime = time.Now().Format("2006-01-02T15:04:05-07:00") subscriptionCreateRequest.SubscriptionEndTime = time.Now().AddDate(3, 0, 0).Format("2006-01-02T15:04:05-07:00") // set periodRule subscriptionCreateRequest.PeriodRule = &model.PeriodRule{ PeriodType: model.PeriodType(subscriptionVO.PeriodType), PeriodCount: subscriptionVO.PeriodCount, } // set paymentMethod subscriptionCreateRequest.PaymentMethod = &model.PaymentMethod{ PaymentMethodType: subscriptionVO.PaymentMethodType, } // 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(subscriptionVO.AmountValue, 64) amountValue := money.NewFromFloat(parseFloat, subscriptionVO.Currency).Amount() amount := &model.Amount{ Currency: subscriptionVO.Currency, Value: strconv.FormatInt(amountValue, 10), } // set payment amount subscriptionCreateRequest.PaymentAmount = amount // set order info subscriptionCreateRequest.OrderInfo = &model.OrderInfo{ OrderAmount: amount, } // set settlement strategy // replace with your existing settlement currency subscriptionCreateRequest.SettlementStrategy = &model.SettlementStrategy{ SettlementCurrency: "USD", } // set env info terminal := model.TerminalType(subscriptionVO.TerminalType) env := &model.Env{TerminalType: terminal} if terminal != model.WEB && subscriptionVO.OsType != "" { env.OsType = model.OsType(subscriptionVO.OsType) } subscriptionCreateRequest.Env = env `] }, `server-Go-API-code2`), _jsx(AntomChunk, { language: `go`, steps: [`specify-links`], chunks: [` // replace with your notify url // or configure your notify url here: Notification URL subscriptionCreateRequest.PaymentNotificationUrl = "http://www.yourNotifyUrl.com/subscriptions/receivePaymentNotify" subscriptionCreateRequest.SubscriptionNotificationUrl = "http://www.yourNotifyUrl.com/subscriptions/receiveSubscriptionNotify" // replace with your subscription redirect url subscriptionCreateRequest.SubscriptionRedirectUrl = "http://localhost:5173/index.html?subscriptionRequestId=" + subscriptionRequestId `] }, `server-Go-API-code3`), _jsx(AntomChunk, { language: `go`, steps: [``], chunks: [` startTime := time.Now() subscriptionRequestJson, _ := json.Marshal(subscriptionCreateRequest) log.Printf("subscription create request: %s", subscriptionRequestJson) response, err := client.Execute(request) if err != nil { sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "error", SubscriptionRequestID: subscriptionRequestId, Message: err.Error(), }) return } log.Printf("subscription create response: %+v", response) log.Printf("subscription create request cost time: %v ms\\n", time.Since(startTime).Milliseconds()) sendJSONResponse(w, http.StatusOK, ApiResponse{ Status: "success", SubscriptionRequestID: subscriptionRequestId, Data: response, }) } `] }, `server-Go-API-other3`), _jsx(AntomChunk, { language: `go`, steps: [`receive-payment-notification`], chunks: [`/* receive payment notify */ func handleReceivePaymentNotify(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 paymentNotify notify.AlipaySubscriptionPayNotify if err := json.Unmarshal(rawBody, &paymentNotify); err != nil { sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "FAIL", ResultMessage: "fail.", ResultStatus: "F", }) return } if paymentNotify.Result.ResultCode == "SUCCESS" { // handle your own business logic. // e.g. The payment information of the user is saved through the relationship between the subscriptionRequestId and the user ID. log.Printf("receive payment notify: %s", notifyBody) sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "SUCCESS", ResultMessage: "success.", ResultStatus: "S", }) return } sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "SYSTEM_ERROR", ResultMessage: "system error.", ResultStatus: "F", }) } `] }, `server-Go-API-code4`), _jsx(AntomChunk, { language: `go`, steps: [`receive-subscription-notification`], chunks: [`/* receive subscription notify */ func handleReceiveSubscriptionNotify(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 subscriptionNotify notify.AlipaySubscriptionNotify if err := json.Unmarshal(rawBody, &subscriptionNotify); err != nil { sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "FAIL", ResultMessage: "fail.", ResultStatus: "F", }) return } if subscriptionNotify.SubscriptionNotificationType == model.SubscriptionNotificationType_CREATE { // handle your own business logic. // e.g. The subscription information of the user is saved through the relationship between the subscriptionRequestId and the user ID. log.Printf("receive subscription notify: %s", notifyBody) sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "SUCCESS", ResultMessage: "success.", ResultStatus: "S", }) return } sendJSONResponse(w, http.StatusOK, response.Result{ ResultCode: "SYSTEM_ERROR", ResultMessage: "system error.", ResultStatus: "F", }) } `] }, `server-Go-API-code5`), _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) } // SubscriptionVO represents subscription request data type SubscriptionVO struct {`, ' PeriodType string `json:"periodType"`', ' PeriodCount int `json:"periodCount"`', ' AmountValue string `json:"amountValue"`', ' Currency string `json:"currency"`', ' PaymentMethodType string `json:"paymentMethodType"`', ' TerminalType string `json:"terminalType"`', ' OsType string `json:"osType"`', `} // ApiResponse represents API response structure type ApiResponse struct {`, ' Status string `json:"status"`', ' SubscriptionRequestID string `json:"subscriptionRequestId,omitempty"`', ' Message string `json:"message,omitempty"`', ' Data interface{} `json:"data,omitempty"`', `} `] }, `server-Go-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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-a-subscription-request`, `specify-links`, `receive-payment-notification`, `receive-subscription-notification`], children: [_jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [`using System.Diagnostics; using ams_dotnet.com.alipay.ams.api.request.subscription; using ams_dotnet.com.alipay.ams.api.response.subscription; using Microsoft.AspNetCore; using Microsoft.AspNetCore.Mvc; using com.alipay.ams.api; using com.alipay.ams.api.entities; using com.alipay.ams.api.request.notify; using com.alipay.ams.util; using Newtonsoft.Json; using NMoneys; namespace antom_online_payment_sample_dotnet.subscription.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: [` 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] [Route("[controller]")] [Produces("application/json")] [ApiConventionType(typeof(DefaultApiConventions))] public class SubscriptionsController : ControllerBase {`] }, `server-.NET-API-other2`), _jsx(AntomChunk, { language: `dotnet`, steps: [`initiate-a-subscription-request`], chunks: [` [HttpPost("create")] public IActionResult Create([FromBody] SubscriptionVO subscription) { var alipaySubscriptionCreateRequest = new AlipaySubscriptionCreateRequest(); // replace with your subscriptionRequestId. // You can save the relationship between the subscriptionRequestId and the user ID for later information retrieval. var subscriptionRequestId = Guid.NewGuid().ToString(); alipaySubscriptionCreateRequest.SubscriptionRequestId = subscriptionRequestId; alipaySubscriptionCreateRequest.SubscriptionDescription = "Subscription Description"; // set subscription start time and end time. you might want to consider time zones // If the start time is earlier than the authorization time, the subscription is successful. // If the start time is later than the authorization time, the payment is made after the successful authorization, which is the pre-sale // For details, please refer to: Samples var formatter = "yyyy-MM-dd'T'HH:mm:sszzz"; alipaySubscriptionCreateRequest.SubscriptionStartTime = DateTime.Now.ToString(formatter); alipaySubscriptionCreateRequest.SubscriptionEndTime = DateTime.Now.AddYears(3).ToString(formatter); // set periodRule Enum.TryParse(subscription.PeriodType, out PeriodType periodType); var periodRule = new PeriodRule() { PeriodCount = subscription.PeriodCount, PeriodType = periodType }; alipaySubscriptionCreateRequest.PeriodRule = periodRule; // set paymentMethod var paymentMethod = new PaymentMethod(subscription.PaymentMethodType); alipaySubscriptionCreateRequest.PaymentMethod = paymentMethod; // 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(subscription.AmountValue), Currency.Get(subscription.Currency)) .MinorIntegralAmount; var amount = new Amount() { Currency = subscription.Currency, Value = minorIntegralAmount.ToString() }; // set payment amount alipaySubscriptionCreateRequest.PaymentAmount = amount; // set order info var orderInfo = new OrderInfo() { OrderAmount = amount }; alipaySubscriptionCreateRequest.OrderInfo = orderInfo; // set settlement strategy // replace with your existing settlement currency var settlementStrategy = new SettlementStrategy() { SettlementCurrency = "USD" }; alipaySubscriptionCreateRequest.SettlementStrategy = settlementStrategy; // set env info Enum.TryParse(subscription.TerminalType, out TerminalType terminalType); var env = new Env() { TerminalType = terminalType }; if (!terminalType.Equals(TerminalType.WEB) && !string.IsNullOrWhiteSpace(subscription.OsType) && Enum.TryParse(subscription.OsType, out OsType osType)) { env.OsType = osType; } alipaySubscriptionCreateRequest.Env = env; `] }, `server-.NET-API-code2`), _jsx(AntomChunk, { language: `dotnet`, steps: [`specify-links`], chunks: [` // replace with your notify url // or configure your notify url here: Notification URL alipaySubscriptionCreateRequest.PaymentNotificationUrl = "http://www.yourNotifyUrl.com/subscriptions/receivePaymentNotify"; alipaySubscriptionCreateRequest.SubscriptionNotificationUrl = "http://www.yourNotifyUrl.com/subscriptions/receiveSubscriptionNotify"; // replace with your subscription redirect url alipaySubscriptionCreateRequest.SubscriptionRedirectUrl = "http://localhost:8080/index.html?subscriptionRequestId=" + subscriptionRequestId; `] }, `server-.NET-API-code3`), _jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [` try { var stopwatch = new Stopwatch(); stopwatch.Start(); Console.WriteLine("subscription create request: " + JsonConvert.SerializeObject(alipaySubscriptionCreateRequest, Formatting.Indented)); var alipaySubscriptionCreateResponse = Server.defaultAlipayClient.Execute(alipaySubscriptionCreateRequest); Console.WriteLine("subscription create response: " + JsonConvert.SerializeObject(alipaySubscriptionCreateResponse, Formatting.Indented)); stopwatch.Stop(); Console.WriteLine( "subscription create request cost time: " + stopwatch.ElapsedMilliseconds + "ms\\n"); return Ok(new ApiResponse(subscriptionRequestId, alipaySubscriptionCreateResponse)); } catch (Exception e) { return Ok(new ApiResponse(subscriptionRequestId, e)); } } `] }, `server-.NET-API-other3`), _jsx(AntomChunk, { language: `dotnet`, steps: [`receive-payment-notification`], chunks: [` ///

/// receive payment notify ///

[HttpPost("receivePaymentNotify")] public async Task ReceivePaymentNotify() { // 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 paymentNotify = JsonConvert.DeserializeObject(notifyBody); if (paymentNotify != null && "SUCCESS".Equals(paymentNotify.Result.ResultCode)) { // handle your own business logic. // e.g. The payment information of the user is saved through the relationship between the subscriptionRequestId and the user ID. Console.WriteLine("receive payment notify: " + JsonConvert.SerializeObject(paymentNotify, Formatting.Indented)); return Ok(new Result() { ResultCode = "SUCCESS", ResultMessage = "success.", ResultStatus = "S" }); } } catch (Exception e) { 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-code4`), _jsx(AntomChunk, { language: `dotnet`, steps: [`receive-subscription-notification`], chunks: [` ///

/// receive subscription notify ///

[HttpPost("receiveSubscriptionNotify")] public async Task ReceiveSubscriptionNotify() { // 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 subscriptionNotify = JsonConvert.DeserializeObject(notifyBody); if (subscriptionNotify != null && SubscriptionNotificationType.CREATE.Equals(subscriptionNotify.SubscriptionNotificationType)) { // handle your own business logic. // e.g. The subscription information of the user is saved through the relationship between the subscriptionRequestId and the user ID. Console.WriteLine("receive subscription notify: " + JsonConvert.SerializeObject(subscriptionNotify, Formatting.Indented)); return Ok(new Result() { ResultCode = "SUCCESS", ResultMessage = "success.", ResultStatus = "S" }); } } catch (Exception e) { 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-code5`), _jsx(AntomChunk, { language: `dotnet`, steps: [``], chunks: [` } public class SubscriptionVO { public string PeriodType { get; set; } public int PeriodCount { get; set; } public string AmountValue { get; set; } public string Currency { get; set; } public string PaymentMethodType { get; set; } public string TerminalType { get; set; } = "WEB"; public string? OsType { get; set; } } public class ApiResponse { public string Status { get; set; } = "success"; public string SubscriptionRequestId { get; set; } public string Message { get; set; } public object Data { get; set; } public ApiResponse(string subscriptionRequestId, object data) { SubscriptionRequestId = subscriptionRequestId; Data = data; } public ApiResponse(string subscriptionRequestId, Exception e) { SubscriptionRequestId = subscriptionRequestId; Status = "error"; Message = e.Message; } } } `] }, `server-.NET-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/html/index.html', when: { platform: 'Web', client: 'HTML', server: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `html`, filename: 'src/main/resources/static/index.html', downloadOnly: false, steps: [`build-the-antom-page`], children: _jsx(AntomChunk, { language: `html`, steps: [`build-the-antom-page`], chunks: [` Subscription Payment Demo

Subscription Payment Demo

Support plan

Onboarding time

Language supported

Inquiry response time

Select the support plan you want to subscribe to

`] }, `Web-HTML-API-code1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/html/index.js', when: { platform: 'Web', client: 'HTML', server: 'Java', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'src/main/resources/static/index.js', downloadOnly: false, steps: [`get-the-antom-push-link`, `handle-the-redirection`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`document.addEventListener('DOMContentLoaded', () => { const paymentOptions = [ { label: 'Standard', value: 'Standard', icon: 'https://cdn.marmot-cloud.com/storage/2022/12/20/4e873d78-0f2d-4553-895e-e5392eddda39.png', amountValue: '688.80', currency: 'HKD', onboardingTime: '3-5 working days', languageSupported: 'Chinese/English', inquiryResponseTime: '< 48 hours', }, { label: 'Premium', value: 'Premium', icon: ' https://cdn.marmot-cloud.com/storage/2022/12/19/d45c0b0f-a1f3-4ca9-99c7-f0ea74c5c6ac.png', amountValue: '1088.80', currency: 'HKD', onboardingTime: '1-2 working days', languageSupported: 'Chinese/English/Japanese/Korean', inquiryResponseTime: '< 24 hours', }, ]; const initialPaymentOption = paymentOptions.find( option => option.value === (localStorage.getItem('supportPlan') || 'Standard') ) || paymentOptions[0]; let selectedOption = initialPaymentOption; function updateDetails() { document.getElementById('selected-label').innerText = selectedOption.label; document.getElementById('onboarding-time').innerText = selectedOption.onboardingTime; document.getElementById('language-supported').innerText = selectedOption.languageSupported; document.getElementById('inquiry-response-time').innerText = selectedOption.inquiryResponseTime; document.getElementById( 'submit'`, ' ).innerText = `Pay \${selectedOption.currency} \${selectedOption.amountValue}`;', ` } function handlePaymentOptionChange(value) { const option = paymentOptions.find(option => option.value === value); if (option) { selectedOption = option; localStorage.setItem('supportPlan', selectedOption.value); updateDetails(); } } function updateSelectedOption(selectedValue) { document.querySelectorAll('.payment-option').forEach(labelElement => { const radioInput = labelElement.querySelector('input'); if (radioInput.value === selectedValue) { labelElement.classList.add('selected'); radioInput.checked = true; } else { labelElement.classList.remove('selected'); } }); } // Render payment options const checkoutBox = document.getElementById('checkout-box'); paymentOptions.forEach(({ label, value }) => { const labelElement = document.createElement('label');`, ' labelElement.className = `payment-option \${', ` selectedOption.value === value ? 'selected' : ''`, ' }`;', ' labelElement.innerHTML = `', ` \${label}`, ' `;', ` labelElement.querySelector('input').addEventListener('change', event => { handlePaymentOptionChange(event.target.value); updateSelectedOption(event.target.value); }); checkoutBox.appendChild(labelElement); }); updateDetails(); // Page error handling const renderAlert = alert => { const alertBox = document.getElementById('alert-box'); if (!alert.title) { alertBox.innerHTML = ''; 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', }; `, ' alertBox.innerHTML = `', `

\${alert.title}

\${alert.subTitle}

`, ' `;', ` }; // Step 4:Display the payment results at the bottom of the page. const renderPaymentResult = (paymentResult, orderId) => { const paymentResultBox = document.getElementById('payment-result'); if (!Object.keys(paymentResult).length) return null; const { title, message, icon, bgColor, borderColor } = paymentResult; `, ' paymentResultBox.innerHTML = `', `

\${title}

\${message}

`, ' `;', ` }; // Step 3: Select the rendered data according to the result of the payment. const handlePaymentStatus = (status, orderId) => { setTimeout(() => { window.location.href = './index.html'; localStorage.removeItem('supportPlan'); }, 8000); let paymentResult = {}; switch (status) { case 'SUCCESS': paymentResult = { 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': paymentResult = { 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': paymentResult = { 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: paymentResult = { 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) ', }; } renderPaymentResult(paymentResult, orderId); }; `] }, `Web-HTML-API-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`display-the-payment-result`], chunks: [` // Step 2: Get Subscription Payment Result const searchParams = new URLSearchParams(window.location.search); const resultStatus = searchParams.get('resultStatus'); if (resultStatus) { handlePaymentStatus(resultStatus); } `] }, `Web-HTML-API-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-the-antom-push-link`], chunks: [` // Step 1: Get consult data from the endpoint. const handleSubmit = async () => { document.getElementById('payment-result').innerHTML = ''; document.getElementById('submit').disabled = true; try { const url = 'http://localhost:8080/subscriptions/create'; const body = JSON.stringify({ periodCount: '4', periodType: 'YEAR', currency: selectedOption.currency, amountValue: selectedOption.amountValue, paymentMethodType: 'ALIPAY_HK', }); const response = await fetch(url, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body, }); if (!response.ok) { throw new Error('HTTP error! Status: ' + response.status); } `] }, `Web-HTML-API-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` const res = await response.json(); `] }, `Web-HTML-API-other2`), _jsx(AntomChunk, { language: `javascript`, steps: [`handle-the-redirection`], chunks: [` if ( res.status === 'success' && res.data.result.resultStatus === 'S' && res.data.normalUrl ) { location.href = res.data.normalUrl; }`] }, `Web-HTML-API-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` } catch (error) { renderAlert({ title: 'Error', subTitle: error.message || 'Failed to fetch payment session data', iconType: 'error', }); } finally { document.getElementById('submit').disabled = false; } }; document.getElementById('submit').addEventListener('click', handleSubmit); }); `] }, `Web-HTML-API-other3`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/html/index.css', when: { platform: 'Web', 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; width: 1280px; height: 800px; flex-shrink: 0; border-radius: 40px; background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .checkout-container { margin: 0 auto; width: 100%; display: flex; flex-grow: 1; } .container-left { flex: 1; background-color: #f0f6ff; display: flex; justify-content: flex-end; } .leftContent { width: 620px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; padding-top: 186px; } .detail-row { padding: 0; display: flex; width: 560px; height: 64px; margin-bottom: 8px; border: 1px solid #000; } .detail-row > div { flex: 1 1; display: flex; align-items: center; } .detail-header { border-right: 1px solid #000; padding-left: 24px; font-size: 16px; font-weight: 600; } .detail-content { justify-content: center; } .container-right { flex: 1; } .container-right .rightContent { width: 660px; height: 100%; padding: 162px 64px 76px 56px; box-sizing: border-box; } .rightContent 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; } .submit:disabled { background: #ccc; color: #666; cursor: not-allowed; } .radio-group { display: flex; flex-direction: column; } .radio-group label { display: flex; align-items: center; height: 46px; 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 */ .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 { 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 { 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/html/index.html', when: { platform: 'Web', client: 'HTML', integration_type: 'API' }, unless: { server: 'Java' }, children: _jsx(AntomFile, { language: `html`, filename: 'client/index.html', downloadOnly: false, steps: [`build-the-antom-page`], children: _jsx(AntomChunk, { language: `html`, steps: [`build-the-antom-page`], chunks: [` Subscription Payment Demo

Subscription Payment Demo

Support plan

Onboarding time

Language supported

Inquiry response time

Select the support plan you want to subscribe to

`] }, `Web-HTML-API-code1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/html/index.js', when: { platform: 'Web', client: 'HTML', integration_type: 'API' }, unless: { server: 'Java' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/index.js', downloadOnly: false, steps: [`get-the-antom-push-link`, `handle-the-redirection`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`document.addEventListener('DOMContentLoaded', () => { const paymentOptions = [ { label: 'Standard', value: 'Standard', icon: 'https://cdn.marmot-cloud.com/storage/2022/12/20/4e873d78-0f2d-4553-895e-e5392eddda39.png', amountValue: '688.80', currency: 'HKD', onboardingTime: '3-5 working days', languageSupported: 'Chinese/English', inquiryResponseTime: '< 48 hours', }, { label: 'Premium', value: 'Premium', icon: ' https://cdn.marmot-cloud.com/storage/2022/12/19/d45c0b0f-a1f3-4ca9-99c7-f0ea74c5c6ac.png', amountValue: '1088.80', currency: 'HKD', onboardingTime: '1-2 working days', languageSupported: 'Chinese/English/Japanese/Korean', inquiryResponseTime: '< 24 hours', }, ]; const initialPaymentOption = paymentOptions.find( option => option.value === (localStorage.getItem('supportPlan') || 'Standard') ) || paymentOptions[0]; let selectedOption = initialPaymentOption; function updateDetails() { document.getElementById('selected-label').innerText = selectedOption.label; document.getElementById('onboarding-time').innerText = selectedOption.onboardingTime; document.getElementById('language-supported').innerText = selectedOption.languageSupported; document.getElementById('inquiry-response-time').innerText = selectedOption.inquiryResponseTime; document.getElementById( 'submit'`, ' ).innerText = `Pay \${selectedOption.currency} \${selectedOption.amountValue}`;', ` } function handlePaymentOptionChange(value) { const option = paymentOptions.find(option => option.value === value); if (option) { selectedOption = option; localStorage.setItem('supportPlan', selectedOption.value); updateDetails(); } } function updateSelectedOption(selectedValue) { document.querySelectorAll('.payment-option').forEach(labelElement => { const radioInput = labelElement.querySelector('input'); if (radioInput.value === selectedValue) { labelElement.classList.add('selected'); radioInput.checked = true; } else { labelElement.classList.remove('selected'); } }); } // Render payment options const checkoutBox = document.getElementById('checkout-box'); paymentOptions.forEach(({ label, value }) => { const labelElement = document.createElement('label');`, ' labelElement.className = `payment-option \${', ` selectedOption.value === value ? 'selected' : ''`, ' }`;', ' labelElement.innerHTML = `', ` \${label}`, ' `;', ` labelElement.querySelector('input').addEventListener('change', event => { handlePaymentOptionChange(event.target.value); updateSelectedOption(event.target.value); }); checkoutBox.appendChild(labelElement); }); updateDetails(); // Page error handling const renderAlert = alert => { const alertBox = document.getElementById('alert-box'); if (!alert.title) { alertBox.innerHTML = ''; 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', }; `, ' alertBox.innerHTML = `', `

\${alert.title}

\${alert.subTitle}

\${title}

\${message}

`, ' `;', ` }; // Step 3: Select the rendered data according to the result of the payment. const handlePaymentStatus = (status, orderId) => { setTimeout(() => { window.location.href = './index.html'; localStorage.removeItem('supportPlan'); }, 8000); let paymentResult = {}; switch (status) { case 'SUCCESS': paymentResult = { 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': paymentResult = { 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': paymentResult = { 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: paymentResult = { 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) ', }; } renderPaymentResult(paymentResult, orderId); }; `] }, `Web-HTML-API-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`display-the-payment-result`], chunks: [` // Step 2: Get Subscription Payment Result const searchParams = new URLSearchParams(window.location.search); const resultStatus = searchParams.get('resultStatus'); if (resultStatus) { handlePaymentStatus(resultStatus); } `] }, `Web-HTML-API-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-the-antom-push-link`], chunks: [` // Step 1: Get consult data from the endpoint. const handleSubmit = async () => { document.getElementById('payment-result').innerHTML = ''; document.getElementById('submit').disabled = true; try { const url = 'http://localhost:8080/subscriptions/create'; const body = JSON.stringify({ periodCount: '4', periodType: 'YEAR', currency: selectedOption.currency, amountValue: selectedOption.amountValue, paymentMethodType: 'ALIPAY_HK', }); const response = await fetch(url, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body, }); if (!response.ok) { throw new Error('HTTP error! Status: ' + response.status); } `] }, `Web-HTML-API-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` const res = await response.json(); `] }, `Web-HTML-API-other2`), _jsx(AntomChunk, { language: `javascript`, steps: [`handle-the-redirection`], chunks: [` if ( res.status === 'success' && res.data.result.resultStatus === 'S' && res.data.normalUrl ) { location.href = res.data.normalUrl; }`] }, `Web-HTML-API-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` } catch (error) { renderAlert({ title: 'Error', subTitle: error.message || 'Failed to fetch payment session data', iconType: 'error', }); } finally { document.getElementById('submit').disabled = false; } }; document.getElementById('submit').addEventListener('click', handleSubmit); }); `] }, `Web-HTML-API-other3`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/html/index.css', when: { platform: 'Web', 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; width: 1280px; height: 800px; flex-shrink: 0; border-radius: 40px; background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .checkout-container { margin: 0 auto; width: 100%; display: flex; flex-grow: 1; } .container-left { flex: 1; background-color: #f0f6ff; display: flex; justify-content: flex-end; } .leftContent { width: 620px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; padding-top: 186px; } .detail-row { padding: 0; display: flex; width: 560px; height: 64px; margin-bottom: 8px; border: 1px solid #000; } .detail-row > div { flex: 1 1; display: flex; align-items: center; } .detail-header { border-right: 1px solid #000; padding-left: 24px; font-size: 16px; font-weight: 600; } .detail-content { justify-content: center; } .container-right { flex: 1; } .container-right .rightContent { width: 660px; height: 100%; padding: 162px 64px 76px 56px; box-sizing: border-box; } .rightContent 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; } .submit:disabled { background: #ccc; color: #666; cursor: not-allowed; } .radio-group { display: flex; flex-direction: column; } .radio-group label { display: flex; align-items: center; height: 46px; 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 */ .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 { 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 { 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/react/App.jsx', when: { platform: 'Web', client: 'React', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/src/App.jsx', downloadOnly: false, steps: [`build-the-antom-page`, `get-the-antom-push-link`, `handle-the-redirection`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import './App.css'; import { useEffect, useState } from 'react'; const paymentOptions = [ { label: 'Standard', value: 'Standard', icon: 'https://cdn.marmot-cloud.com/storage/2022/12/20/4e873d78-0f2d-4553-895e-e5392eddda39.png', amountValue: '688.80', currency: 'HKD', onboardingTime: '3-5 working days', languageSupported: 'Chinese/English', inquiryResponseTime: '< 48 hours', }, { label: 'Premium', value: 'Premium', icon: ' https://cdn.marmot-cloud.com/storage/2022/12/19/d45c0b0f-a1f3-4ca9-99c7-f0ea74c5c6ac.png', amountValue: '1088.80', currency: 'HKD', onboardingTime: '1-2 working days', languageSupported: 'Chinese/English/Japanese/Korean', inquiryResponseTime: '< 24 hours', }, ]; function App() { const initialPaymentOption = paymentOptions.find( (option) => option.value === (localStorage.getItem('supportPlan') || 'Standard') ) || paymentOptions[0]; const [selectedOption, setSelectedOption] = useState(initialPaymentOption); const [isBtnLoading, setBtnLoading] = useState(false); const [paymentResult, setPaymentResult] = useState({}); const [alert, setAlert] = useState({ title: '', subTitle: '', iconType: '', }); const handlePaymentOptionChange = (value) => { setPaymentResult({}); const option = paymentOptions.find((option) => option.value === value); if (option) { setSelectedOption(option); localStorage.setItem('supportPlan', option.value); } }; // Page error handling 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}

); }; // Step 4:Display the payment results at the bottom of the page. const renderPaymentResult = () => { if (!Object.keys(paymentResult).length) return null; const { title, message, icon, bgColor, borderColor } = paymentResult; return (

{title}

{message}

); }; // Step 3: Select the rendered data according to the result of the payment. const handlePaymentStatus = (status) => { setTimeout(() => { window.location.href = './index.html'; localStorage.removeItem('supportPlan'); }, 2000); 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) ', }); } }; `] }, `Web-React-API-other1`), _jsx(AntomChunk, { language: `javascript`, steps: [`display-the-payment-result`], chunks: [` // Step 2: Get Subscription Payment Result useEffect(() => { const searchParams = new URLSearchParams(window.location.search); const resultStatus = searchParams.get('resultStatus'); if (resultStatus) { handlePaymentStatus(resultStatus); } }, []); `] }, `Web-React-API-code4`), _jsx(AntomChunk, { language: `javascript`, steps: [`get-the-antom-push-link`], chunks: [` // Step 1: Get consult data from the endpoint. const handleSubmit = async () => { setPaymentResult({}); setBtnLoading(true); if (!selectedOption.value) { setAlert({ title: 'Warning', subTitle: 'Please select a payment method!', iconType: 'warning', }); setBtnLoading(false); return null; } try { const url = 'http://localhost:8080/subscriptions/create'; const body = JSON.stringify({ periodCount: '4', periodType: 'YEAR', currency: selectedOption.currency, amountValue: selectedOption.amountValue, paymentMethodType: 'ALIPAY_HK', }); const response = await fetch(url, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body, }); if (!response.ok) { throw new Error('HTTP error! Status: ' + response.status); } `] }, `Web-React-API-code2`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` const res = await response.json(); `] }, `Web-React-API-other2`), _jsx(AntomChunk, { language: `javascript`, steps: [`handle-the-redirection`], chunks: [` if ( res.status === 'success' && res.data.result.resultStatus === 'S' && res.data.normalUrl ) { location.href = res.data.normalUrl; }`] }, `Web-React-API-code3`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` } catch (error) { setAlert({ title: 'Error', subTitle: error.message || 'Failed to fetch payment session data', iconType: 'error', }); return null; } finally { setBtnLoading(false); } }; `] }, `Web-React-API-other3`), _jsx(AntomChunk, { language: `javascript`, steps: [`build-the-antom-page`], chunks: [` return ( <>

Subscription Payment Demo

Support plan

{selectedOption.label}

Onboarding time

{selectedOption.onboardingTime}

Language supported

{selectedOption.languageSupported}

Inquiry response time

{selectedOption.inquiryResponseTime}

Select the support plan you want to subscribe to

{paymentOptions.map( ({ label, value }) => { return ( { handlePaymentOptionChange( event.target .value ); }} checked={ selectedOption.value === value } /> {label} ); } )}

{renderPaymentResult()}

{renderAlert()}

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

); } `] }, `Web-React-API-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`export default App; `] }, `Web-React-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/react/App.css', when: { platform: 'Web', client: 'React', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/App.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; width: 1280px; height: 800px; flex-shrink: 0; border-radius: 40px; background: #fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); } .checkout-container { margin: 0 auto; width: 100%; display: flex; flex-grow: 1; } .container-left { flex: 1; background-color: #f0f6ff; display: flex; justify-content: flex-end; } .leftContent { width: 620px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; padding-top: 186px; } .detail-row { padding: 0; display: flex; width: 560px; height: 64px; margin-bottom: 8px; border: 1px solid #000; } .detail-row > div { flex: 1 1; display: flex; align-items: center; } .detail-header { border-right: 1px solid #000; padding-left: 24px; font-size: 16px; font-weight: 600; } .detail-content { justify-content: center; } .container-right { flex: 1; } .container-right .rightContent { width: 660px; height: 100%; padding: 162px 64px 76px 56px; box-sizing: border-box; } .rightContent 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; } .submit:disabled { background: #ccc; color: #666; cursor: not-allowed; } .radio-group { display: flex; flex-direction: column; } .radio-group label { display: flex; align-items: center; height: 46px; 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 */ .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 { 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 { 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/react/main.jsx', when: { platform: 'Web', client: 'React', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/main.jsx', downloadOnly: false, 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/react/index.html', when: { platform: 'Web', client: 'React', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/index.html', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` Antom Demo Checkout

`] }, `Web-React-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/react/package.json', when: { platform: 'Web', client: 'React', integration_type: 'API' }, 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": { "react": "^18.3.1", "react-dom": "^18.3.1", "react-router-dom": "^6.26.0" }, "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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/react/README.md', when: { platform: 'Web', client: 'React', integration_type: 'API' }, 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/react/vite.config.js', when: { platform: 'Web', client: 'React', integration_type: 'API' }, 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/vue/App.vue', when: { platform: 'Web', client: 'Vue', integration_type: 'API' }, children: _jsxs(AntomFile, { language: `javascript`, filename: 'client/src/App.vue', downloadOnly: false, steps: [`build-the-antom-page`, `get-the-antom-push-link`, `handle-the-redirection`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `javascript`, steps: [`build-the-antom-page`], chunks: [` `] }, `Web-Vue-API-code1`), _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` `] }, `Web-Vue-API-other3`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/vue/main.ts', when: { platform: 'Web', client: 'Vue', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/src/main.ts', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [`import { createApp } from 'vue'; import App from './App.vue'; const app = createApp(App); app.mount('#app'); `] }, `Web-Vue-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/vue/tsconfig.node.json', when: { platform: 'Web', client: 'Vue', integration_type: 'API' }, 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/vue/index.html', when: { platform: 'Web', client: 'Vue', integration_type: 'API' }, children: _jsx(AntomFile, { language: `javascript`, filename: 'client/index.html', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `javascript`, steps: [``], chunks: [` Antom Demo Checkout

`] }, `Web-Vue-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/vue/tsconfig.app.json', when: { platform: 'Web', client: 'Vue', integration_type: 'API' }, 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/vue/package.json', when: { platform: 'Web', client: 'Vue', integration_type: 'API' }, 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" }, "repository": "https://code.alipay.com/antom-example/antom-online-payment-sample-web.git" } `] }, `Web-Vue-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/vue/tsconfig.json', when: { platform: 'Web', client: 'Vue', integration_type: 'API' }, 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/web/vue/vite.config.ts', when: { platform: 'Web', client: 'Vue', integration_type: 'API' }, 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-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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/subscription_java/MainActivity.java', downloadOnly: false, steps: [`build-the-antom-page`, `get-the-antom-push-link`, `handle-the-redirection`, `listen-for-callback-addresses`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`package com.antom.subscription_java; import android.animation.AnimatorSet; import android.animation.ObjectAnimator; import android.annotation.SuppressLint; import android.content.Intent; import android.net.Uri; import android.os.Bundle; import android.text.TextUtils; import android.view.View; import android.widget.Button; import android.widget.TextView; import androidx.appcompat.app.AppCompatActivity; import com.antom.subscription_java.Common.*; import org.json.JSONObject; import java.util.concurrent.ExecutorService; import java.util.concurrent.Executors; public class MainActivity extends AppCompatActivity { SubscriptionRequest request; TextView tvAmount; Button tvPay; ExecutorService executorService = Executors.newSingleThreadExecutor(); private int selectedPlan = -1; private View btnNormal, btnPro; `] }, `Android-Java-API-other1`), _jsx(AntomChunk, { language: `java`, steps: [`build-the-antom-page`], chunks: [` @SuppressLint("SetTextI18n") @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.subscription_main); request = new SubscriptionRequest("680.80", "HKD", "ALIPAY_HK", 1, "YEAR"); tvAmount = findViewById(R.id.tv_amount); tvAmount.setText("Select the support plan you want to subscribe to "); btnNormal = findViewById(R.id.standardV); btnPro = findViewById(R.id.proV); tvPay = findViewById(R.id.tv_pay); btnNormal.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { selectedPlan = 0; updateDisplay(); } }); btnPro.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { selectedPlan = 1; updateDisplay(); } }); tvPay.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { subscriptionPayment(); } }); } private void applyScaleAnimation(View view, float startScale, float endScale) { ObjectAnimator scaleDownX = ObjectAnimator.ofFloat(view, "scaleX", startScale, endScale); ObjectAnimator scaleDownY = ObjectAnimator.ofFloat(view, "scaleY", startScale, endScale); AnimatorSet scaleDown = new AnimatorSet(); scaleDown.play(scaleDownX).with(scaleDownY); scaleDown.setDuration(500); scaleDown.start(); } void updateDisplay() { if (selectedPlan == 0) { applyScaleAnimation(btnNormal, 0.5f, 1.0f); btnPro.setScaleX(1.0f); btnPro.setScaleY(1.0f); btnNormal.setBackgroundResource(R.drawable.selectedboard); btnPro.setBackgroundResource(0); } else { applyScaleAnimation(btnPro, 0.5f, 1.0f); btnNormal.setScaleX(1.0f); btnNormal.setScaleY(1.0f); btnPro.setBackgroundResource(R.drawable.selectedboard); btnNormal.setBackgroundResource(0); } tvPay.setEnabled(selectedPlan != -1); if (selectedPlan == 0) { request.setAmountValue("680.80"); request.setPeriodType("YEAR"); } else { request.setAmountValue("1088.80"); request.setPeriodType("YEAR"); } tvPay.setText(String.format("%s PAY - %s - %s", request.getPeriodType(), request.getCurrency(), request.getAmountValue())); } `] }, `Android-Java-API-code1`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` String bodySubscriptionParamsJson() { // you can use Gson or other Json format utils return "{" + "\\"amountValue\\":\\"" + request.getAmountValue() + "\\"," + "\\"currency\\":\\"" + request.getCurrency() + "\\"," + "\\"paymentMethodType\\":\\"" + request.getPaymentMethodType() + "\\"," + "\\"periodCount\\":" + request.getPeriodCount() + "\\"," + "\\"periodType\\":\\"" + request.getPeriodType() + "\\"" + "}"; } `] }, `Android-Java-API-other2`), _jsx(AntomChunk, { language: `java`, steps: [`get-the-antom-push-link`], chunks: [` public void subscriptionPayment() { LoadingIndicator.getInstance().showLoading(this); if (selectedPlan == -1) { AlertUtils.showAlertWithMessage(this, "Select yout plan"); return; } executorService.submit(() -> { HttpService.HttpResponse response = HttpService.instance.request(HttpService.Method.POST, "/subscriptions/create", bodySubscriptionParamsJson(), null); runOnUiThread(() -> { LoadingIndicator.getInstance().dismissLoading(); if (response.getErrorMessage() != null) { AlertUtils.showAlertWithMessage(MainActivity.this, response.getErrorMessage()); } else { SubscriptionResult subscriptionResult = new SubscriptionResult( response.getResponseBody().optJSONObject("data"), response.getResponseBody().optString("paymentRequestId"), response.getResponseBody().optString("authState"), response.getResponseBody().optString("status"), response.getResponseBody().optString("message")); subscriptionUrlProcess(subscriptionResult); } }); }); } `] }, `Android-Java-API-code2`), _jsx(AntomChunk, { language: `java`, steps: [`handle-the-redirection`], chunks: [` private void subscriptionUrlProcess(SubscriptionResult result) { JSONObject data = result.getData(); if (data == null) { AlertUtils.showAlertWithMessage(this, "No data in SubscriptionResult"); return; } 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); 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); 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); startActivity(intent, null); } catch (Exception e) { AlertUtils.showAlertWithMessage(this, "Fail to redirect"); } } `] }, `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();`] }, `Android-Java-API-code4`), _jsx(AntomChunk, { language: `java`, steps: [`display-the-payment-result`], chunks: [` if (uri != null) { String subscriptionRequestId = uri.getQueryParameter("subscriptionRequestId"); String resultStatus = uri.getQueryParameter("resultStatus"); AlertUtils.showAlertWithMessage(this, String.format("%s%s", subscriptionRequestId, resultStatus)); }`] }, `Android-Java-API-code5`), _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` } } `] }, `Android-Java-API-other4`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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/subscription_java/Common.java', downloadOnly: false, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`package com.antom.subscription_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 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 HttpResponse request(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 == 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 HttpResponse(jsonObject); } else { return new HttpResponse(responseMessage.isEmpty() ? "Failed" : responseMessage); } } catch (Exception e) { e.printStackTrace(); return new 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; } } public static class SubscriptionRequest { private final String paymentMethodType; private String amountValue; private String currency; private Integer periodCount; private String periodType; public SubscriptionRequest( String amountValue, String currency, String paymentMethodType, Integer periodCount, String periodType ) { this.amountValue = amountValue; this.currency = currency; this.paymentMethodType = paymentMethodType; this.periodCount = periodCount; this.periodType = periodType; } public Integer getPeriodCount() { return periodCount; } public void setPeriodCount(Integer periodCount) { this.periodCount = periodCount; } public String getPeriodType() { return periodType; } public void setPeriodType(String periodType) { this.periodType = periodType; } public String getAmountValue() { return amountValue; } public void setAmountValue(String amountValue) { this.amountValue = amountValue; } public String getCurrency() { return currency; } public void setCurrency(String currency) { this.currency = currency; } public String getPaymentMethodType() { return paymentMethodType; } } public static class SubscriptionResult { private final JSONObject data; private final String paymentRequestId; private final String authState; private final String status; private final String message; public SubscriptionResult(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; } } } `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/android/java/AndroidManifest.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/AndroidManifest.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [`

`] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/android/java/standard.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/standard.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/android/java/boarddash.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/boarddash.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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/subscription/files/android/java/pro.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/drawable/pro.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `Android-Java-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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/subscription/files/android/java/subscription_main.xml', when: { platform: 'Android', client: 'Java', integration_type: 'API' }, children: _jsx(AntomFile, { language: `java`, filename: 'client/src/main/res/layout/subscription_main.xml', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `java`, steps: [``], chunks: [` `] }, `iOS-Objective-C-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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-antom-page`, `get-the-antom-push-link`, `handle-the-redirection`], children: [_jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`import UIKit `] }, `iOS-Swift-API-other1`), _jsx(AntomChunk, { language: `swift`, steps: [`build-the-antom-page`], chunks: [`class ViewController: UIViewController { @IBOutlet weak var standardTopV: UIView! @IBOutlet weak var premiunmTopV: UIView! @IBOutlet weak var btncheckout: UIButton! @IBOutlet weak var standardV: UIStackView! @IBOutlet weak var premiumV: UIStackView! var planType: Int = -1 lazy var subrequest: [String:Any] = { return ["periodCount":1,"periodType":"YEAR","currency":"HKD","amountValue":"688.80","paymentMethodType":"ALIPAY_HK"] }() override func viewDidLoad() { super.viewDidLoad() setUpView() } func setUpView() { self.planType = -1 addLayerForView(from:UIColor.init(red: 229/255.0, green: 230/255.0, blue: 227/255.0, alpha: 1), to: UIColor.init(red: 172/255.0, green: 172/255.0, blue: 172/255.0, alpha: 1), v:self.standardTopV) addLayerForView(from:UIColor.init(red: 237/255.0, green: 220/255.0, blue: 170/255.0, alpha: 1), to: UIColor.init(red: 203/255.0, green: 179/255.0, blue: 111/255.0, alpha: 1), v:self.premiunmTopV) standardV.clipsToBounds = true standardV.layer.borderWidth = 2 premiumV.clipsToBounds = true premiumV.layer.borderWidth = 2 premiumV.layer.borderColor = UIColor.clear.cgColor standardV.layer.borderColor = UIColor.clear.cgColor btncheckout.addTarget(self, action: #selector(subscribePayment), for: .touchUpInside) let tap1 = UITapGestureRecognizer(target: self, action: #selector(selectPlan)) let tap2 = UITapGestureRecognizer(target: self, action: #selector(selectPlan)) standardV.addGestureRecognizer(tap1) premiumV.addGestureRecognizer(tap2) } func addLayerForView(from:UIColor,to:UIColor,v: UIView) { let gradientLayer = CAGradientLayer() gradientLayer.colors = [from.cgColor, to.cgColor] gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.0) gradientLayer.endPoint = CGPoint(x: 1.0, y: 1.0) gradientLayer.frame = v.bounds v.layer.insertSublayer(gradientLayer, at: 0) } func updateCheckoutDisplay(request: [String:Any]) { btncheckout.backgroundColor = planType == -1 ? UIColor.gray : UIColor.blue let title = planType == -1 ? "Pay" : "Pay \\(String(describing: request["currency"] as! String))-\\(String(describing: request["amountValue"] as! String))" btncheckout.setTitle(title, for: .normal) } @objc func selectPlan(_ tap: UITapGestureRecognizer) { if tap.view?.tag == 0 { standardV.layer.borderColor = UIColor(red: 234.0/255.0, green: 221/255.0, blue: 176/255.0, alpha: 1).cgColor premiumV.layer.borderColor = UIColor.clear.cgColor subrequest["amountValue"] = "688.80" } else { premiumV.layer.borderColor = UIColor(red: 234.0/255.0, green: 221/255.0, blue: 176/255.0, alpha: 1).cgColor standardV.layer.borderColor = UIColor.clear.cgColor subrequest["amountValue"] = "1088.80" } UIView.animate(withDuration: 0.5) { tap.view?.transform = CGAffineTransform(scaleX: 0.5, y: 0.5) tap.view?.transform = CGAffineTransform.identity tap.view?.alpha = 0.5 tap.view?.alpha = 1 } planType = tap.view?.tag ?? -1 updateCheckoutDisplay(request: subrequest) } func dicWithPaymethod(plan: [String:Any]) -> [String: Any?] { return [ "amountValue": plan["amountValue"] , "currency": plan["currency"], "paymentMethodType": plan["paymentMethodType"], "periodCount": 1, "periodType": "YEAR" // or MONTH ] } `] }, `iOS-Swift-API-code1`), _jsx(AntomChunk, { language: `swift`, steps: [`get-the-antom-push-link`], chunks: [` @objc func subscribePayment() { if planType == -1 { AlterUtils.showAlertWithMessage("Select your Plan First") return } LoadingIndicator.sharedInstance.showLoading(in: self.view) HttpService.sharedInstance.request(method: HttpMethod.POST, urlPath: "/subscriptions/create", body: dicWithPaymethod(plan: subrequest), requestParam: nil) { response in DispatchQueue.main.async { LoadingIndicator.sharedInstance.dismissLoading() if let errorMessage = response.errorMessage { print("Antom --- Error: \\(errorMessage)") AlterUtils.showAlertWithMessage(errorMessage) } else if let data = response.responseBody?["data"] as? [String: Any] { if let schemeUrl = data["schemeUrl"] as? String { self.schemeUrlRedirect(schemeUrl: schemeUrl, appLinkUrl: data["applinkUrl"] as? String, normalUrl: data["normalUrl"] as? String) } else { AlterUtils.showAlertWithMessage("No data available") } } } } } `] }, `iOS-Swift-API-code2`), _jsx(AntomChunk, { language: `swift`, steps: [`handle-the-redirection`], chunks: [` func schemeUrlRedirect(schemeUrl: String, appLinkUrl: String?, normalUrl: String?) { guard let url = URL(string: schemeUrl) else { appLinkUrlRedirect(appLinkUrl: appLinkUrl, normalUrl: normalUrl) return } UIApplication.shared.open(url, options: [:], completionHandler: nil) } `] }, `iOS-Swift-API-code3`), _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` func appLinkUrlRedirect(appLinkUrl: String?, normalUrl: String?) { guard let url = URL(string: appLinkUrl ?? "") else { normalUrlRedirect(normalUrl: normalUrl) return } UIApplication.shared.open(url, options: [:], completionHandler: nil) } func normalUrlRedirect(normalUrl: String?) { guard let url = URL(string: normalUrl ?? "") else { AlterUtils.showAlertWithMessage("Fail to redirect") return } UIApplication.shared.open(url, options: [:], completionHandler: nil) } } `] }, `iOS-Swift-API-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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`, `display-the-payment-result`], children: [_jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`// // AppDelegate.swift // subscription_payment_swift // // Created by on 2024/10/14. // 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 == "subscription" { handleSubRedirectUrl(url) } return true } `] }, `iOS-Swift-API-code1`), _jsx(AntomChunk, { language: `swift`, steps: [`display-the-payment-result`], chunks: [` func handleSubRedirectUrl(_ url: URL) { if let components = URLComponents(url: url, resolvingAgainstBaseURL: false) { var queryItemsDict = [String: String]() for item in components.queryItems ?? [] { queryItemsDict[item.name] = item.value } guard let subscriptionRequestId = queryItemsDict["subscriptionRequestId"], let resultStatus = queryItemsDict["resultStatus"] else { AlterUtils.showAlertWithMessage("subscriptionRequestId resultStatus and can not be nil") return } if resultStatus == "SUCCESS" { AlterUtils.showAlertWithMessage("Subscription Success \\n\\(subscriptionRequestId)") } else { AlterUtils.showAlertWithMessage("Subscription Failed \\n\\(subscriptionRequestId)") } } } `] }, `iOS-Swift-API-code2`), _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` } `] }, `iOS-Swift-API-other2`)] }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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 } } } extension CALayer { @IBInspectable var borderUIColor: UIColor { get { return UIColor(cgColor: self.borderColor!) } set { self.borderColor = newValue.cgColor } } } 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) } } `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/ios/swift/ViewController.swift', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/ViewController.swift', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`import UIKit class ViewController: UIViewController { @IBOutlet weak var standardTopV: UIView! @IBOutlet weak var premiunmTopV: UIView! @IBOutlet weak var btncheckout: UIButton! @IBOutlet weak var standardV: UIStackView! @IBOutlet weak var premiumV: UIStackView! var planType: Int = -1 lazy var subrequest: [String:Any] = { return ["periodCount":1,"periodType":"YEAR","currency":"HKD","amountValue":"688.80","paymentMethodType":"ALIPAY_HK"] }() override func viewDidLoad() { super.viewDidLoad() setUpView() } func setUpView() { self.planType = -1 addLayerForView(from:UIColor.init(red: 229/255.0, green: 230/255.0, blue: 227/255.0, alpha: 1), to: UIColor.init(red: 172/255.0, green: 172/255.0, blue: 172/255.0, alpha: 1), v:self.standardTopV) addLayerForView(from:UIColor.init(red: 237/255.0, green: 220/255.0, blue: 170/255.0, alpha: 1), to: UIColor.init(red: 203/255.0, green: 179/255.0, blue: 111/255.0, alpha: 1), v:self.premiunmTopV) standardV.clipsToBounds = true standardV.layer.borderWidth = 2 premiumV.clipsToBounds = true premiumV.layer.borderWidth = 2 premiumV.layer.borderColor = UIColor.clear.cgColor standardV.layer.borderColor = UIColor.clear.cgColor btncheckout.addTarget(self, action: #selector(subscribePayment), for: .touchUpInside) let tap1 = UITapGestureRecognizer(target: self, action: #selector(selectPlan)) let tap2 = UITapGestureRecognizer(target: self, action: #selector(selectPlan)) standardV.addGestureRecognizer(tap1) premiumV.addGestureRecognizer(tap2) } func addLayerForView(from:UIColor,to:UIColor,v: UIView) { let gradientLayer = CAGradientLayer() gradientLayer.colors = [from.cgColor, to.cgColor] gradientLayer.startPoint = CGPoint(x: 0.0, y: 0.0) gradientLayer.endPoint = CGPoint(x: 1.0, y: 1.0) gradientLayer.frame = v.bounds v.layer.insertSublayer(gradientLayer, at: 0) } func updateCheckoutDisplay(request: [String:Any]) { btncheckout.backgroundColor = planType == -1 ? UIColor.gray : UIColor.blue let title = planType == -1 ? "Pay" : "Pay \\(String(describing: request["currency"] as! String))-\\(String(describing: request["amountValue"] as! String))" btncheckout.setTitle(title, for: .normal) } @objc func selectPlan(_ tap: UITapGestureRecognizer) { if tap.view?.tag == 0 { standardV.layer.borderColor = UIColor(red: 234.0/255.0, green: 221/255.0, blue: 176/255.0, alpha: 1).cgColor premiumV.layer.borderColor = UIColor.clear.cgColor subrequest["amountValue"] = "688.80" } else { premiumV.layer.borderColor = UIColor(red: 234.0/255.0, green: 221/255.0, blue: 176/255.0, alpha: 1).cgColor standardV.layer.borderColor = UIColor.clear.cgColor subrequest["amountValue"] = "1088.80" } UIView.animate(withDuration: 0.5) { tap.view?.transform = CGAffineTransform(scaleX: 0.5, y: 0.5) tap.view?.transform = CGAffineTransform.identity tap.view?.alpha = 0.5 tap.view?.alpha = 1 } planType = tap.view?.tag ?? -1 updateCheckoutDisplay(request: subrequest) } func dicWithPaymethod(plan: [String:Any]) -> [String: Any?] { return [ "amountValue": plan["amountValue"] , "currency": plan["currency"], "paymentMethodType": plan["paymentMethodType"], "periodCount": 1, "periodType": "YEAR" // or MONTH ] } @objc func subscribePayment() { if planType == -1 { AlterUtils.showAlertWithMessage("Select your Plan First") return } LoadingIndicator.sharedInstance.showLoading(in: self.view) HttpService.sharedInstance.request(method: HttpMethod.POST, urlPath: "/subscriptions/create", body: dicWithPaymethod(plan: subrequest), requestParam: nil) { response in DispatchQueue.main.async { LoadingIndicator.sharedInstance.dismissLoading() if let errorMessage = response.errorMessage { print("Antom --- Error: \\(errorMessage)") AlterUtils.showAlertWithMessage(errorMessage) } else if let data = response.responseBody?["data"] as? [String: Any] { if let schemeUrl = data["schemeUrl"] as? String { self.schemeUrlRedirect(schemeUrl: schemeUrl, appLinkUrl: data["applinkUrl"] as? String, normalUrl: data["normalUrl"] as? String) } else { AlterUtils.showAlertWithMessage("No data available") } } } } } func schemeUrlRedirect(schemeUrl: String, appLinkUrl: String?, normalUrl: String?) { guard let url = URL(string: schemeUrl) else { appLinkUrlRedirect(appLinkUrl: appLinkUrl, normalUrl: normalUrl) return } UIApplication.shared.open(url, options: [:], completionHandler: nil) } func appLinkUrlRedirect(appLinkUrl: String?, normalUrl: String?) { guard let url = URL(string: appLinkUrl ?? "") else { normalUrlRedirect(normalUrl: normalUrl) return } UIApplication.shared.open(url, options: [:], completionHandler: nil) } func normalUrlRedirect(normalUrl: String?) { guard let url = URL(string: normalUrl ?? "") else { AlterUtils.showAlertWithMessage("Fail to redirect") return } UIApplication.shared.open(url, options: [:], completionHandler: nil) } } `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/ios/swift/subscription_payment_swift_Bridge.h', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/subscription_payment_swift_Bridge.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/ios/swift/Common.swift', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/Common.swift', downloadOnly: true, 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 } } } extension CALayer { @IBInspectable var borderUIColor: UIColor { get { return UIColor(cgColor: self.borderColor!) } set { self.borderColor = newValue.cgColor } } } 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) } } `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/ios/swift/AppDelegate.swift', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/AppDelegate.swift', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [`// // AppDelegate.swift // subscription_payment_swift // // Created by on 2024/10/14. // import UIKit @main class AppDelegate: UIResponder, UIApplicationDelegate { var window: UIWindow? func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool { // custom scheme logic print("----\\(url)") if url.scheme == "subscription" { handleSubRedirectUrl(url) } return true } func handleSubRedirectUrl(_ url: URL) { if let components = URLComponents(url: url, resolvingAgainstBaseURL: false) { var queryItemsDict = [String: String]() for item in components.queryItems ?? [] { queryItemsDict[item.name] = item.value } guard let subscriptionRequestId = queryItemsDict["subscriptionRequestId"], let resultStatus = queryItemsDict["resultStatus"] else { AlterUtils.showAlertWithMessage("subscriptionRequestId resultStatus and can not be nil") return } if resultStatus == "SUCCESS" { AlterUtils.showAlertWithMessage("Subscription Success \\n\\(subscriptionRequestId)") } else { AlterUtils.showAlertWithMessage("Subscription Failed \\n\\(subscriptionRequestId)") } } } } `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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 subscription `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/files/ios/swift/subscription_payment_swift_Bridge.h', when: { platform: 'iOS', client: 'Swift', integration_type: 'API' }, children: _jsx(AntomFile, { language: `swift`, filename: 'client/subscription_payment_swift_Bridge.h', downloadOnly: true, steps: [], children: _jsx(AntomChunk, { language: `swift`, steps: [``], chunks: [` `] }, `iOS-Swift-API-other1`) }) }), _jsx(AntomPartial, { file: 'integration-builder/subscription/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 subscription `] }, `iOS-Swift-API-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."); }

快速开始