图片文件转换成Base64编码实现ajax提交图片
2024-08-31 13:50:35
//上传头像图片
function uploadHead(imgPath) {
console.log("imgPath = " + imgPath);
var image = new Image();
image.onload = function() {
var imgData = getBase64Image(image);
/*在这里调用上传接口*/
mui.ajax($serverPath + "app/modifyHead", {
data: {
'imgData': imgData,
'userId': plus.storage.getItem("userId")
},
dataType: 'json',
type: 'post',
timeout: 10000,
success: function(data) {
if(data.result == 'yes') {
$newHead = data.newHeadPath;
console.log('上传成功!!!!!!!!!!' + $newHead);
plus.storage.setItem("userHead", $newHead);
mui.toast("头像修改成功!");
} else {
mui.toast("头像上传失败!");
}
},
error: function(xhr, type, errorThrown) {
mui.toast('网络异常,请稍后再试!');
}
});
}
image.src = imgPath;
image.style.width = "60px";
image.style.height = "60px";
console.log("haha");
}
//将图片压缩转成base64
function getBase64Image(img) {
var canvas = document.createElement("canvas");
var width = img.width;
var height = img.height;
// calculate the width and height, constraining the proportions
if(width > height) {
if(width > 100) {
height = Math.round(height *= 100 / width);
width = 100;
}
} else {
if(height > 100) {
width = Math.round(width *= 100 / height);
height = 100;
}
}
canvas.width = width; /*设置新的图片的宽度*/
canvas.height = height; /*设置新的图片的长度*/
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, width, height); /*绘图*/
var dataURL = canvas.toDataURL("image/png", 0.8);
return dataURL.replace("data:image/png;base64,", "");
}
最新文章
- AndroidProjects个人项目归纳
- mysql存储过程编写-入门案例-遁地龙卷风
- LeetCode之389. Find the Difference
- golang实现随机数
- HBase与MongDB等NoSQL数据库对照
- 0525Scram项目6.0
- Eclipse中FindBugs插件的应用
- Myeclipse6.0 在线安装svn插件
- 线程操作案例--生产者与消费者,Object类对线程的支持
- Pascal’s Triangle
- 了解ThinkPHP(一)
- struts2学习笔记(4)——数据类型转换
- hive 桶相关特性分析
- python 程序穩定性閒談-續集
- Oracle EBS-SQL (WIP-10):检查车间任务状态“完成”但未发料数据.sql
- String.getBytes()--->;字符串转字节数组
- asp 操作 json
- 设计理念 : popup login 在前后台
- java 三种工厂模式
- hbase的一些要点