How to use WeChat industrial computer to implement WeChat scan code?

The popularity of mobile payment is becoming more and more widespread, such as unmanned vending machines in subway stations, courier cabinets in residential areas, charging piles in parking lots, etc. Most of these devices integrate scanning code payment functions. Today, we will introduce how to access WeChat scan code payment for Linux industrial computer in the form of project.

First, the hardware environment

Linux industrial computer: Zhiyuan electronic DCP-3000L industrial computer, supporting 7-inch LVDS LCD screen, resolution 800x480;

Server: 64-bit Ubuntu host with Internet access;

Mobile client: WeChat client, with the ability to scan and identify the QR code.

The overall hardware connection framework is shown in Figure 1:

Figure 1 hardware connection diagram

Second, the demonstration effect

First look at the final effect, the client is written using the Qt framework, and its startup interface is shown in Figure 2:

Figure 2 shows the demo main interface

Click the keypad, enter the payment amount, click OK, the client will communicate with the server, get the payment link, and generate the payment QR code locally, as shown in Figure 3:

Figure 3 Generate payment QR code

Next, open the mobile phone WeChat client, use the sweep to scan the code, enter the payment password according to the payment page prompt, the payment result is shown in Figure 4:

Figure 4 Payment results

After the payment is completed, the payment success message will be displayed on the demo client interface, as shown in Figure 5:

Figure 5 shows the payment results

Why is it easy to scan code access? Server client how they deal with? Is PHP the best language in the world? Where is the good source code? Stay tuned for the following sections of this article.

Third, the system process

The whole project adopts CS architecture, which is divided into embedded Linux client, background server and mobile client. The system flow is shown in Figure 6:

Figure 6 system flow chart

As you can see from the system flow chart, we need to write the client and server code. The client uses the QT framework. On the server side, we use the official WeChat payment SDK package. In the process of interaction between the client and the server, the most important thing is to get the link address of the WeChat payment and the order number. In order to generate the QR code picture, the order number is used to query the payment status.

Fourth, the server side implementation

Download the SDK from WeChat officially ( with links at the end of the article ), there are three types of SDKs, JAVA, .NET C#, and PHP, as shown in Figure 7:

Figure 7 WeChat SDK

Here we choose the PHP version to download, the server-side environment is Ubuntu14.04 system, built with nginx, port number 8080. ( Required: PHP is the language of the world ___ )

1, PHP + NGINX environment to build

We set up the nginx server on the Ubuntu host. The specific steps are install-config-start.

Install the nginx server:

Configure the nginx server. In order not to interfere with the port number of other servers, we directly modify the configuration of the nginx server and change the default port 80 to 8080. The modification process is as follows:

Start the nginx server:

Since we are using the PHP version of the WeChat official SDK, we need to install the PHP environment for the system, and we need to modify the configuration of the nginx server to support PHP.

Installing the PHP environment is relatively simple. The installation commands in Ubuntu 14.04 are as follows:

Next modify the nginx server configuration to support PHP:

Create index.php in the /usr/share/nginx/html directory, restart php5-fpm and nginx for testing:

Open the local browser, enter the address localhost:8080 to see the corresponding PHP page, as shown in Figure 8, at this time PHP + NGINX environment has been completed.

Figure 8 PHP+NGINX test results

2, WeChat SDK installation and modification

Unzip the downloaded WeChat payment PHP version of the SDK and copy the relevant files to the root directory of the nginx server ( default is /usr/share/nginx/html, which can be modified by modifying the root parameter of /etc/nginx/sitesavailable/default) Specify, here we use the default parameters ):

Enter the address server address in the local browser, you can see that the WeChat SDK is running, as shown in Figure 9:

Figure 9 WeChat SDK page

Next we need to modify the SDK, mainly to replace the merchant information, SSL server authentication disabled, payment interface implementation, query interface implementation.

Replace business information

To use WeChat payment, you must first open the public number or the company's WeChat payment related functions. There is no explanation on how to open it. After the WeChat payment is opened, WeChat will provide the customer information, such as merchant number and payment key. We need to replace the merchant information of the /lib/WxPay.Config.php file ( the file in the SDK has been copied to the root directory of the nginx server ). The modified location is as follows:

SSL server authentication disabled

The downloaded SDK package is V3 version. There will be errors in running the low version SSL library. We disable the SSL server authentication function directly, modify the /lib/WxPay.Api.php file, and verify the SSL server authentication function in the postXmlCurl function. Disabled, modified as follows:

Payment interface implementation

The scan code payment interface is located in the /example/native.php file. There is sample code in the native SDK package. We modify it. The implementation process is to get the input amount → request WeChat payment link → send the link address and order number. Here we use the delimiter to simply encapsulate the data. In practice, you can add a response message in JSON or XML format. The modified code is as follows:

Query interface implementation

The order query interface is located in the /example/orderquery.php file. We modify it. When the client POST order number reaches the interface, it will query the payment status of the corresponding order number and return to the payment status. The modified code is as follows:

The above four steps complete the installation and modification of the WeChat SDK, and implement the payment interface and the query interface. At this point, the server deployment has been completed.

Fifth, the client implementation

The client uses the Qt framework to write, and several key points that need to be processed are QR image generation, network communication, and data analysis. The following focuses on the implementation of each part.

1, QR code image generation

We use the open source QRencode to generate QR image images. We can integrate the QRencode source code into the Qt project, or use the compiled QRencode executable file.

Here we compile the QRencode source directly, compile and depend on the zlib and libpng libraries. For the convenience of compilation, an automated compilation script is provided in the source package. The compilation process is as follows:

After the compilation is complete, you can get the qrencode QR code generation tool, which is roughly used as follows:

The code that calls the tool in Qt to display the QR code is as follows:

2, network communication and data analysis

We use Qt's QNetworkRequest module for network communication, and encapsulate related functions into Post functions for calling. The code for interaction with the server and data parsing is as follows:

Here is the hardware connection method. First, the server is an Ubuntu host. The industrial computer directly connects the 100M network port to the server through the network cable to form a LAN. In this project, the server LAN address is 192.168.1.164, so the server address is directly specified in the source code. When using wireless Internet access, the server address can be modified to be the public network IP address of the remote server ( significant message: DCP-3000L IPC comes with 4G wireless Internet access, along with the entire network dial-up scripting guard, support redial, traffic anomaly detection, automatic identification of the three networks.).

The rest of the client is the logical processing of the interface. In the first section, we have already seen the effect of the demo, which is not detailed. After the payment is completed in the project, it indicates that the payment is completed and waits for the next payment. In practical applications, hardware operations such as turning on the relay switch, playing music, and the like are often performed. At this point, WeChat scan code payment has been introduced, the source code is pulled down.

Six, say good source code

Source github address:

Https://github.com/kp339/qt-wxpay.git