微信小程序云开发--上传图片到云存储&获取并展示云存储里的图片

最新推荐文章于 2024-07-23 10:30:43 发布

我很好请走开谢谢

最新推荐文章于 2024-07-23 10:30:43 发布

阅读量2.1w

点赞数 25

分类专栏： # 微信小程序开发

本文链接：https://blog.csdn.net/alovelypeach/article/details/105883031

版权

微信小程序开发专栏收录该内容

10 篇文章

订阅专栏

上传图片到云存储

在app.js中配置。初始化云环境。
在index.wxml中写页面
在index.js中写upload的执行方法

获取并展示云存储里的图片

index,wxml

<button bindtap = "upload">上传文件</button>

<image src = "{{imgURL}}"></image>

index.js

Page({
  data:{
    imgURL:""
  },
 //上传文件
  upload(){
    //把this赋值给that，就相当于that的作用域是全局的。
    let that = this;
    console.log("jaj");
    wx.chooseImage({
      count: 1,
      sizeType: ['original', 'compressed'],
      sourceType: ['album', 'camera'],
      success(res) {
        console.log("成功",res);
        that.uploadImage(res.tempFilePaths[0]);
      }
    })
  },
  uploadImage(fileURL) {
    wx.cloud.uploadFile({
      cloudPath:new Date().getTime()+'.png', // 上传至云端的路径
      filePath: fileURL, // 小程序临时文件路径
      success: res => {
        // 返回文件 ID
        console.log("上传成功",res)
        //获取文件路径
        this.setData({
          imgURL:res.fileID
        })
      },
      fail: console.error
    })
  }
})