小白接口：https://www.yesapi.cn/

1. 使用的小白接口:App.CDN.UploadImg

链接：http://api.okayapi.com/?s=App.CDN.UploadImg

先再小程序的微信公众平台上设置小白域名为合法域名
使用这个接口时，先手动在小白后台取消App.CDN.UploadImg的签名设置。
这边的数据参数以formData上传，使用post方式请求接口
如果感觉不太安全可以使用方法2

2. 小程序样例代码

页面的布局（添加图片就可以上传）：

    <view class="weui-uploader"><view class="weui-uploader__hd"><view class="weui-uploader__title">图片上传</view></view><view class="weui-uploader__bd"><block wx:for="{{imagesList}}" wx:key="*this" ><view class="weui-uploader__file"><image class="weui-uploader__img" src="{{item}}"></image></view></block><view class="weui-uploader__input-box"><input class="weui-uploader__input js_file" type="file"accept="image/jpg,image/jpeg,image/png,image/gif"multiple="" bindtap='uploader' name="images"></input></view></view></view>

处理图片与请求服务（使用小程序的API：uploadFile）

请求成功返回七牛云链接

    wx.chooseImage({count: 6, //最多可以选择的图片总数sizeType: ['original','compressed'], // 可以指定是原图还是压缩图，默认二者都有sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有success: function(res) {wx.showToast({title: '正在上传...',icon: 'loading',mask: true,duration: 500})for(let i=0;i<res.tempFiles.length;i++){if(res.tempFiles[i].size>maxSize){flag=false;wx.showModal({content: '图片太大，不允许上传',showCancel: false,success: function (res) {if (res.confirm) {console.log('用户点击确定')}}});}}const tempFilePaths = res.tempFilePaths[0]if (res.tempFiles.length>maxLength){wx.showModal({content: '最多能上传'+maxLength+'张图片',showCancel:false,success:function(res){if(res.confirm){console.log('确定');}}})}if (flag == true && res.tempFiles.length <= maxLength){that.setData({imagesList: res.tempFilePaths})}//请求接口wx.uploadFile({url: getApp().globalData.okayapiHost,filePath: tempFilePaths,name: 'file',header: {"Content-Type": "application/x-www-form-urlencoded"},formData: {file_name : 'Camaro.png',app_key : 'your appkey',s:"App.CDN.UploadImg"},})console.log(res);},})

小程序使用小白接口上传图片方法1相关推荐

微信小程序直播商品接口上传图片 300006 goods img upload fail
微信小程序直播商品接口上传图片 300006 goods img upload fail 官方文档:https://developers.weixin.qq.com/miniprogram/dev ...
小程序---调用后端接口的方法
小程序---调用后端接口的方法学习小程序一段时间了,写页面对我来说没有任何问题.最近学习如何请求后端接口,本来想请求项目中正在用的接口,可是无缘,微信小程序不允许.官方给出的提示是,接口必须有域名且 ...
微信小程序搭配小白接口，自己没有服务器也能开发哦
这里将重点介绍,在自己没有服务器的情况下,如何在微信小程序里直接调用小白接口. 前提假设你已经开通微信小程序,如果还没有,可前往微信公众平台开通:https://mp.weixin.qq.com 假 ...
针对小程序wx.getUserProfile接口将被收回后做出的授权调整
小程序文档中提出的调整说明调整说明: 自 2022 年 10 月 25 日 24 时后(以下统称 "生效期" ),用户头像昵称获取规则将进行如下调整: 自生效期起,小程序 wx. ...
linux httppost 请求接口参数被截断_记一次小程序图片安全接口和CountDownLatch的使用...
背景: 我们的小程序由于之前没接入微信官方提供的信息安全接口,导致被警告,下掉了被搜索的权限(手动狗头).然后这两天就花时间在接入上面了,遇到的坑还是挺多的. 微信原开发文档地址:https://de ...
微信小程序注册/登录接口开发
文章目录后端有关说明前端有关说明接口设计小程序注册/登录接口 APP 注册/登录接口 PC Web 端的注册/登录接口小程序注册/登录序列图校验 token 后端有关说明登录和注册的逻辑 ...
小程序Canvas原有接口不再维护
画布.2.9.0 起支持一套新 Canvas 2D 接口(需指定 type 属性),同时支持同层渲染,原有接口不再维护.  <canvas t ...
微信小程序之获取接口数据展示
上篇说到获取编辑框文本,没看过去看看. 本片介绍简单的接口数据获取,并且展示,采取模拟数据,拉取数据方式方法.文章最后附上DEMO 本篇暂未考虑美化问题,只看功能.如图: 一.简单介绍 1> w ...
微信小程序wx.getLocation接口审核不通过
审核不通过的原因一般包含这几种: 一.当前提审小程序代码包中地理位置相关接口( wx.getLocation )暂未开通分析原因:接口未开通. 解决方法:按下图申请开通对应的接口即可. 二.你所描述 ...

小程序使用小白接口上传图片方法1

1. 使用的小白接口:App.CDN.UploadImg

2. 小程序样例代码

页面的布局（添加图片就可以上传）：

处理图片与请求服务（使用小程序的API：uploadFile）

请求成功返回七牛云链接

小程序使用小白接口上传图片方法1相关推荐

最新文章

热门文章