WeChat built-in h5 browser getBrandWCPayRequest payment

Table of contents

getBrandWCPayRequest payment

What is getBrandWCPayRequest payment?

How to pay with getBrandWCPayRequest?

 Features and advantages of getBrandWCPayRequest payment

in conclusion

WeixinJSBridge: JavaScript bridge tool for WeChat browser

The role of WeixinJSBridge

Use of WeixinJSBridge

Summarize

WeixinJSBridge.invoke initiates payment

What is WeixinJSBridge.invoke?

How to use WeixinJSBridge.invoke to initiate payment?

Precautions

WeixinJSBridgeReady: The event that the WeChat browser is ready

What is WeixinJS BridgeReady?

How to use WeixinJSBridgeReady event?

Precautions

Summarize

full code


getBrandWCPayRequest payment

In the world of e-commerce, payment is a vital function. With the popularity of mobile applications and online shopping, people need convenient, fast and secure payment methods. In this context, many payment solutions emerged, one of which is "getBrandWCPayRequest" payment.

What is getBrandWCPayRequest payment?

getBrandWCPayRequest is a payment method based on WeChat official account and WeChat payment platform. It provides a convenient way for merchants to process payment requests from users. Through getBrandWCPayRequest payment, users can quickly complete the payment process on the WeChat client without entering payment information again.

How to pay with getBrandWCPayRequest?

Paying with getBrandWCPayRequest involves the following main steps:

  1. The merchant server sends a payment request to the WeChat payment platform, including order information and payment amount.
  2. The WeChat payment platform returns the prepayment transaction session identifier (prepay_id) to the merchant server.
  3. The merchant server generates the parameter (paySign) for invoking WeChat payment according to the returned prepay_id.
  4. The merchant passes the parameters to the front end to invoke the payment interface of the WeChat client.
  5. The user confirms the payment information in the WeChat client and enters the password for payment.
  6. The WeChat payment platform notifies the merchant server of the payment result, and the merchant updates the order status.
  7. The merchant server returns the payment result to the front end, prompting the user whether the payment is successful or failed

front-end code

// 创建支付参数对象
var payParams = {
  appId: 'your_app_id',            // 微信公众号的 app ID
  timeStamp: 'payment_timestamp',  // 支付时间戳
  nonceStr: 'payment_nonce_str',    // 随机字符串
  package: 'payment_package',       // 打包信息
  signType: 'MD5',                  // 签名类型
  paySign: 'payment_sign'           // 签名
};

// 调用 getBrandWCPayRequest 函数发起支付请求
WeixinJSBridge.invoke('getBrandWCPayRequest', payParams, function(res) {
  if (res.err_msg === 'get_brand_wcpay_request:ok') {
    // 支付成功的处理逻辑
    console.log('Payment successful!');
  } else {
    // 支付失败或取消支付的处理逻辑
    console.log('Payment failed or canceled!');
  }
});

 Features and advantages of getBrandWCPayRequest payment

getBrandWCPayRequest payment has the following features and advantages:

Convenience: Users can quickly complete the payment through the WeChat client without additional input of payment information, which improves the convenience of payment. -

Security: The WeChat payment platform adopts a variety of security measures to protect users' payment information and transaction security. -

Wide applicability: getBrandWCPayRequest payment is applicable to multiple industries and application scenarios, including e-commerce, catering, ticketing, etc. Merchants can integrate it into their own applications according to their own business needs.

in conclusion

getBrandWCPayRequest payment is a fast and safe payment method based on WeChat official account and WeChat payment platform. Through this payment method, merchants can provide users with a convenient payment experience while ensuring the security of payment information and transactions. getBrandWCPayRequest payment has a wide range of applications and is a viable payment solution for merchants in e-commerce and other industries. Hope this article helps you! Please remember to carry out specific interface docking and configuration according to official documents and technical requirements in actual use.

WeixinJSBridge: JavaScript bridge tool for WeChat browser

WeixinJSBridge is a JavaScript bridging tool provided in WeChat's built-in browser, which allows developers to call functions and interfaces of WeChat client in web pages. By using WeixinJSBridge, developers can interact with the WeChat client to achieve more functions and customization.

The role of WeixinJSBridge

WeixinJSBridge allows developers to communicate directly with the WeChat client in the web page, and call the interface and functions of WeChat in the browser. It greatly increases the functional scalability of WeChat's built-in browser and brings more possibilities for developers.

Through WeixinJSBridge, developers can realize the following functions:

  • Invoke WeChat sharing: Developers can use WeixinJSBridge to call the sharing interface of the WeChat client to share content directly to WeChat Moments or friends on the web page.
  • Invoke the payment function: By using the WeixinJSBridge.invoke method, developers can initiate a WeChat payment request in the web page to realize the payment function.
  • Obtain device information: With WeixinJSBridge, developers can obtain device information of the WeChat client, such as device model, operating system version, WeChat version, etc.
  • Scanning function: Through WeixinJSBridge, developers can call the scanning function of the WeChat client to scan QR codes or barcodes on web pages.

Use of WeixinJSBridge

To use WeixinJSBridge, you need to load WeixinJSBridge related scripts in the web page, and perform related operations after the scripts are loaded. In general, you can listen to the WeixinJSBridgeReady event and perform related operations in the event callback function.

The following is a simple sample code that demonstrates how to use WeixinJSBridge to call the WeChat sharing function:

document.addEventListener('WeixinJSBridgeReady', function() {
    WeixinJSBridge.invoke('shareTimeline', {
        "title": "分享标题",
        "link": "http://example.com",
        "img_url": "http://example.com/img.jpg"
    }, function(res) {
        // 分享结果的回调处理
        if (res.err_msg == 'share_timeline:ok') {
            // 分享成功
        } else {
            // 分享失败
        }
    });
}, false);

In the above code, we call the WeixinJSBridge.invoke method in the WeixinJSBridgeReady event callback function and pass in the parameters related to sharing. When the user clicks the share button, the WeChat client will pop up the sharing interface. After the user completes the sharing, the WeChat client will pass the sharing result to the web page, and can perform corresponding follow-up processing according to the result

Summarize

WeixinJSBridge is a JavaScript bridging tool provided by WeChat's built-in browser. Developers can use it to call the interface and functions of WeChat client in web pages. By using WeixinJSBridge, developers can implement more customized functions and improve user experience. Hope this article helps you understand WeixinJSBridge!

WeixinJSBridge.invoke initiates payment

WeixinJSBridge is a JavaScript API framework provided by WeChat browser, which allows developers to call functions and interfaces of WeChat client in web pages. And WeixinJSBridge.invoke is one of the methods used to initiate payment.

What is WeixinJSBridge.invoke?

WeixinJSBridge.invoke is an API in the WeChat browser, which is used to call the payment function of the WeChat client in the web page. By calling this method, you can directly initiate a payment request in the WeChat browser and complete the payment operation.

How to use WeixinJSBridge.invoke to initiate payment?

document.addEventListener('WeixinJSBridgeReady', function() {
   WeixinJSBridge.invoke('getBrandWCPayRequest', {
       "appId": "wx1234567890",
       "timeStamp": "1234567890",
       "nonceStr": "abcdefg",
       "package": "prepay_id=1234567890",
       "signType": "MD5",
       "paySign": "abcdefg"
   }, function(res) {
       if (res.err_msg == 'get_brand_wcpay_request:ok') {
           // 支付成功的逻辑处理
       } else {
           // 支付失败的逻辑处理
       }
   });
}, false);

In the above example, WeixinJSBridgeReady is the callback function prepared by WeixinJSBridge, and the WeixinJSBridge.invoke method is called inside the callback function. In getBrandWCPayRequest parameters, we need to pass in some payment-related parameters, such as appId, timeStamp, nonceStr, package, etc.

After calling the WeixinJSBridge.invoke method, the WeChat client will pop up a payment interface, and the user can complete the payment operation in this interface. After the payment is completed, the WeChat client will return the corresponding result to the web page, and corresponding follow-up processing can be performed according to the result.

Precautions

  • Before using WeixinJSBridge.invoke to initiate payment, you need to ensure that WeixinJSBridge is ready. It can be judged by listening to the WeixinJSBridgeReady event.
  • When calling the WeixinJSBridge.invoke method, you need to pass in the correct payment parameters, including appId, timeStamp, nonceStr, package, etc.
  • After the payment is completed, follow-up logical processing is performed according to the results returned by the WeChat client.

The above is the relevant content about the payment initiated by WeixinJSBridge.invoke. Hope to help you! Please note that the code examples in this document are purely pseudocode, and the specific parameters and logic need to be adjusted according to the actual situation.

WeixinJSBridgeReady: The event that the WeChat browser is ready

WeixinJSBridgeReady is an event that occurs in the built-in browser of WeChat. It indicates that the WeChat browser has loaded the WeixinJSBridge object and can start to interact with the WeChat client.

What is WeixinJS BridgeReady?

WeixinJSBridgeReady is an event in the WeChat built-in browser, which is used to notify developers that the WeChat browser is ready and can start communicating with the WeChat client. This event will be triggered when the WeChat browser finishes loading the WeixinJSBridge object.

How to use WeixinJSBridgeReady event?

The following is a sample code that demonstrates how to listen to the WeixinJSBridgeReady event:

document.addEventListener('WeixinJSBridgeReady', function() {
    // 在这里可以进行与微信客户端的交互操作
}, false);

In the above code, we use the addEventListener method to listen to the WeixinJSBridgeReady event. When an event occurs, the callback function will be executed, and the developer can perform interactive operations with the WeChat client in the callback function.

Precautions

  • Before using the WeixinJSBridgeReady event, you need to ensure that the WeixinJSBridge script has been loaded. Usually, related scripts can be loaded at the head of the page.
  • When interacting with the WeChat client in the WeixinJSBridgeReady event callback function, it is necessary to ensure the correctness and stability of the code to ensure normal communication with the WeChat client.

Summarize

The WeixinJSBridgeReady event is an important event in the WeChat built-in browser, which indicates that the WeChat browser is ready and can start communicating with the WeChat client. Developers can use this event to perform interactive operations with the WeChat client in the WeChat browser to achieve more functions and customization. Hope this article gives you a better understanding of the WeixinJSBridgeReady event!

full code

function onBridgeReady(payData) {
          let params = {
            appId: payData.AppId, //公众号ID,由商户传入
            timeStamp: payData.TimeStamp.toString(), //时间戳,自1970年以来的秒数
            nonceStr: payData.NonceStr, //随机串
            package: payData.Package,
            signType: payData.SignType, //微信签名方式:
            paySign: payData.PaySign, //微信签名
          };
          WeixinJSBridge.invoke(
            "getBrandWCPayRequest",
            params,
            function (res) {
              if (res.err_msg == "get_brand_wcpay_request:ok") {
                Toast("pay success");
                // 使用以上方式判断前端返回,微信团队郑重提示:
                //res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
              } else {
                Toast(res.err_msg);
              }
            }
          );
        }

        if (typeof WeixinJSBridge == "undefined") {
          if (document.addEventListener) {
            document.addEventListener(
              "WeixinJSBridgeReady",
              onBridgeReady,
              false
            );
          } else if (document.attachEvent) {
            document.attachEvent("WeixinJSBridgeReady", onBridgeReady);
            document.attachEvent("onWeixinJSBridgeReady", onBridgeReady);
          }
        } else {
          onBridgeReady();
        }

Guess you like

Origin blog.csdn.net/qq_63358859/article/details/131594271