我的项目代码 上传到laravel
function uploadImgs(event) {
var e=window.event||event;
var that = e.target;
// 获取当前选中的文件
var length = e.target.files.length;
// 没有文件的时候不执行程序
var formData = new FormData();
// 判断文件的数量
if(length > 3){
$.alert("单次文件上传数量不能大于3张!");
return;
}
// 判断文件的尺寸
for (var i=0 ;i< length; i++) {
var file = e.target.files[i];
if(file.size > 10*1024 * 1024){
$.alert("文件尺寸不能大于10M");
return;
}
}
// 追加到from对象
for (var i=0 ;i< length; i++) {
var file = e.target.files[i];
formData.append("file[]" , file);
}
//遮罩层开启
$('.weui-loadmore').show();
$.ajax({
url: "/wx/apply/step/upload/file",
type: "post",
data: formData ,
processData : false, //必须false才会自动加上正确的Content-Type
cache: false, //上传文件不需要缓存
contentType : false ,
success: function(res) {
//遮罩层关闭
$('.weui-loadmore').hide();
if(res.code == 0){
$.toast(res.text, 1000);
$(that).attr('value', res.data).prev().prev().text(res.data.slice(-16));
$(that).attr('name',res.data)
}else{
$.toast(res.text, "cancel");
}
console.log(res);
},
error: function(err){
console.log(err)
}
});
}
我的代码,上传到七牛
function uploadImg(event) {
var e=window.event||event;
var that = e.target;
$(that).attr('value','');
// 获取当前选中的文件
var length = e.target.files.length;
// 判断文件的数量
if(length > 3){
$.alert("单次文件上传数量不能大于3张!");
return;
}
// 判断文件的尺寸
for (var i=0 ;i< length; i++) {
var file = e.target.files[i];
if(file.size > 10*1024 * 1024){
$.alert("文件尺寸不能大于10M");
return;
}
}
//需要上传的图片内容 base64格式
var imgStr = '';
//七牛云平台 配置的域名
var urlHeader = "http://qiniu.yunyidai.net/";
qnToken(token);
// 追加到from对象
var allImgSrc = '';
$('.weui-loadmore').show();
for (var i=0 ;i< length; i++) {
imgStr = '';
var reader = new FileReader();
var file = e.target.files[i];
//文件后缀
var prifix = file.name.split('.')[1];
//七牛云图片base64格式上传地址
var uploadUrl = "https://upload.qiniup.com/putb64/-1/key/" + window.btoa("customer_"+ parseInt(Math.random()*9999999) + new Date().getTime()+"_"+parseInt(Math.random()*9999999) + '.' + prifix);
reader.readAsDataURL(file);
reader.onload = function(e) {
//获取到base64格式的图片
imgStr = reader.result.split(',')[1];
$.ajax({
headers: {
'Authorization' : "UpToken " + qiniutoken
},
url: uploadUrl,
type: 'POST',
data: imgStr,
success: function (res) {
var result = res;
var that_attr_name = $(that).attr('value');
if(!that_attr_name){
that_attr_name = [];
}else{
that_attr_name = $(that).attr('value').split(',');
}
that_attr_name.push(qiniuhost + result.key);
// console.log(result.hash);
$(that).attr('value',that_attr_name.join(',')).prev().prev().text(result.hash);
console.log(that_attr_name.join(','));
}
});
}
}
$('.weui-loadmore').hide();
$.toast('上传成功!', 1000);
}
网络同仁的代码
function upload(input) {
$(input).change(function(){
var file = this.files[0];
// if(file.type.indexOf('image') != 0) { // 只上传图片}
if (window.FileReader) {
var reader = new FileReader();
reader.readAsDataURL(file);
//监听文件读取结束后事件
reader.onloadend = function (e) {
var size = e.total;
if(size>1048576){
alert('图片大小不能超过1M');
return;
}
var data64 = e.target.result; // data64
data64 = data64.slice(data64.indexOf(',')+1); // 截取前缀的base64 data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAnoAAAJeCAYAA.......
putb64(size,data64); // 执行上传
};
}
});
function putb64(size,data64){
var pic = data64; // 填写你的base64后的字符串
var url = "http://upload.qiniu.com/putb64/"+size+'/key/'+window.btoa("0612_"+ new Date().getTime()+"_"+parseInt(Math.random()*10));
var xhr = new XMLHttpRequest();
xhr.onreadystatechange=function(){
if (xhr.readyState==4){ // xhr.responseText => "{"hash":"Fto5o-5ea0sNMlW_75VgGJCv2AcJ","key":"Fto5o-5ea0sNMlW_75VgGJCv2AcJ"}"
$('.book-pic-message').hide();
var back_json = JSON.parse(xhr.responseText);
$('.book-pic-preview').append('![](http://ogiwpf1aa.bkt.clouddn.com/'+back_json.key+')').show();
$('.book-pic-clear').css('background','#4c4c4c').show();
}
};
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-Type", "application/octet-stream");
xhr.setRequestHeader("Authorization", "UpToken 你自己的七牛token");
xhr.send(pic);
}
}
function del(button) {
//清除input file已选中的文件
$(button).siblings('.input-file').wrap('<form></form>');
$(button).siblings('form')[0].reset();
$(button).siblings('form').find('.input-file').unwrap();
$(button).siblings('.book-pic-preview').find('img').remove();
$(button).hide();
$('.book-pic-preview').hide();
$('.book-pic-message').show();
}
网友评论