Let's talk about the best way to generate a QR code for a Web project.
After the design and implementation process, you never know what kind of posture the deployed program will run.
This article describes the correct posture of QR code generation in a Web project by using different implementations of the QR code generation logic.
In this article, we would like to invite you to take a brick. The logic implemented five days before the trial run is as follows:
- The client ajax request generates a QR code. The backend service can understand this request and generate a QR code (refer to my blog: Google Zxing QR code generation and resolution ).
- The QR code has been named by the user ID and stored in the project/webcontent/qrcode/AAAAAAAAAAAAAA.png.
- The User ID is used to reduce the storage pressure on the server. A user has only one QR code, no matter how many times he clicks, only one file is saved in the project directory (Java IO judges before writing the file, and overwrites the file with the same name ).
- Return the generated QR code name to the front-end. Jquery accurately places the image path attribute into the Dom element.
var qrcode = $("#qrcode");qrcode.removeAttr("src");qrcode.attr("src","${pageContext.request.contextPath}/qrcode/" + data.qrcodeFileName);
Problems after implementation:
- When a user clicks on a business to generate a QR code multiple times, due to the timeliness, the subsequent generated QR code becomes invalid, and scanning immediately at one side will become invalid.
- Check the log and find that the subsequent request links are the timestamp generated for the first time. Check the project directory and find that the QR code is indeed generated in real time, but the link after scanning the Code is the first time.
- I think the problem should be solved in the browser. After repeated experiments, when almost all browsers introduce images with the same path and name for the first time, will read the images cached in the browser.
- Haha, you can't say to users, "Clear your browser cache image every time you click to generate a QR code", right ?.
- In fact, the image content in the project directory has already occurred, but the name and import path have not changed, but are not found by the browser. This is indeed not to blame the browser for being too stupid.
- Then each QR code is assigned a unique ID? The files under the project path will surely pop up, and the Project Manager will ask for tea.
- Then we can find a way to repeat the search and practice, and the second implementation logic will appear: