//上传头像图片
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,", "");
}

图片文件转换成Base64编码实现ajax提交图片的更多相关文章

  1. js 将图片文件转换成base64

      1.情景展示 在JavaScript中,如何使用图片文件转换成base64? 2.解决方案 /** * 网络图像文件转Base64 * @param img dom对象 */ function g ...

  2. js如何将选中图片文件转换成Base64字符串?

    如何将input type="file"选中的文件转换成Base64的字符串呢? 1.首先了解一下为什么要把图片文件转换成Base64的字符串 在常规的web开发过程中,大部分上传 ...

  3. php 将图片文件转成base64编码的方法

    php 将图片文件转成base64编码的方法<pre><?php /** 文件转base64输出 * @param String $file 文件路径 * @return Strin ...

  4. Java对网络图片/本地图片转换成Base64编码和解码

    一.将本地图片转换成Base64编码字符串 /** * 将本地图片转换成Base64编码字符串 * * @param imgFile 图片目录路径 * @return */ public static ...

  5. delphi将图片转换成Base64编码函数

    {************************************************************************** 名称: BaseImage 参数: fn: TF ...

  6. Linux中将一个GBK编码的文件转换成UTF-8编码文件

    Linux中将一个GBK编码的文件转换成UTF-8编码文件 使用iconv 命令iconv -f GBK -t UTF-8 file1 -o file2 输出另一个文件,然后再覆盖源文件内容

  7. WPF中实现图片文件转换成Visual对象,Viewport3D对象转换成图片

    原文:WPF中实现图片文件转换成Visual对象,Viewport3D对象转换成图片 1.图片文件转换成Visual对象 private Visual CreateVisual(string imag ...

  8. 图片转换成Base64编码集成到html文件

    首先为什么要这么做?  原因很简单这样可以减少与服务器的请求,当然对于一些浏览器并不支持,如IE8.通常用在手机版网站中,具体转化方法如下: 1.在线打开Base64的编码器将图片编码成Base64 ...

  9. 利用PHP将图片转换成base64编码的实现方法

    先来说一下为什么我们要对图片base64编码 base64是当前网络上最为常见的传输8Bit字节代码的编码方式其中之一.base64主要不是加密,它主要的用途是把某些二进制数转成普通字符用于网络传输. ...

随机推荐

  1. git branch 进入编辑状态

    命令行输入git branch,发现进入编辑状态,都要:wq,非常不方便,这样配置 git config --global core.pager ''

  2. Linux总结(十二)set_uid set_gid stic_bit 软链接 硬链接

    一 set_uid 之前我们修改普通用户的登陆密码,都是以管理员身份在操作,比如我们在lv账户下,我们使用sudo passwd lv 重置lv账户密码,此时我们直接拿到root权限忽略掉了文件权限的 ...

  3. 创建blob地址

    aa="121" "121" b=new Blob([aa]) Blob(3) {size: 3, type: ""} window.URL ...

  4. CToolBarCtrl工具栏设置总结(转)

    (一)工具条控制的主要功能 所谓工具条就是具有位图和分隔符组成的一组命令按钮,位图按钮部分可以是下推按钮.检查盒按钮.无线按 钮等.工具条对象类派生于主窗口架框类CframeWnd或CMDIFrame ...

  5. MySql第几行到第几行语句

    1.查询第一行记录: select * from table limit 1 2.查询第n行到第m行记录 select * from table1 limit n-1,m-n; SELECT * FR ...

  6. css清除间隙

    .clear{clear:both;height:0;width:0;line-height:0;overflow:hidden;}

  7. AtomicStampedReference解决ABA问题

      在运用CAS做Lock-Free操作中有一个经典的ABA问题: 线程1准备用CAS将变量的值由A替换为B,在此之前,线程2将变量的值由A替换为C,又由C替换为A,然后线程1执行CAS时发现变量的值 ...

  8. 使用 jTessBoxEditor 生成 tesseract-orc 的字典

    本文使用图片方式记录使用 jTessBoxEditor 一站式生成自动文件的方式 首先感谢 Tesseract OCR 讨论群 389402579 的管理员[创世倾城 QQ:457606663] 的帮 ...

  9. chromium之observer_list

    典型用法如下 /////////////////////////////////////////////////////////////////////////////// // // OVERVIE ...

  10. python装饰器内获取函数有用信息方法

    装饰器内获取函数有用信息方法 .__doc__用于得到函数注释信息 .__name_用于得到函数名 在函数引用装饰器的时候,函数名会变为装饰器内部执行该函数的名字,所有在直接执行函数名加.__doc_ ...