> ## Documentation Index
> Fetch the complete documentation index at: https://primer.io/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# WeChat Pay via Nomupay

> Let customers pay using WeChat Pay via Nomupay across 74 countries.

WeChat Pay via Nomupay targets Chinese consumers globally, available in 74 countries with support for 17 currencies including AUD, CAD, CHF, EUR, GBP, JPY, USD, and more. Payments are redirect-based — no capture or void is supported. Nomupay maintains separate regional accounts; confirm which account covers your target region.

| One off payment | Refunds | Recurring | Cancel |
| - | - | - | - |
| ✓ | ✓ | x | x |

> [!NOTE]
>
> For merchants on the Hong Kong Nomupay account, only a single full refund is supported — partial refunds are not available.

> [!NOTE]
>
> Nomupay uses separate accounts per region. Confirm with Nomupay which regional account is needed for your markets.

## Get started with WeChat Pay via Nomupay

### Before you begin

If this is your first payment method, follow the [Get started guide](https://primer.io/docs/get-started/overview.md) to begin processing payments with Primer.

### Configure in the Dashboard

1. **Add Nomupay to your Dashboard**\

   Go to [Integrations](https://dashboard.primer.io/integrations), click **New Integration**, and search for Nomupay. Enter your Nomupay credentials.

2. **Activate on the Checkout**\

   Go to [Checkout](https://dashboard.primer.io/checkout) and activate WeChat Pay.

3. **Configure a Workflow**\

   Ensure a Workflow with an **Authorization** action is set up to process APMs.

### Prepare the client session

Pass the following fields in addition to the standard `orderId`, `currencyCode`, `amount`, and `customer` fields.

| Parameter | Required | Description |
| - | - | - |
| `paymentMethod.descriptor` | ✓ | Merchant descriptor shown in the WeChat Pay checkout. Required by Nomupay. |

## Prepare the SDK for payments

**Web**

> [!NOTE]
>
> Use the payment method type `NOMUPAY_WECHAT_PAY` wherever the code below references `YOUR_PAYMENT_METHOD_TYPE`.

**Primer Checkout (recommended)**

Primer Checkout is our latest web SDK, built around declarative web components. Once WeChat Pay is enabled in your [Dashboard](https://dashboard.primer.io/checkout), the default `<primer-checkout>` layout renders it automatically alongside your other methods — no payment-method-specific markup is required.

```html theme={"dark"}
<primer-checkout client-token="your-client-token"></primer-checkout>
```

#### Custom layouts

Only reach for [primer-payment-method](https://primer.io/docs/sdk/primer-checkout-web/components/primer-payment-method.md) if you're building a custom layout and need to place WeChat Pay at a specific position. The element only renders when the type is enabled in your Dashboard and returned by the server for this checkout.

```html theme={"dark"}
<primer-checkout client-token="your-client-token">
  <primer-main slot="main">
    <div slot="payments">
      <primer-payment-method type="YOUR_PAYMENT_METHOD_TYPE"></primer-payment-method>
    </div>
  </primer-main>
</primer-checkout>
```

For dynamic rendering based on what the server returns, listen to [primer:methods-update](https://primer.io/docs/sdk/primer-checkout-web/events-reference.md) or use [primer-payment-method-container](https://primer.io/docs/sdk/primer-checkout-web/components/primer-payment-method-container.md) for declarative filtering.

**Universal Checkout (legacy)**

##### Set up redirects

If WeChat Pay can't be shown in a popup, Universal Checkout redirects the customer back to your site using the `returnUrl` passed in the `redirect` options. See [Handle redirects & deep links](https://primer.io/docs/sdk/web/v2.x.x/handle-redirects-and-deeplinks.md#set-up-redirects) for the full flow.

```typescript theme={"dark"}
const options = {
  container: "#checkout-container",
  redirect: {
    returnUrl: "https://mystore.com/checkout",
  },
  onCheckoutComplete({ payment }) {
    console.log("Checkout complete.", payment);
  },
};
```

##### Show Universal Checkout

WeChat Pay is automatically presented when calling [Primer.showUniversalCheckout](https://primer.io/docs/sdk/web/v2.x.x/primer/methods/showUniversalCheckout.md).

```typescript theme={"dark"}
import { Primer } from "@primer-io/checkout-web";

try {
  await Primer.showUniversalCheckout(clientToken, options);
} catch (e) {
  // handle error
}
```

Check the [customization guide](https://primer.io/docs/checkout/drop-in/customization.md#styling-payment-method-button) to learn how to customize payment method buttons.

**Headless Universal Checkout (legacy)**

Create a `RedirectPaymentMethodManager` for WeChat Pay using [createPaymentMethodManager](https://primer.io/docs/sdk/web/v2.x.x/primer-headless-checkout/methods/createPaymentMethodManager.md#redirect), then call `start()` to begin the redirect flow.

```typescript theme={"dark"}
const manager = await headless.createPaymentMethodManager("YOUR_PAYMENT_METHOD_TYPE");

if (manager) {
  manager.addEventListener("click", () => {
    // Optional: run custom logic before the redirect flow starts.
  });

  await manager.start();
}
```

Refer to the full guide for [handling payment methods with redirect](https://primer.io/docs/checkout/headless.md#step-4c-handle-payment-methods-with-redirect).

**iOS**

> [!NOTE]
>
> Use the payment method type `NOMUPAY_WECHAT_PAY` wherever the code below references `YOUR_PAYMENT_METHOD_TYPE`.

#### Set up redirects

Redirect-based payment methods present a webpage or open a third-party app for the customer to authorize the payment. To return to your app once the customer has authorized the payment, include the `urlScheme` parameter when configuring `PrimerPaymentMethodOptions`.

```swift theme={"dark"}
let settings = PrimerSettings(
  // ...
  paymentMethodOptions: PrimerPaymentMethodOptions(
    urlScheme: "your-url-scheme://" // e.g. primer://, yourscheme://
  )
  // ...
)
```

When the customer is redirected back to your app, iOS calls `application(_:continue:restorationHandler:)`. Forward the call to the Primer SDK so the checkout can continue the flow.

```swift theme={"dark"}
import PrimerSDK
import UIKit

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {
  // ...
  func application(
    _ application: UIApplication,
    continue userActivity: NSUserActivity,
    restorationHandler: @escaping ([UIUserActivityRestoring]?) -> Void
  ) -> Bool {
    return Primer.shared.application(
      application,
      continue: userActivity,
      restorationHandler: restorationHandler
    )
  }
}
```

#### Show the payment method

**Universal Checkout (drop-in)**

WeChat Pay is automatically presented when calling [Primer.shared.showUniversalCheckout](https://primer.io/docs/sdk/ios/v2.x.x/primer/methods/showUniversalCheckout.md).

```swift theme={"dark"}
class MyViewController: UIViewController {
  func startUniversalCheckout() {
    Primer.shared.showUniversalCheckout(clientToken: self.clientToken)
  }
}
```

Check the [customization guide](https://primer.io/docs/checkout/drop-in/customization.md#styling-payment-method-button) to learn how to customize payment method buttons.

**Headless Universal Checkout**

WeChat Pay requires a [Native UI Manager](https://primer.io/docs/checkout/headless.md#native-ui-manager) to be presented to the customer.

```swift theme={"dark"}
// 👇 Create the payment method manager
let nativeUIPaymentMethodManager = try PrimerHeadlessUniversalCheckout.NativeUIManager(
  paymentMethodType: "YOUR_PAYMENT_METHOD_TYPE"
)

// 👇 Show the payment method
try nativeUIPaymentMethodManager.showPaymentMethod(intent: .checkout)
```

See [NativeUIManager.init](https://primer.io/docs/sdk/ios/v2.x.x/primer-headless-checkout/native-ui-manager/init.md) for the full API. As many redirect-based payment methods share this approach, we recommend centralizing the implementation — see the worked example in the [Native UI Manager guide](https://primer.io/docs/checkout/headless.md#native-ui-manager).

**Android**

> [!NOTE]
>
> Use the payment method type `NOMUPAY_WECHAT_PAY` wherever the code below references `YOUR_PAYMENT_METHOD_TYPE`.

**Universal Checkout (drop-in)**

WeChat Pay is automatically presented when calling [Primer.instance.showUniversalCheckout](https://primer.io/docs/sdk/android/v2.x.x/primer/methods/showUniversalCheckout.md).

```kotlin theme={"dark"}
class CheckoutActivity : AppCompatActivity() {
  private fun setupObservers() {
    viewModel.clientToken.observe(this) { clientToken ->
      showUniversalCheckout(clientToken)
    }
  }

  private fun showUniversalCheckout(clientToken: String) {
    Primer.instance.showUniversalCheckout(this, clientToken)
  }
}
```

Check the [customization guide](https://primer.io/docs/checkout/drop-in/customization.md#styling-payment-method-button) to learn how to customize payment method buttons.

**Headless Universal Checkout**

WeChat Pay requires a [Native UI Manager](https://primer.io/docs/checkout/headless.md#native-ui-manager) to be presented to the customer.

```kotlin theme={"dark"}
// 👇 Create the payment method manager
val nativeUiManager = PrimerHeadlessUniversalCheckoutNativeUiManager.newInstance("YOUR_PAYMENT_METHOD_TYPE")

// 👇 Show the payment method
nativeUiManager.showPaymentMethod(this, PrimerSessionIntent.CHECKOUT)
```

See [NativeUiManager.newInstance](https://primer.io/docs/sdk/android/v2.x.x/primer-headless-checkout/native-ui-manager/newInstance.md) for the full API. As many redirect-based payment methods share this approach, we recommend centralizing the implementation — see the worked example in the [Native UI Manager guide](https://primer.io/docs/checkout/headless.md#native-ui-manager).

## Go live

Use production Nomupay credentials. Ensure the correct regional Nomupay account is configured for your target markets.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.