前端代码
<div class="fullface @if(isset($qyInfo['qyInfo']['front_url'])) on @endif">
<i></i>
<p><span>点击上传</span>营业执照</p>
<input class="uploadfile" type-img="front" name="mypic" type="file">
<img src="{{isset($qyInfo['qyInfo']['front_url'])?$qyInfo['qyInfo']['front_url']:''}}" id="front_url" alt="正面">
</div>
<script>
// 存储处理过的文件对象
var filelist = {};
//将base64转换为文件
function dataURLtoFile(dataurl, filename) {
var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
while(n--){
u8arr[n] = bstr.charCodeAt(n);
}
return new File([u8arr], filename, {type:mime});
}
$(function () {
// 表单数据提交
$('.authentication_submit').click(function(){
//获取数据
var realname = $('#realname').val();
var realname_reg = /^[\u4E00-\u9FA5\uF900-\uFA2D]{2,6}$/;
var idcard = $('#idcard').val();
var copm_name = $('#copm_name').val();
// var idcard_reg = /^(\d{6})+(\d{4})+(\d{2})+(\d{2})+(\d{3})([0-9]|X)$/;
var front_url = $('#front_url').attr('src');
//验证身份证姓名
if(!realname_reg.test(realname)){
layer.msg('只能输入2-6位的姓名',{icon:0});
return;
}
//验证社会信用代码
if(idcard.length <=0){
layer.msg('请输入统一社会信用代码',{icon:0});
return;
}
if(idcard.length <=0){
layer.msg('请输入统一社会信用代码',{icon:0});
return;
}
//验证身份证正面
if(copm_name.length <=0){
layer.msg('请填写企业名称',{icon:0});
return;
}
if(front_url.length <=0){
layer.msg('请上传营业执照正面',{icon:0});
return;
}
var formData = new FormData();
formData.append('realname',realname);
formData.append('idcard',idcard);
formData.append('copm_name',copm_name);
formData.append('front_url',front_url);
formData.append('_token',$('#_token').val());
// 将文件添加到form表单里面，发送给后台
for (let key in filelist){
formData.append(key,filelist[key]);
}
// 将数据发送给后台~上传保存到七牛，保存实名信息
$.ajax({
url: '/userCenter/certification_qy_update' ,
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (data) {
var data = eval("(" + data + ")");
if(data.status ==1){
layer.msg(data.msg,{icon:1});
setTimeout(function () {
window.location.href = '/userCenter';
},1500)
}else {
layer.msg(data.msg,{icon:0});
}
},
error: function (data) {
layer.msg(data,{icon:0});
}
});
});
// 保存 压缩过的图片对象
$(".uploadfile").change(function (ev) {
var filename ;
var fileMaxSize = 1024*2;//2M
var quality = 0.62; // 图像质量
var _this = $(this);
var imgType = $(this).attr('type-img');
//判断 FileReader 是否被浏览器所支持
if (!window.FileReader) return;
var file = ev.target.files[0];
if (!file) {
layer.msg('上传失败，请重新操作！', {icon: 0, shade: [0.3, '#393D49'], shadeClose: true});
return;
}
filename = file.name;
//判断图片格式~
if (!file.type.match('image/*')) {
layer.msg('请选择格式为（jpg、png、jpeg）的图片文件！', {icon: 0, shade: [0.3, '#393D49'], shadeClose: true});
ev.target.value = ""; //显示文件的值赋值为空
return;
}
//file.size 文件字节数
if ((file.size / 1024) > fileMaxSize) {
layer.msg('请选择小于2M的图片！', {icon: 0, shade: [0.3, '#393D49'], shadeClose: true});
ev.target.value = ""; //显示文件的值赋值为空;
return;
}
var _image = new Image();
// 创建FileReader对象
var reader = new FileReader();
// 读取file对象，读取完毕后会返回result 图片base64格式的结果
reader.readAsDataURL(file);
reader.onload = function (e) {
_image.src = e.target.result
}
// 图片压缩，加水印，
_image.onload = function () {
if (this.complete) {
var canvas = document.createElement('canvas');
canvas.width = _image.width
canvas.height = _image.height
var ctx = canvas.getContext("2d");
ctx.drawImage(_image, 0, 0, _image.width, _image.height);
// ctx.font = "20px microsoft yahei";
// ctx.fillStyle = "rgba(255,255,255,0.5)";
// ctx.fillText('zhoushuai',30,30);
//base64文件
var dataUrl = canvas.toDataURL(file.type, quality);
//将base64转换为文件对象
var fileObj = dataURLtoFile(dataUrl,filename);
//全局对象保存文件
filelist[imgType] = fileObj;
canvas.toBlob(function (blob) {
var url = '';
if (window.createObjectURL !== undefined) {
url = window.createObjectURL(blob)
} else if (window.URL !== undefined) {
url = window.URL.createObjectURL(blob)
} else if (window.webkitURL !== undefined) {
url = window.webkitURL.createObjectURL(blob)
}
_this.next('img').attr('src', url);
_this.parent('div').addClass('on');
}, file.type, quality);
}
}
/*var _this = $(this);
var formData = new FormData();
var file =_this.context.files[0];
var _token = $('#_token').val();
formData.append('mypic',file);
formData.append('_token',_token);
$.ajax({
url: "/userCenter/uploadFile",
data: formData,
type: "Post",
dataType: "json",
contentType: false,
/!**
* 必须false才会避开jQuery对 formdata 的默认处理
* XMLHttpRequest会对 formdata 进行正确的处理
*!/
processData: false,
success: function (data) {
if(data.status ==1){
_this.next('img').attr('src',data.pic);
_this.parent('div').addClass('on');
}else {
alert(data.msg);
}
}
})*/
});
});
</script>
后端代码：
/**
* @author Jhou Shuai
* @desc 实名认证数据整理、证件照上传
*/
private function certDataHandle(&$data){
// 过滤掉不需要的数据。方便入库
unset($data['code']);
unset($data['_token']);
unset($data['front']);
unset($data['back']);
unset($data['hold']);
// 证件照上传
if(isset($_FILES)){
$img = new Image();
foreach ($_FILES as $key=>$file){
$result = $img->uploadImage($file);
if(isset($result['error'])){
$infos['status'] = 0;
$infos['msg'] = $result['error'];
die(json_encode($infos));
}
$index = $key."_url";
$data[$index] = $result;
}
}
}
public function certification_qy_update(Request $request){
//获取实名认证的参数
$user = Session::get('yd_user');
$data = $request->all();
//实名认证数据整理、证件照上传
$this->certDataHandle($data);
// 此处省略三千字...
}
网友评论