精华内容
下载资源
问答
  • 主要为大家详细介绍了微信小程序上传图片实例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • 微信小程序上传图片

    2019-05-28 14:23:05
    微信小程序上传图片 下面为实例代码,具体文档看小程序官方文档 //上传图片 chooseimage: function (e) { var _this = this; flag = "1"; wx.chooseImage({ count: 1, // 默认9 sizeType: ['compressed'], ...

    微信小程序上传图片

    下面为实例代码,具体文档看小程序官方文档

    //上传图片
      chooseimage: function (e) {
        var _this = this;
        flag = "1";
        wx.chooseImage({
          count: 1, // 默认9  
          sizeType: ['compressed'],
          sourceType: ['camera'],   //仅使用相机拍照
          success: function (res) {
            door = "1";
            console.log(res)
            var tempFilePaths = res.tempFilePaths[0];    //此处为上传图片的 临时路径
            let picture = _this.data.picture;
            picture.push(tempFilePaths)    //   存储上传的图片
            _this.setData({
              picture,
            })
            console.log(_this.data.picture)
            //上传服务器
    
            wx.showLoading({
              title: '请求中',
            })
            // let data1 = {
            //   taskId:1
            // }
            wx.uploadFile({
              url: api.DZUPLOADIMG,
              filePath: tempFilePaths,
              // name: "311", 
              name: _this.data.taskId + 'split' + _this.data.notificationNo,
              success: function (res) {
                wx.hideLoading();
                var data = JSON.parse(api.DECRYPT(res.data))
                console.log("==上传图片请求返回成功==" + res);
                console.log(JSON.parse(api.DECRYPT(res.data)))
                if(data.code == '1'){
                  let imgid = _this.data.imgid
                  imgid.push(data.imgId)
                  _this.setData({
                    imgid:imgid
                  })
                }
                console.log(_this.data.imgid)
              },
              complete: function () {
                console.log("upload complete");
              },
              fail: function (res) {
                console.log("==上传图片请求失败==", res);
                // that.SaveLogs("上传图片失败", res + '');
                wx.hideLoading();
              }
            })
          }
        })
      },
    
    展开全文
  • 微信小程序上传图片上传图片JS//index.jsPage({data:{tempFilePaths:[],uploadLinks:[],},uploadImg(){var_this=this;wx.chooseImage({count:9,//默认9sizeType:['original','compressed'],//可以指定是原图...

    在微信小程序里上传图片。

    上传图片

    JS//index.js

    Page({

    data:{

    tempFilePaths:[],

    uploadLinks:[],

    },

    uploadImg() {

    var _this = this;

    wx.chooseImage({

    count: 9, // 默认9

    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有

    sourceType: ['album', 'camera'],      // 可以指定来源是相册还是相机,默认二者都有

    success: function (res) {

    _this.setData({

    tempFilePaths: res.tempFilePaths,   //返回的 res.tempFilePaths 是数组

    uploadLinks: res.tempFiles          //返回的 res.tempFiles 是由多个对象组成的数组

    })

    }

    })

    }

    })

    tempFilePaths、tempFiles 都是 res 的属性,个人有个习惯,喜欢把返回结果,用 console.log(res)  放出来看,返回什么属性一目了然:

    e0f68372de57e6f3fc7e5334fad8aad1.png

    2、保存到本地

    长按图片,保存到本地

    js// pages/jump.js

    Page({

    data:{

    tempFilePaths:[]

    },

    uploadImg() {

    var _this = this;

    wx.chooseImage({

    count: 9, // 默认9

    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有

    sourceType: ['album', 'camera'],      // 可以指定来源是相册还是相机,默认二者都有

    success: function (res) {

    console.log(res);

    _this.setData({

    tempFilePaths: res.tempFilePaths,   //返回的 res.tempFilePaths 是数组

    })

    }

    })

    },

    saveImg(e) {

    wx.showModal({  //弹窗确认是否保存

    title: '保存图片?',

    success: function (res) {

    if (res.confirm) {

    wx.saveImageToPhotosAlbum({  //保存图片

    filePath: e.currentTarget.dataset.name,

    success(res) {

    }

    })

    }

    }

    })

    },

    })

    展开全文
  • 微信小程序实现学车管理项目,涉及多图上传,留言功能等等。
  • 主要介绍了微信小程序上传图片到服务器的实例代码,在文章给大家补充介绍了微信小程序上传一或多张图片的方法,本文给大家介绍的非常详细,具有参考借鉴加载,需要的朋友可以参考下
  • 小程序上传图片示例组件 这是一个上传图片示例组件,目的在于展示如何在小程序中编写组件,请不要一点代码都不改直接拿来用于生产环境哦。 组件的关键设计思路,请看这篇文章 使用方法和注意事项 因为本组件有大量 ...
  • 微信小程序实现文件、图片上传功能的方法发布时间:2020-06-23 09:38:38来源:亿速云阅读:611作者:清晨不懂微信小程序实现文件、图片上传功能的方法?其实想解决这个问题也不难,下面让小编带着大家一起学习怎么去...

    微信小程序实现文件、图片上传功能的方法

    发布时间:2020-06-23 09:38:38

    来源:亿速云

    阅读:611

    作者:清晨

    不懂微信小程序实现文件、图片上传功能的方法?其实想解决这个问题也不难,下面让小编带着大家一起学习怎么去解决,希望大家阅读完这篇文章后大所收获。方法如下:

    1、在微信公众号平台设置uploadFile合法域名

    点击设置-开发设置,可以看到服务器域名,点击修改,设置一下你的uploadFile合法域名。

    43e9eda03447f24eac7696e7cdb8ac87.png

    否则会出现以下错误。

    d9436dd4e58be3ae55324c3c00027bae.png

    2、使用wx.chooseImage和wx.uploadFile实现图片上传

    代码如下

    wx.chooseImage({

    count: 1, // 默认9

    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有

    sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有

    success: function (res) {

    // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片

    var tempFilePaths = res.tempFilePaths;

    wx.uploadFile({

    url: 'https://...', //此处换上你的接口地址

    filePath: tempFilePaths[0],

    name: 'img',

    header: {

    "Content-Type": "multipart/form-data",

    'accept': 'application/json',

    'Authorization': 'Bearer ..' //若有token,此处换上你的token,没有的话省略

    },

    formData:{

    'user':'test' //其他额外的formdata,可不写

    },

    success: function(res){

    var data=res.data;

    console.log('data');

    },

    fail: function(res){

    console.log('fail');

    },

    })

    }

    })

    注:目前微信小程序还不支持base64图片上传

    感谢你能够认真阅读完这篇文章,希望小编分享微信小程序实现文件、图片上传功能的方法内容对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,遇到问题就找亿速云,详细的解决方法等着你来学习!

    展开全文
  • 微信小程序 上传图片

    2018-10-15 15:26:02
    官网文档:... 微信小程序 交互的 图片是单独上传的 uploadDetail(gid) { let that = this if (that.data.detailbox.length != 0) { ...

    官网文档:https://developers.weixin.qq.com/miniprogram/dev/api/network/upload/wx.uploadFile.html

    微信小程序 交互的 图片是单独上传的

      uploadDetail(gid) {
        let that = this
        if (that.data.detailbox.length != 0) {
          let imagebox = that.data.detailbox
          for (let i = 0; i < imagebox.length; i++) {
            console.log('我要上传的每个图片', imagebox[i])
            wx.uploadFile({
              url: api,
              filePath: imagebox[i],
              name: 'files',
              header: {
                "Content-Type": "multipart/form-data"
              },
              method: "POST",
              formData: {
                goods_id: gid
              },
              success: function(res) {
                console.log('图片上传成功', res)
              },
              fail: function() {
                console.log('图片上传失败')
              }
            })
          }
        } else {
          wx.showToast({
            title: '请上传图片',
          })
        }
      },

    提醒:如果是多张图片要一个个上传就是for循环 

    formData 是图片上传的参数

    filePath 必须是字符串所以 Array[i]

    展开全文
  • 最近在做一个教育类的小商城的微信小程序,用到了上传多个图片文件到服务器端,这里做一个讲解,希望对大家有所帮助。1,小程序端:在wxml文件中:删除点击上传作业在js文件中:Page({/** * 页面的初始数据*/data: {...
  • 主要为大家详细介绍了微信小程序上传图片到php服务器的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • 微信小程序上传图片怎么限制大小

    万次阅读 2018-08-04 11:52:34
    最近有一个微信小程序的项目,要求是上传多张图片,数量不能超过3张 ,而且在php里因为上传图片被设置了只能上传2M,导致上传不成功,所以我在前端 设置一个函数,用了微信api(wx.chooseImage)获取图片,如果图片...
  • 项目中肯路能需还定有开都视这讲房哦搞有名需移洁页定会遇到上传文件到服务器端,小程序提供了很有用的ap朋支不器几事为的时后级功发发来久都这样含制层是请些间例业多在上iwxml代码遇新是直朋能到:上传图片js代码...
  • 主要为大家详细介绍了微信小程序上传图片功能,还为大家分享了后端代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • 注:目前微信小程序还不支持base64图片上传。 逻辑是:点击图片小图标,直接上传图片到服务器,然后后台返回图片id码,在提交表单的时候,把图片id码提交到后台,这样是为了绑定id码和记录。提交后,点击图片进行...
  • 微信小程序上传图片到阿里云oss、主要注释都写在js文件里了,相信你们都看的懂哈、你的域名下的/cbb文件下的/当前年月日文件下的/图片.png
  • Image_upload_aliyun 微信小程序上传图片到阿里云oss 我把主要注释都写在js文件里了,相信你们都看的懂哈!!!
  • 主要介绍了微信小程序 上传图片并等比列压缩到指定大小,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
  • 微信小程序上传图片 这是一个新手的学习心得, 小程序上传图片让我在百度找了好久, 最后终于找到了, 现将代码总结一下 //wxml中的代码 <view class='zhaopian' bindtap="chooseImage"> <image src='{{phone...
  • 今天讲解一下微信小程序上传图片或者上传文件的步骤: 首先第一步我们要先在wxml页面文件中写入一个图标或者按钮,用来触发微信调起手机相册和拍照功能,供你选择图片 <image src="/static/images/addimg.png...
  • 微信小程序上传图片到阿里云 第一次发布csdn,作为一个萌新,请多多光照。 问题点:微信小程序上传图片到阿里云 注意:这里粘贴的代码是单个图片上传,如果多个图片请自行修改,可在uploadAliyun.js的uploadFile ...
  • 由于自己最近在搞微信小程序,然后要做一个上传商品的模块,当然就需要上传图片了,然而一开始网上查了好几天关于微信小程序上传图片到服务器的,但是一直没搞定,总是报错。最后在搜索的过程中看到了一句评论说...
  • 微信小程序图片上传 采用的是基于struct的Java后台服务器,所以接受图片是由struct完成。 首先,在微信开发中,微信有自带的API 中wx.uploadfile能实现多图片上传功能,实现代码如下: wx.chooseImage({ count: 1...
  • 微信小程序上传图片到阿里云oss 最近开发微信小程序要求上传图片到阿里云oss上,所以就顺手整理一下整个过程啦。 前提 开通oss服务和创建oss存储空间啦(这个就自己去解决吧)下面接入正题: 步骤一:配置 ...
  • 转 https://www.jianshu.com/p/87fd129b9fda 微信小程序使用iconfont图标 转 http://www.mamicode.com/info-detail-2400457.html 微信小程序上传图片

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 25,088
精华内容 10,035
关键字:

微信小程序上传图片

微信小程序 订阅