I wrote an article about how to use cloud development to implement a community Demo: wechat small program ~ cloud development implementation of a community Demo (end ~) has been recognized by many partners but also some problems.
The main problems are:
- Published images are not displayed, and cross-end published images are not displayed
- The “like” function is optimized
- The database is not clear
- You need to add a reply function
For the above problems, I have updated the code, and the address is:dongxi346/doughnutIn theREADME
Or read on below.
Ps: helpful friends help point a star thank you.
This update is mainly about:
- Solve the problems mentioned above
- Optimize code structure
Wx. ChooseImage API return temporary image link, then for the convenience of doing so directly.
However, since it is a temporary picture will certainly be invalid, and there is a problem with cross-posted pictures (here refers to the computer and mobile phone published pictures can only be displayed on their respective ends).
According to the custom of development, we should definitely upload the image to the server first, and the server will return the image link to the database. Cloud development also provides file storage function, so we only need to do three steps to solve the image problem.
Step 1: After selecting the image, save the temporary image link
Step 2: Upload the image to the server to get the image link when it is submitted to the database
Step 3: Store the published data to a cloud database
For convenience, I have directly combined the first and second steps, and the pseudo-code is as follows:
chooseImage: function(event) {
wx.chooseImage({
count: 6,
success: function(res) {// Set the image. setData({images: [] console.log(res.tempFilepaths,}) // If we don't have the same problem, we'll get the same problem.for (var i inRes.tempfilepaths) {// Upload pictures to the cloud storage space wx.cloud.uploadFile({// Specify the small program temporary file path for the files to be uploaded cloudPath: Timetostr (new Date()), filePath: res.tempfilepaths [I], // Push (res.fileId)},})},},},},}, /** * timeTostr (time){var randnum = math.floor (math.random () * (9999-1000)) + 1000; var str = randnum +"_"+ time.getMilliseconds() + ".png";
return str;
},
Copy the code
The third step is to add the database operation, the image field directly save the value of that.data.images
The main reason for the optimization of the like function is that the previous database design is not clear, the like should be placed in a separate database table, should not depend on the article.
The implementation process can refer to the source article source code details
The reason why the database is not clear is that I didn’t think so much about the implementation of the Demo at the beginning. I only thought about the implementation function, and the design of the data table was not careful enough. I am also a layman in database design, and my current design idea is to keep the table structure as simple as possible.
See the usage instructions in the project README
Add reply function community Demo did not reply function also said not past, so simple added, UI is very ugly, but the basic implementation of a simple reply function
The realization of the process can refer to the source code reply function source code