微信小程序 JSON.parse()和JSON.stringify()，wx.request和wx.uploadFile

JSON.parse（）和JSON.stringify（）的作用

简单概括一下：

1. JSON.parse（）将JSON字符串转为一个JavaScript对象
2. JSON.stringify（）将JavaScript对象转换为JSON字符串

他们是逆作用：JSON.parse()可以把JSON字符串A转为JavaScript对象B；JSON.stringify()可以把JavaScript对象B转换为JSON字符串A。

与wx.request,wx.uploadFile的联系

我们发现，在文档对wx.request的描述中，有以下值得注意的：

也就是说，若调用wx.request返回的值为JSON字符串，会对此数据进行一次JSON.parse（），那么这个JSON字符串就变成了JavaScript对象了。
但是，在wx.uploadFile中却没有相关的描述。

开发需求描述

在进行微信小程序项目的一个功能开发时，我需要使用wx.request和wx.uploadFile分别进行数据的上传，并根据后台数据库返回的res.data.error_code给用户相关的提示。举个例子，error_code为0，则是“提交成功”，error_code为1，则是“提交失败”。

bug异常描述

写好了代码，将相应的数据进行上传，url等等都没有问题，同样是上传数据，uploadFile却不能给我返回正常的error_code，打印出来的res.data.error_code是undefined。

success(res) {
    
    
          console.log(res.data)
          console.log(res.data.error_code) 
          if (data.error_code == 0) {
    
    
            wx.showToast({
    
    
              title: '提交成功',
            })
          }
          if (data.error_code == 1) {
    
    
            wx.showToast({
    
    
              title: '参数不足',
            })
          }
          if (data.error_code == 2) {
    
    
            wx.showToast({
    
    
              title: '提交超时',
            })
          }
          if (data.error_code == 3) {
    
    
            wx.showToast({
    
    
              title: '不可重复提交',
            })
          }
        },
        fail: function (res) {
    
    
          wx.showToast({
    
    
            icon: 'none',
            title: '上传失败',
          })
        }
      })

若error_code都是undefined，自然在下面的判断就不好使了，没法出现应有的showToast，用户得不到相应的提示。

原因分析

wx.uploadFile没有对JSON字符串做JSON.parse（）处理，所以后台传过来的res.data实际上是个JSON字符串，并不是JavaScript对象，所以根本没有res.data.error_code。不是JavaScript对象，怎么有’.'操作呢。
然而，wx.request就有对JSON字符串做JSON.parse（）转化，转成了JavaScript对象，所以就可以直接访问res.data.error_code，是一点问题都没有的。

//同样的代码，在wx.request就没有问题；
        success: function (res) {
    
    
          console.log(res.data)
          if (res.data.error_code == 0) {
    
    
            wx.showToast({
    
    
              title: '提交成功',
            })
          }

解决方案

在wx.uploadFile中，添加var data = JSON.parse(res.data)，将res.data转换成了JavaScript对象保存在变量data中。故可以访问data.error_code。

// 在wx.uploadFile中
  success(res) {
    
    
          var data = JSON.parse(res.data)
          console.log(data)
          console.log(data.error_code)
          if (data.error_code == 0) {
    
    
            wx.showToast({
    
    
              title: '提交成功',
            })
          }

完美解决问题。