> For the complete documentation index, see [llms.txt](https://docs.coda.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.coda.co/https-coda-payments.gitbook.io-zhong-wen-coda-private-technical-documentation/codapay/zhi-fu-ye-mian-api-ji-cheng/zhan-shi-zhi-fu-ye-mian.md). # 展示支付页面 可选必填生产沙盒有几种方法可以显示支付页面： * 在现有页面内重定向 * 在新标签页中打开 * 嵌入 iFrame 内 * 在 Webview中显示 ### 前置条件 * 您已在[发起支付请求](/https-coda-payments.gitbook.io-zhong-wen-coda-private-technical-documentation/codapay/zhi-fu-ye-mian-api-ji-cheng/fa-qi-zhi-fu-qing-qiu.md)后成功获取 订单 ID。 ## 详情 ### 接口 URL
环境接口 URL
沙盒https://sandbox.codapayments.com/airtime/begin
正式https://airtime.codapayments.com/airtime/begin
### 参数
参数必要描述
txn_id必填您在发起支付后收集到的Coda订单ID
browser_type可选

如果您的用户使用移动设备，则需要传递browser_type=mobile-web，以确保支付页面针对该设备进行了优化。

如果传递了其他值或未传递任何值，则默认会优化为桌面端

utm_souce可选例：utm_source=google，utm_source=coda
utm_medium可选例：utm_medium=banner，utm_medium=email
utm_campaign可选例：utm_campaign=spring_sale，utm_campaign=new_season_launch
utm_content可选例：utm_content=banner，utm_content=email
## 示例 {% tabs %} {% tab title="沙盒环境中的桌面端" %} ``` https://sandbox.codapayments.com/airtime/begin?txn_id=7144594637002072212&utm_source=testing ``` {% endtab %} {% tab title="生产环境中的移动端" %} ``` https://airtime.codapayments.com/airtime/begin?txn_id=7144594637002072212&browser_type=mobile-web&utm_source=facebook ``` {% endtab %} {% endtabs %} ## 在支付页面解锁营销分析 我们的支付页面**支持营销分析**。您可以将 **UTM 参数** 从您的商店页面传递到 **Codapay 页面**。这些 UTM 参数将用于 **支付漏斗数据分析** 以及 **营销渠道归因分析**。 **我们建议您直接传递 UTM 参数**，无需修改，以确保托管支付页面收集的分析数据可以与您的网页上收集的其他分析数据（例如 **Google Analytics**）一致，避免数据偏差。 例如： 用户通过以下带有UTM追踪的URL访问您的页面： {% code fullWidth="false" %} ``` https://game.webstore.com?utm_source=google&utm_medium=cpc&utm_campaign=123412341234&utm_content=creative_123 ``` {% endcode %} 当用户进行购买时，您可以将这些UTM参数与其他必填的URL参数一起传递到Codapay页面的URL： {% code fullWidth="false" %} ``` https://airtime.codapayments.com/airtime/begin?txn_id=7144594637002072212&browser_type=mobile-web&utm_source=google&utm_medium=cpc&utm_campaign=123412341234&utm_content=creative_123 ``` {% endcode %} ## Webview 注意事项 某些支付渠道可能会将用户重定向到其钱包应用。为了在使用 **WebView** 时正确处理重定向，您需要使用 [**WebViewClient.shouldOverrideUrlLoading**](https://developer.android.com/reference/android/webkit/WebViewClient#shouldOverrideUrlLoading\(android.webkit.WebView,%20java.lang.String\)) 并配合以下 **Intent** 进行处理： | 地区 | 渠道 | 覆盖URL | 仅支持外部浏览器 | | ------------- | ---------- | --------------------------------------- | -------------------- | | Brazil | PicPay | picpay:// | | | Brazil | AmeDigital | amedigital:// | | | Indonesia | GO-PAY | gojek:// | | | Indonesia | Shopee Pay |

shopeeid:// &
shopeepayid://

| | | Indonesia | Dana | danaid:// & market://details?id=id.dana | | | Malaysia | GrabPay | grab:// | | | Malaysia | Shopee Pay | shopeepaymy:// | | | Malaysia | Maxis | sms:32083 | | | Malaysia | - | - | U Mobile | | Singapore | GrabPay | grab:// | | | Philippines | GrabPay | grab:// | | | Philippines | GCash | gcash:// | | | Thailand | Shopee Pay | intent:// | | | Taiwan | Line Pay | intent:// | | | Myanmar | KBZPay | intent:// | | | United States | Cash App | cashme:// | | | Vietnam | MoMo | momo:// | | | All countries | - | - | Google Pay/Apple Pay | ## 常见Webview问题和建议
Android WebView 配置 在使用 Android 的 WebView 时，请按如下方式配置 WebViewClient： **重写 onCreateWindow 方法：** ``` override fun onCreateWindow(view: WebView, dialog: Boolean, userGesture: Boolean, resultMsg: Message): Boolean { val newWebView = WebView(view.context) view.webViewClient?.let { newWebView.webViewClient = it } val webSettings = newWebView.settings setWebSettings(webSettings) (resultMsg.obj as WebView.WebViewTransport).webView = newWebView resultMsg.sendToTarget() return true } ``` **建立 WebView 设置：** ``` fun setWebSettings(webSettings: WebSettings) { webSettings.javaScriptEnabled = true webSettings.setSupportMultipleWindows(true) webSettings.domStorageEnabled = true webSettings.loadsImagesAutomatically = true webSettings.mediaPlaybackRequiresUserGesture = false webSettings.cacheMode = WebSettings.LOAD_DEFAULT } ```
ERR_UNKNOWN_URL_SCHEME **原因分析** WebView 只识别标准的 URL 协议，如 http 和 https。对于自定义协议（如 weixin:// 和 qunaraphone://），WebView 无法识别，导致出现错误 `ERR_UNKNOWN_URL_SCHEME`。该错误表明 WebView 无法处理支付渠道提供的自定义协议。 **解决方案** 为处理自定义 URL 协议，您需要重写 `WebViewClient` 中的 `shouldOverrideUrlLoading` 方法。该方法允许您拦截并管理 WebView 中的 URL 加载行为，确保自定义协议得到正确处理。 **实现步骤** * 在您的 `WebViewClient` 类中实现 `shouldOverrideUrlLoading(WebView view, String url)` 方法。 * 配置该方法以拦截 URL 并处理自定义协议： * 返回 `true`：当 URL 使用自定义协议时，表明 WebView 不应处理该 URL，并允许您根据需要处理它。 * 返回 `false`：对于标准协议（http, https），允许 WebView 按常规加载 URL。 示例实现： ```kotlin override fun shouldOverrideUrlLoading(view: WebView?, url: String?): Boolean { if (url != null && url.startsWith("customscheme://")) { // 处理自定义协议 return true } return false // 默认行为，处理标准协议 } ``` 通过实现此方法，您可以确保自定义 URL 协议根据应用需求正确重定向或处理，从而避免 `ERR_UNKNOWN_URL_SCHEME` 错误。
Webview导致的屏幕旋转问题 屏幕旋转可能导致WebView页面刷新并出现错误，影响应用的稳定性。 **解决方案** 为了防止在屏幕旋转时活动重启，您可以在`AndroidManifest.xml`中添加以下配置： 
<activity
    android:configChanges="orientation|screenSize|keyboardHidden"/>
这将确保在屏幕旋转过程中，活动(Event)保持稳定，避免不必要的重启和页面刷新问题。
iOS WebView (about:blank) 问题 在 iOS WebView 中处理 `about:blank` 页面时，您可以通过实现 `WKUIDelegate` 委托，并将其设置为 `_webview.uiDelegate` 来解决此问题。然后，您需要实现以下方法： ```java -(WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures { if (!navigationAction.targetFrame.isMainFrame) { [webView loadRequest:navigationAction.request]; } return nil; } ``` **解决方案说明** * **实现 `WKUIDelegate`**: `WKUIDelegate` 协议用于处理与 WebView UI 相关的任务。 * **处理新的窗口请求**: 如果请求的目标框架不是主框架（即 `navigationAction.targetFrame.isMainFrame` 为 `NO`），则通过 `loadRequest` 方法将该请求加载到 WebView 中。这可以防止新窗口打开，解决 `about:blank` 的问题。
iOS WebView (捕获重定向 URL) 由于 `WKWebView` 位于 iOS 系统级别，并且无法通过 API 直接进入或修改。因受 iOS 的严格限制，为了捕获重定向 URL，我们建议使用以下方法： ``` func webView(_ webView: WKWebView, createWebViewWith configuration: WKWebViewConfiguration, for navigationAction: WKNavigationAction, windowFeatures: WKWindowFeatures) -> WKWebView? { if navigationAction.targetFrame == nil { webView.load(navigationAction.request) } return nil } ``` **解决方案说明** 1. **`navigationAction.targetFrame == nil`**：此条件判断确保了当目标框架不存在时（通常发生在页面重定向时），WebView 会加载新的请求，而不是默认的行为。 2. **避免窗口打开**：当 `targetFrame` 为 `nil` 时，WebView 会加载请求，避免弹出新窗口，确保重定向 URL 的正确捕获。 此方法有助于捕获并处理所有来自 WebView 的重定向请求。
--- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://docs.coda.co/https-coda-payments.gitbook.io-zhong-wen-coda-private-technical-documentation/codapay/zhi-fu-ye-mian-api-ji-cheng/zhan-shi-zhi-fu-ye-mian.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.