Alipay International Mini Program Development PlatformAlipay International Mini Program Development PlatformDOCS

Add a customized QR code binding

Add a customized QR code binding to let users scan a standard QR code with a target app and land directly on a specific page in your mini program. It works by creating a server-side link between a standard web URL encoded in the QR code and your mini program page.

Before you begin

Before you begin, ensure you meet the following requirements:

  • Role: You must have either of the following roles:
    • Workspace Owner or Master
    • Admin for the target mini program
  • Version status: The mini program must have a version in the Full Release status.
  • Binding capacity: Ensure you have not reached the maximum number of bindings. If you have, deactivate released bindings that are no longer needed to free up capacity.
  • URL requirements: Ensure the QR code URL uses the HTTPS, HTTP, or FTP protocol, and the domain has a valid Internet Content Provider (ICP) filing.
  • Target app installation: To test the binding, install a target app where your mini program is fully released on your mobile device.

Procedure

To add a customized QR code binding, take the following steps:

Step 1: Navigate to the customized QR code page

  1. In your workspace, navigate to the mini program list page.
  2. Find and click the mini program for which you need to add a customized QR code binding.
  3. On the mini program details page, click QR Code > Customized QR Code.

Step 2: Create a binding

  1. To start creating a binding, choose either of the following options:
    • To create a brand new binding: Click + Add QR Code.
    • To duplicate an existing binding: Find the existing released binding in the list and click Duplicate in its Actions column.
  1. In the Add a Customized QR Code dialog, configure the following fields:
    • URL Prefix: Enter the web URL or URL prefix encoded in the QR code. Based on the selected Matching Method:
      • For Exact Matching: Enter the complete URL.
      • For Fuzzy Matching: Enter the shared URL prefix used by multiple QR codes.
    • Matching Method: Select how to match the scanned URL to the entered URL Prefix.
      • Exact Matching: Match only the URL specified in URL Prefix.
      • Fuzzy Matching: Match all URLs that start with the specified URL Prefix.
    • Mini Program Page Path: Enter the path of the mini program page that opens when users scan a matching QR code with a target app.
  1. Review your information carefully.
  2. Click Add.

The binding is added to the customized QR code list with a Draft status.

Step 3: Test and activate the binding

  1. In the customized QR code list, find your draft binding and click View in its Actions column.
  2. In the dialog that appears, click Test to generate a test QR code.
  3. Test the binding based on your selected matching method:
    • For exact matching:
      1. Scan the displayed QR code with the target app.
      2. Verify that the QR code opens the expected mini program page.
    • For fuzzy matching:
      • To test the base URL prefix: Directly scan the displayed QR code with the target app and verify the opened page.
      • To test child URLs of your specified URL prefix:
        1. In the input field, enter the remaining path of the URL you need to test. Note that if your URL prefix does not end with a slash /, add one at the beginning of your entry. Example:
          • URL prefix: https://www.example.com/product
          • Additional path: /123
          • Full test URL: https://www.example.com/product/123
        1. Click Generate QR Code to update the URL and the QR code.
        2. Review the new URL, and then scan the new QR code with a target app to verify it opens the correct page.
        3. Repeat these steps to test other child URLs.
  1. Based on your test result, choose either of the following actions:
    • If the binding works correctly, click Release to activate it.
    • If the binding needs changes:
      1. Click Edit.
      2. Update the configuration fields as needed.
      3. Click Save and Test to return to the test dialog and verify your changes.
      4. Once verified, click Release to activate the binding.

A success message appears, and the binding status changes from Draft to Released. Users who scan a matching QR code with a target app are now directed to the specified mini program page.