微信小程序之多张图片上传到PHP后台
多张图片上传到PHP后台并存入数据库
微信前台代码
多张图片递归上传js
// pages/demo4/demo4.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 上传照片//选择图片时限制9张，如需超过9张，同理亦可参照此方法上传多张照片
*/
uploadImg: function () {
var that = this;
wx.chooseImage({
count: 2,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: function (res) {
var successUp = 0; //成功
var failUp = 0; //失败
var length = res.tempFilePaths.length; //总数
var count = 0; //第几张
that.uploadOneByOne(res.tempFilePaths, successUp, failUp, count, length);
},
});
},
/**
* 采用递归的方式上传多张
*/
uploadOneByOne(imgPaths, successUp, failUp, count, length) {
var that = this;
wx.showLoading({
title: '正在上传第' + count + '张',
})
wx.uploadFile({
url: 'http://49.122.47.146/php-yuyin/upload.php', //仅为示例，非真实的接口地址
filePath: imgPaths[count],
name: 'file',//示例，使用顺序给文件命名
success: function (e) {
successUp++;//成功+1
},
fail: function (e) {
failUp++;//失败+1
},
complete: function (e) {
count++;//下一张
if (count == length) {
//上传完毕，作一下提示
console.log('上传成功' + successUp + ',' + '失败' + failUp);
wx.showToast({
title: '上传成功' + successUp,
icon: 'success',
duration: 2000
})
} else {
//递归调用，上传下一张
that.uploadOneByOne(imgPaths, successUp, failUp, count, length);
console.log('正在上传第' + count + '张');
}
}
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
单张图片上传js
// pages/demo4/demo4.js
Page({
/**
* 页面的初始数据
*/
data: {
},
uploadImg:function(){
wx.chooseImage({
success(res) {
const tempFilePaths = res.tempFilePaths
wx.uploadFile({
url: 'http://49.122.47.146/php-yuyin/upload.php', //仅为示例，非真实的接口地址
filePath: tempFilePaths[0],
name: 'file',
formData: {
'user': 'test'
},
success(res) {
const data = res.data
//do something
}
})
}
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
PHP后台代码