Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”.

background

The company’s own rental project [Excellent District Life] needs to be compatible with IOS, Android and small programs at the same time, so the former programmer boldly chose UNI-App as the development framework. Otherwise, there are many compatibility problems with UNI-App. However, a requirement was changed recently, which caused some problems.

The project supports users to rent and search for apartments and chat in the application. However, the server capacity is limited, so the maximum upload resources of each user are limited according to the previous data. In the front end, the remaining available resource space of the current user is detected through THE API before uploading.

Multiple pages need to call this API for detection, so write it in app.vue as a public method call.

// App.vue
mounted(){
  async checkLeftSourceCount(type = 1){
    return new Promise((resolve, reject) = > {
      let fingerId, leftcount = 0;
      this.getUniqueId().then(res= > {
        fingerId = res.fingerId;
        this.$utils.request(`/targetUrl? key=value`)
        .then(res= > {
          resolve(res)
        })
        .catch(err= >{ reject(err) }) }); }}})Copy the code

After the public method is written, it is directly called in the corresponding interface.

async choosePhoto() {
		
  await getApp().checkLeftSourceCount(3)
  .then(res= > {
    this.photoMaxNum = res;
  })
  .catch(err= > {
    this.photoMaxNum = 0;
    this.openError(err)
  });
  if(!this.photoMaxNum) return 
    
  // Select the code to upload the image
  uni.chooseImage({})
}
Copy the code

On the WEB, it is normal to open the selection box to select the image upload, but in the two-terminal APP, there will be no click response, breakpoint check will find that the function called uni.ChooseImage, but will not call the API.

I found a lot of posts in the community, including a post from 2017 which mentioned that the API would be unavailable if called from asynchronous functions. I thought the bug was fixed in the post from four years ago, but I couldn’t find the problem, so I still tried.

Before testing the results, the checkLeftSourceCount() function has been executed to select the image.

So I tell the detection function code copy to the current interface, do not call the public method to detect, real machine debugging no problem.

At present this bug has contacted the community of developers to deal with, hope to repair it as soon as possible. This article is also hope to see a small partner can not scratch the head. I didn’t think this would be a problem if I tried to beat my head.