小程序WXML
<form bindsubmit="formSubmit" class="form" bindreset="formReset">
<view class="learncontent"><textarea name="content" placeholder="分享你的体验~"></textarea></view>
<view class='uploader-img flex justify-content-start' wx:if="{{pics}}">
<view class='uploader-list' wx:for="{{pics}}" wx:key="item.length">
<image src='{{item}}' class="uploaditem" data-index="{{index}}" mode="widthFix" bindtap='previewImg1'/>
<image class='delete' data-index="{{index}}" src='/public/images/del.png' mode="widthFix" bindtap='deleteImg'/>
</view>
</view>
<view class='upAdd' bindtap='chooseImg'>+</view>
<view class="btn-area">
<button formType="submit" data-status='1' style="width:50%;color:#02B0EF">保存</button>
<button formType="submit" data-status='2' style="width:50%">发布</button>
</view>
</form>
小程序JS
// pages/learn/add.js
const app = getApp();
Page({
/**
* 页面的初始数据
*/
data: {
pics: [],
//图片
navH: '',
imgfiles: ''
},
//提交数据
formSubmit: function(e) {
var that = this;
if (e.detail.value.title == '') {
wx.showToast({
title: '请输入标题',
icon: 'none',
duration: 2000
});
return false;
}
if (e.detail.value.content == '') {
wx.showToast({
title: '请输入内容',
icon: 'none',
duration: 2000
});
return false;
}
if (e.detail.value.imgfiles == '') {
wx.showToast({
title: '请上传图片',
icon: 'none',
duration: 2000
});
return false;
}
wx.request({
url: app.globalData.http + 'wechat/wechat/doaddlearn',
data: {
'title': e.detail.value.title,
'content': e.detail.value.content,
'create_id': app.globalData.userid,
'imgfiles': that.data.imgfiles,
'status': e.detail.target.dataset.status,
's_id': that.data.serverid
},
header: {
'content-type': 'application/json' // 默认值
},
success: function(res) {
// console.log(app.globalData.userid);
if (res.data.code) {
wx.showToast({
title: res.data.msg,
icon: 'none',
duration: 2000
}) setTimeout(function() {
wx.reLaunch({
url: '/pages/learn/index'
})
},
2000);
} else {
wx.showToast({
title: res.data.msg,
icon: 'none',
duration: 2000
})
}
}
});
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
var that = this;
console.log(options) that.setData({
'navH': app.globalData.navHeight,
'serverid': options.serverid,
'company_name': options.title
});
},
previewImg: function(e) {
var index = e.target.dataset.index; //当前图片地址
var imgArr = e.target.dataset.list; //所有要预览的图片的地址集合 数组形式
wx.previewImage({
current: imgArr[index],
urls: imgArr,
})
},
/**
* 图片上传
*
*/
//上传图片开始
chooseImg: function(e) {
var that = this,
pics = this.data.pics;
if (pics.length < 3) {
wx.chooseImage({
count: 9,
// 最多可以选择的图片张数,默认9
sizeType: ['original', 'compressed'],
// original 原图,compressed 压缩图,默认二者都有
sourceType: ['album', 'camera'],
// album 从相册选图,camera 使用相机,默认二者都有
success: function(res) {
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
var tempFilePaths = res.tempFilePaths;
for (var i = 0; i < tempFilePaths.length; i++) {
pics.push(tempFilePaths[i]);
}
that.setData({
pics: pics
});
//上传接口
var tempFilePaths = res.tempFilePaths;
wx.uploadFile({
url: app.globalData.http + 'wechat/wechat/uploadimg',
filePath: tempFilePaths[0],
name: 'file',
success: function(res) {
//打印
var photofile = JSON.parse(res.data);
console.log(photofile) if (photofile.errCode == 200) {
that.setData({
'imgfiles': that.data.imgfiles + app.globalData.http + '/public/upload/weixin/' + photofile.file + ';'
});
} else {
wx.showToast({
title: photofile.msg,
icon: 'none',
duration: 2000
})
}
}
});
},
});
} else {
wx.showToast({
title: '最多上传9张图片',
icon: 'none',
duration: 3000
});
}
},
// 删除图片
deleteImg: function(e) {
var that = this;
var pics = this.data.pics;
var index = e.currentTarget.dataset.index;
pics.splice(index, 1);
console.log(pics) this.setData({
pics: pics,
})
},
// 预览图片
previewImg1: function(e) {
//获取当前图片的下标
var index = e.currentTarget.dataset.index;
//所有图片
var pics = this.data.pics;
wx.previewImage({
//当前显示图片
current: pics[index],
//所有图片
urls: pics
})
},
navBack: function() {
wx.switchTab({
url: '/pages/learn/index',
});
},
onShareAppMessage: function() {}
})
PHP
public function doaddlearn() {
$data = input();
$saveData = [];
$saveData['content'] = $data['content'];
$saveData['imgfiles'] = $data['imgfiles'];
//验证内容
$accessToken = $this - >gettoken();
$url = "https://api.weixin.qq.com/wxa/msg_sec_check?access_token=".$accessToken;
$examdata = json_encode(['content' = >$data['content']], JSON_UNESCAPED_UNICODE);
$respon = $this - >curlRequest($url, 'post', $examdata);
$respon = json_decode($respon, true);
if ($respon['errcode'] == 87014) {
return json(array('code' = >'', 'msg' = >'效验失败,内容含有违法违规内容')); //效验失败,内容含有违法违规内容
}
//验证图片
$files = explode(';', $data['imgfiles']);
$accessToken = $this - >gettoken();
foreach($files as $k = >$v) {
if (!empty($v)) {
$url = "https://api.weixin.qq.com/wxa/img_sec_check?access_token=".$accessToken;
$file_path = $_SERVER['DOCUMENT_ROOT']. (substr($v, 27)); //接受表单文件保存本地的文件地址
$file_data = array("media" = >new\CURLFile($file_path));
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, FALSE);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $file_data);
$output = curl_exec($ch); //发送请求获取结果
curl_close($ch); //关闭会话
$output = json_decode($output, true);
if ($output['errcode'] == 87014) {
return json(array('code' = >'', 'msg' = >'效验失败,内容含有违法违规内容'));
}
}
}
$rs = DB: :table('t_learns') - >insert($saveData);
if ($rs) {
if ($data['status'] == 1) {
return json(array('code' = >'200', 'msg' = >'保存成功'));
} else {
return json(array('code' = >'200', 'msg' = >'发布成功'));
}
} else {
if ($data['status'] == 1) {
return json(array('code' = >'', 'msg' = >'保存失败'));
} else {
return json(array('code' = >'', 'msg' = >'发布失败'));
}
}
}
public function curlRequest($url,$mothed = "GET" , $data = array())
{
$ch = curl_init();
$header = "Accept-Charset: utf-8";
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_CUSTOMREQUEST, $mothed);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, FALSE);
curl_setopt($ch, CURLOPT_USERAGENT, 'Mozilla/5.0 (compatible; MSIE 5.01; Windows NT 5.0)');
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
curl_setopt($ch, CURLOPT_AUTOREFERER, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $data);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
$temp = curl_exec($ch);
curl_close($ch);
return $temp;
}
效果图