专业的广州万博manbetx客户端主页公司、广州网站设计制作公司为您服务,电话:020-85548809,29883069
新闻中心
专业专注专心,行业行情行规
分享交流,永无止境,我们愿与您共同进步

通过JQ上传图片base64数据应该注意的事项

发布日期:[2018/9/26]   编辑:奇亿广州万博manbetx客户端主页

当我们使用JQ的AJAX进行图片base64数据上传时会遇到几个常见问题,下面列出几条应该注意的事项:

1,应去掉图片头如:“data:image/jpeg;base64,”,在转换图片base64数据时会自动在前面加上图片信息,如“data:image/png;base64,”、“data:image/jpg;base64,”、“data:image/jpeg;base64,”、“data:image/gif;base64,”、“data:image/bmp;base64,”等等,我们应该去掉这些才能保存图片,在上传前客户端或者上传后服务端处理都行。

2,AJAX传输时会自动把内容里的“+”自动转换成空格,在上传前我们应该将“+”符号进行编码。

完整客户端代码:
var localData0 = res.localData;    // localData是图片的base64数据,可以用img标签显示
var localData =localData0.replace(/^.*?,/,'');    // 去掉各类图片头
var localData = localData.replace(/\+/g, "%2B");   // 把+替换成编码 %2B是加号的编码
$.ajax({  //通过ajax来将base64数据发送给服务器端
                                url:"topic.php",
                                data:{'localData':localData},    //localData为图片已经转换好的base64编码
                                type:"post",
                                dataType: "text",
                                async:false,//false表示异步执行,true同步
                                success:function(res){
var text = document.getElementById("picurl").&#118alue;  //取出picurl之前的值
var text1= text+","+res;    //多图上传时的多图片路径拼合
document.getElementById("picurl").&#118alue=text1; //上传成功后返回图片路径赋值给picurl
                                },
                            });

然后服务器端就可以将图片base64数据保存为图片了,具体代码百度很多。

 

广州建网站、广州做网站
或者将本文《通过JQ上传图片base64数据应该注意的事项》收藏和分享到:
复制本文《通过JQ上传图片base64数据应该注意的事项》地址给好友: