小程序开发

1.小程序保存相册

getShareCode(row) {
  let baseUrl = request.baseURL;
  this.codeUrl = `${baseUrl}/enterSettleRecord/getMiniProgramCode?settleId=${row.id}&path=pages/companyManage/companyUser/shareDetail/index`
  api.getShareQrCode(qs.stringify({
    settleId: row.id,
    path: "pages/companyManage/companyUser/shareDetail/index"
  })).then(res => {
    this.qrCodeUrl = "data:image/png;base64," + uni.arrayBufferToBase64(res);
    this.isShow = true;
  })
},
  saveDownloadFile() {
    this.downLoadFile().then((res) => {
      return this.saveImageToPhotosAlbum(res.tempFilePath)
    }).then(() => {      
    })
  },
    //单文件下载(下载文件资源到本地)，客户端直接发起一个 HTTPS GET 请求，返回文件的本地临时路径。
    downLoadFile() {
      return new Promise((resolve, reject) => {
        uni.downloadFile({
          header: {
            'Authorization': uni.getStorageSync('blade-auth') || '',
          },
          url: this.codeUrl,
          success: (res) => {
            console.log('downloadfile', res)
            resolve(res)
          },
          fail: (err) => {
            console.log('downloadfile-失败', err)
          }
        })
      })
    },
      saveImageToPhotosAlbum(path) {
        return new Promise((reslove, reject) => {
          uni.saveImageToPhotosAlbum({
            filePath: path,
            success: (z) => {
              util.showToast("已保存到相册",'none',1000);
              setTimeout(() => {
                this.handleCloseModal();
              },1000)
              reslove(z)
            },
            fail: (er) => {
              reject(er)
            }
          })
        })
      },
        async handleAuth() {
          await this.getSetting().then(res => {
            var _this = this;
            // 1、说明用户已经授权了
            if (res.authSetting['scope.writePhotosAlbum']) {
              this.saveDownloadFile();
              return
            }
            // 2、说明用户曾经授权过，但是此时是处于关闭状态,需要再次授权
            if (res.authSetting['scope.writePhotosAlbum'] === undefined) {
              // 使用这个微信官方的方法可以从底部弹出一个获取授权的弹窗
              uni.authorize({
                scope: 'scope.writePhotosAlbum',
                success: (res) => {
                  console.log('authorize', res)
                  this.saveDownloadFile();
                },
                fail: (errs) => {
                  console.log('authorize-error 用户拒绝授权', errs)
                }
              })
            } else {
              uni.showModal({
                content: '授权小程序保存本地图片',
                confirmColor: '#36C7B5',
                success: (res) => {
                  if (res.confirm) {
                    // 如果用户勾选同意授权 则会自动返回页面并获取位置信息
                    this.getOpenUserSetting().then(res => {
                      if (res['scope.writePhotosAlbum']) {
                        this.saveDownloadFile();
                      }
                    });
                  } else {
                    uni.showToast({
                      title: '用户取消授权!',
                      icon: 'none'
                    });
                  }
                },
              })
            }
          })
        },
          // 获取用户授权
          getSetting() {
            return new Promise((resolve, reject) => {
              uni.getSetting({
                success(res) {
                  resolve(res)
                },
                fail(res) {
                  reject(new Error('获取授权信息失败', res))
                }
              });
            });
          },
            // 打开用户的授权设置
            getOpenUserSetting() {
              return new Promise((resolve, reject) => {
                uni.openSetting({
                  success(res) {
                    resolve(res.authSetting)
                  },
                  fail(err) {
                    reject(new Error('打开授权失败', res))
                  }
                })
              })
            },

2.api请求封装

const accountInfo = uni.getAccountInfoSync();
const env = accountInfo.miniProgram.envVersion // envVersion: ‘develop’ | ‘trial’, ‘release’
const isProd = env === 'release' || env === 'trial'
const envPrefixes = {
  // develop: 'https://testsdyz.nofetel.com',
  develop: 'https://test.msn.nofetel.com',
  trial: 'https://test.msn.nofetel.com',
  release: 'https://testsdyz.nofetel.com'
}
let baseURL = envPrefixes[env] + '/yd'
const httpRequest = function (url, data, method, showToast){
  if (showToast) {
    uni.showLoading({
      title: '加载中',
    })
  }
  let isProvider = "";
  uni.getProvider({
    service:'oauth',
    success(res) {
      isProvider = res.provider[0];
    }
  })

  let pages = getCurrentPages();
  let currentPage = pages[pages.length - 1];
  let version = "20240129";
  const app = getApp();
  return new Promise((resolve, reject) => {
    uni.request({
      url: baseURL + url,
      data: data,
      method:method,
      header: {
        'content-type': 'application/json',
        'user-id':uni.getStorageSync('openId') || '',
        'app-id':isProvider == 'weixin' ? uni.getAccountInfoSync().miniProgram.appId : my.getAppIdSync().appId,
        'page-path' : currentPage.route,
        'version':version,
        'qr-code':app.globalData.qrCode,
      }
    }).then(res=>{
      let info = res[1].data;
      if(showToast){
        uni.hideLoading();
      }
      if(res[1].statusCode == 200){
        return resolve(info);
      }else if(res[1].statusCode == 502){
        uni.showToast({
          title: '系统正在升级,请稍后再试!',
          icon: 'none'
        })
      }else{
        return resolve(res[1].data);
      }

    }).catch(err => {
      if(err.statusCode == 1){
        uni.showToast({
          title: '网络连接超时，请稍后再试',
          icon: 'none'
        })
        return '网络连接超时，请稍后再试'
      }else{
        uni.showToast({
          title: '请求超时，请稍后再试',
          icon: 'none'
        })
      }
      return reject(err)
    })
  })
}
const downFileRequest = function(url, data, method) {
  let isProvider = "";
  uni.getProvider({
    service: 'oauth',
    success(res) {
      isProvider = res.provider[0];
    }
  })
  return new Promise((resolve, reject) => {
    uni.request({
      url: baseURL + url,
      data: data,
      method: method,
      responseType: 'arraybuffer',
      header: {
        'content-type': 'application/json',
        'user-id':uni.getStorageSync('openId') || '',
        'app-id': isProvider == 'weixin' ? uni.getAccountInfoSync().miniProgram.appId : my .getAppIdSync().appId,
      }
    }).then(res => {
      resolve(res)
    }).catch(err => {
      if (err.code == 404) {
        uni.showToast({
          title: '网络连接超时，请稍后再试',
          icon: 'none'
        })
        return '网络连接超时，请稍后再试'
      } else {
        uni.showToast({
          title: '请求失败',
          icon: 'none'
        })
      }
      return reject(err)
    })
  })
}

export default {httpRequest,downFileRequest,baseURL};

3.Promise封装获取地理位置登录

getOpenId() {
  return new Promise((resolve, reject) => {
    if(!this.globalData.openId){
      uni.login({
        success: (d) => {
          api.getWeixinUserId({
            code:d.code
          }).then(res => {
            if(res.code == 200){
              uni.setStorageSync('openId', res.data.openId);
              this.globalData.openId = res.data.openId;
              this.globalData.phone = res.data.phone ? res.data.phone : ''
              resolve(res);
              this.checkIsSalesMan();
              this.getSystermInfo();
            }else{
              uni.showToast({
                title: res.msg,
                icon: "none"
              });
              reject(res)
            }
          })
        }
      })
    }else{
      resolve("success")
    }
  })
},
  checkIsSalesMan() {
    api.checkIsSalesMan().then(res => {
      console.log('checkIsSalesMan')
      if (res.code == 200) {
        this.globalData.isSalesMan = res.data;
      }
    })
  },
    getLocation() {
      return new Promise((resolve, reject) => {
        uni.getFuzzyLocation({
          type: 'wgs84',
          success: (res => {
            resolve(res)
          }),
          fail: (err) => {
            reject(err)
          }
        })
      });
    },
      handleAuth() {
        return new Promise((resolve, reject) => {
          this.getSetting().then(res => {
            var _this = this;
            // 1、说明用户已经授权了小程序获取地理位置
            if (res.authSetting['scope.userFuzzyLocation']) {
              _this.getLocation().then(e => {
                this.globalData.longitude = e.longitude;
                this.globalData.latitude = e.latitude;
                resolve(e)
              });
              return
            }
            // 2、说明用户曾经授权过位置信息权限，但是此时是处于关闭状态,需要再次授权
            if (res.authSetting['scope.userFuzzyLocation'] === undefined) {
              // 使用这个微信官方的方法可以从底部弹出一个获取授权的弹窗
              uni.authorize({
                scope: 'scope.userFuzzyLocation',
                success: (res) => {
                  // 获取位置
                  console.log('authorize', res)
                  _this.getLocation().then(succ => {
                    this.globalData.longitude = succ.longitude;
                    this.globalData.latitude = succ.latitude;
                    resolve(res)
                  });
                },
                fail: (errs) => {
                  console.log('authorize-error 用户拒绝授权', errs)
                }
              })
            } else {
              // 3、说明用户从未授权过地理位置信息这个权限或者拒绝过
              uni.showModal({
                content: '授权小程序获取位置信息',
                confirmColor: '#36C7B5',
                success: (res) => {
                  if (res.confirm) {
                    // 如果用户勾选同意授权 则会自动返回页面并获取位置信息
                    this.getOpenUserSetting().then(res => {
                      console.log('getOpenUserSetting', res)
                      if (res['scope.userFuzzyLocation']) {
                        _this.getLocation().then(succ => {
                          this.globalData.longitude = succ
                            .longitude;
                          this.globalData.latitude = succ
                            .latitude;
                          resolve(succ)
                        });
                      }
                    });
                  } else {
                    uni.showToast({
                      title: '用户取消授权!',
                      icon: 'none'
                    });
                  }
                },
              })
            }
          })
        })
      },
        // 获取用户授权
        getSetting() {
          return new Promise((resolve, reject) => {
            uni.getSetting({
              success(res) {
                resolve(res)
              },
              fail(res) {
                reject(new Error('获取授权信息失败', res))
              }
            });
          });
        },
          // 打开用户的授权设置
          getOpenUserSetting() {
            return new Promise((resolve, reject) => {
              uni.openSetting({
                success(res) {
                  resolve(res.authSetting)
                },
                fail(err) {
                  reject(new Error('打开授权失败', res))
                }
              })
            })
          },
            getSystermInfo() {
              uni.getSystemInfo({
                success: (res => {
                  this.globalData.systemInfo = res
                }),
                fail: function(err) {
                  console.log('err', err)
                }
              });
            },

4.小程序下载文件流

参照1 小程序保存相册。后端返回文件流形式。downloadFile不支持文件流下载，仅支持url,因此换一种实现方式。

下载文件流的内容，封装request 返回一个promise。设置responseType: ‘arraybuffer’即可

/* codeImage 文件流转成base64的内容 codeImage = "data:image/png;base64," + wx.arrayBufferToBase64(xxx接口数据); */
downloadImage() {
  var byte=this.codeImage.replace("data:image/png;base64,","");
  const fs = wx.getFileSystemManager(); //全局唯一的文件管理器
  var number = Math.random();
  fs.writeFile({
    filePath: wx.env.USER_DATA_PATH + '/code' + number + '.png',
    data: byte,
    encoding: "base64",
    success(res) {
      wx.saveImageToPhotosAlbum({ //保存为png格式到相册
        filePath: wx.env.USER_DATA_PATH + '/code' + number + '.png',
        success: (res) => {
          wx.showToast({
            title: '保存成功', //提示的内容,
            icon: 'success', //图标,
            duration: 2000, //延迟时间,
            mask: true, //显示透明蒙层，防止触摸穿透,
          });
          this.isReprenshModal = false;
        },
        fail: err => {
          this.isReprenshModal = false;
        },
        complete: err => {
          this.isReprenshModal = false;
        }
      })
    }
  })
},