//上传头像图片
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. php签到

    <?php namespace Member\Controller; use Member\Controller\MController; class IndexController exten ...

  2. 几句代码简单实现IoC容器

    前言 最近在调试EasyNetQ代码的时候发现里面有一段代码,就是IoC容器的简单实现,跟着他的代码敲了一遍,发现了奇妙之处.当然也是因为我才疏学浅导致孤陋寡闻了.他的思路就是通过动态调用构造函数生成 ...

  3. 提交文件到ng-pages分支

    一.提交dist文件夹到ng-pages分支 git subtree push --prefix=dist origin gh-pages 二.提交所有文件到ng-pages分支 text git:( ...

  4. 第27章 LTDC/DMA2D—液晶显示

    本章参考资料:<STM32F76xxx参考手册2>.<STM32F7xx规格书>.库帮助文档<STM32F779xx_User_Manual.chm>. 关于开发板 ...

  5. Truncated class file 问题的解决

    替换class 文件之后出现了 Truncated class file  问题,查找原因,可能是文件损坏,清理缓存可以解决 解决办法: 把tomcat的work目录直接删掉,让他重新启动.rm -r ...

  6. direct path write 等待事件导致数据库hang

    同事反应十几分钟前数据库好像挂起了一会,让我排查数据库是否存在什么问题. 第一反应看当前数据库还是否有什么等待事件,结果有direct path write等待事件. 于是抓了问题时间段20分钟的AS ...

  7. 二、HDFS 架构

    源自:http://hadoop.apache.org/docs/stable/hadoop-project-dist/hadoop-hdfs/HdfsDesign.html HDFS has a m ...

  8. linuxc - entos 7.3 开放端口并对外开放

    1. 查看已打开的端口 # netstat -anp 2. 查看想开的端口是否已开 # firewall-cmd --query-port=666/tcp 若此提示 FirewallD is not ...

  9. JS中的原型规则与原型链

    1. 原型规则 A. 所有的引用类型(数组.对象.函数),都具有对象特性,即可自由扩展属性: var arr = []; arr.a = 1;B. 所有的引用类型(数组.对象.函数),都有一个_pro ...

  10. hdu_5187_zhx's contest

    Problem Description As one of the most powerful brushes, zhx is required to give his juniors n probl ...