图片文件转换成Base64编码实现ajax提交图片
//上传头像图片
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提交图片的更多相关文章
- js 将图片文件转换成base64
1.情景展示 在JavaScript中,如何使用图片文件转换成base64? 2.解决方案 /** * 网络图像文件转Base64 * @param img dom对象 */ function g ...
- js如何将选中图片文件转换成Base64字符串?
如何将input type="file"选中的文件转换成Base64的字符串呢? 1.首先了解一下为什么要把图片文件转换成Base64的字符串 在常规的web开发过程中,大部分上传 ...
- php 将图片文件转成base64编码的方法
php 将图片文件转成base64编码的方法<pre><?php /** 文件转base64输出 * @param String $file 文件路径 * @return Strin ...
- Java对网络图片/本地图片转换成Base64编码和解码
一.将本地图片转换成Base64编码字符串 /** * 将本地图片转换成Base64编码字符串 * * @param imgFile 图片目录路径 * @return */ public static ...
- delphi将图片转换成Base64编码函数
{************************************************************************** 名称: BaseImage 参数: fn: TF ...
- Linux中将一个GBK编码的文件转换成UTF-8编码文件
Linux中将一个GBK编码的文件转换成UTF-8编码文件 使用iconv 命令iconv -f GBK -t UTF-8 file1 -o file2 输出另一个文件,然后再覆盖源文件内容
- WPF中实现图片文件转换成Visual对象,Viewport3D对象转换成图片
原文:WPF中实现图片文件转换成Visual对象,Viewport3D对象转换成图片 1.图片文件转换成Visual对象 private Visual CreateVisual(string imag ...
- 图片转换成Base64编码集成到html文件
首先为什么要这么做? 原因很简单这样可以减少与服务器的请求,当然对于一些浏览器并不支持,如IE8.通常用在手机版网站中,具体转化方法如下: 1.在线打开Base64的编码器将图片编码成Base64 ...
- 利用PHP将图片转换成base64编码的实现方法
先来说一下为什么我们要对图片base64编码 base64是当前网络上最为常见的传输8Bit字节代码的编码方式其中之一.base64主要不是加密,它主要的用途是把某些二进制数转成普通字符用于网络传输. ...
随机推荐
- interaction-oriented architecture - MVC
MVC(Model-View-Controller),它是专门针 对交互系统提出的,所以如果我们要构建一个交互系统,那么我们就可以直接应用MVC模式,然后 在该模式所搭建的场景的启发下去发现Model ...
- tmux 后台运行程序
之前写过tmux分屏,其实这个只是方便写代码啥的,那都还不是最重要的.跑模型时,一般一跑就是一整天都是常事. 电脑关机,睡眠,ssh连接失效都会断了程序运行. solution:tmux后台运行程序! ...
- Lua脚本认知小结
0.前言 Lua是一种脚本语言,笔者在学习cocos2dx的时候认识了这个脚本语言. 据个人了解的脚本语言最大的优势是无需编译,使用其内核可以使其跨平台运行. JavaScript,Python,Pe ...
- boost tss.hpp源码分析
tss.hpp定义了thread_specific_ptr,使用thread local storage 技术 1.在thread目录下的win32和pthread目录下thread_data.hpp ...
- Go 语言开始
尝试了LiteIDE碰到调试问题无法解决,只有换成了vscode. vscode有个问题, golang.org/x/ 这个包名下的包都下载不了,需要到 https://github.com/gola ...
- Classless Interdomain Routing (CIDR)
IP Address Problems IP Address Exhaustion Class A, B, and C address structure inefficient Class B to ...
- performPeriodicTask
/********************************************************************* * @fn performPeriodicTask 执行 ...
- C# 5.0中使用CallerMemberName、CallerFilePath和CallerLineNumber获取代码的调用方信息(转载)
很多时候,我们需要在运行过程中记录一些调测的日志信息,如下所示: public void DoProcessing() { TraceMessage("DoProcessing()被XXX调 ...
- Css中路径data:image/png;base64的用法详解 (转载)
大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: background-image:url(data:image/png;base64, iVBORw0KGg ...
- oracle系列(四)PL/SQL
过程,函数,触发器是PL/SQL编写的,存储在oracle中的.PL/SQL是非常强大的数据库过程语言. PL/SQL优点:性能,模块化,网络传输量,安全性缺点:移植性不好 简单分类:块:过程,函数, ...