This article introduces how to generate a WeChat applet QR code containing parameters in a Java environment and display it on an HTML page. We will explore how to use Java code to call the WeChat interface, generate QR code, and pass the image data to the front-end for display through Base64 encoding. There were problems with the previous implementation plan, which caused the QR code to be displayed normally. The main reason was that the binary stream data returned by the WeChat interface was improperly processed.

The improved Java backend code focuses on correctly processing the conversion of binary data to Base64 strings:

 String accessToken = getAccessToken(); // The method to get accessToken, omitted here // Call the WeChat interface to generate a QR code URL url = new URL("https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=" accessToken);
HttpURLConnection connection = (HttpURLConnection) url.openConnection();
connection.setRequestMethod("POST");
connection.setDoOutput(true);
connection.setDoInput(true);
connection.setRequestProperty("Content-Type", "application/json; charset=UTF-8");

// Send request parameter JSONObject paramJson = new JSONObject();
paramJson.put("scene", "id=1");
paramJson.put("page", "/pages/index/index");
OutputStream outputStream = connection.getOutputStream();
outputStream.write(paramJson.toString().getBytes("UTF-8"));
outputStream.flush();
outputStream.close();


// Get response data InputStream inputStream = connection.getInputStream();
byte[] imageBytes = inputStream.readAllBytes(); // Use readAllBytes() to simplify the reading process inputStream.close();
String base64Image = Base64.getEncoder().encodeToString(imageBytes);

// Return Base64 encoded QR code image data to the front end // ... (Here, according to your backend framework, such as Spring MVC, encapsulate base64Image data into the response) ...

Front-end HTML and JavaScript code are relatively simple, just make sure that the back-end correctly returns Base64-encoded image data. After the backend code is improved, the base64Image string should be returned as response data. After the front-end receives it, use data:image/jpeg;base64, prefix to splice base64Image and assign it to the src attribute of the img tag to correctly display the QR code. Please note that the part of the code that returns base64Image according to your backend framework adjustment, and make sure to set the correct Content-Type to application/json or other types that suit your framework so that the browser can correctly parse the data. Correctly handling the conversion of binary data to Base64 strings is the key to solving the problem.

The above is the detailed content of How to correctly generate and display the WeChat applet with parameters QR codes in Java?. For more information, please follow other related articles on the PHP Chinese website!