图片文件转换成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主要不是加密,它主要的用途是把某些二进制数转成普通字符用于网络传输. ...
随机推荐
- SOJ 1002/1003/1004 大整数相加/相乘/相除
三个题目分别考察大整数相加相乘相除运算.如果按照传统算法是取一个长数组,之后进行模拟或者FFT来进行运算.但是相对繁琐. 后来昨天的青岛区域赛网赛1001,用到了JAVA的BigDecimal,于是反 ...
- JDBC(1)简单介绍/数据库的连接
初识JDBC: JDBC是java连接数据库的一个工具,没有这个工具,java将无法和数据库进行连接. JDBC API: JDBC是个“低级”接口,也就是说,他直接用于调用SQL命令. JDBC驱动 ...
- MyBatis(2)增删改查
本次全部学习内容:MyBatisLearning 查: 根据id查询用户信息,得到一个用户信息 在User.xml文件中添加代码: <mapper namespace="tes ...
- 关于接口返回BOM头处理的问题
今天用RestClient框架做接口请求.结果请求回来的json转模型失败.提示JSON格式不正确.到BeJson网站验证一下,发现果然不对. 后来得知是由于json信息带着bom头导致的,这个该死的 ...
- 清空oracle session
select 'alter system kill session '''||sid|| ','||serial#||''';' from v$session where username =' ';
- TensorFlow创建简单的图片分类系统--机器学习
TensorFlow 参考链接 http://www.wolfib.com/Image-Recognition-Intro-Part-1/ 环境要求 linux amd64(必须是64位处理器)pyt ...
- spring加载属性(properties)文件
一.注解方式加载 jdbc.driver=org.mariadb.jdbc.Driver jdbc.url=jdbc:mariadb://localhost:3306/kt jdbc.user=roo ...
- java根据数据库自动生成代码
出现这个已经创建成功 出现这个情况,没有使用DBUtil,引入即可 已经创建完成 代码下载:https://github.com/weibanggang/tool 项目实例下载:https://pan ...
- Tuple和 ValueTuple
这个类型还是学习C#7.0的语法在看到的,这边单独拿来学习下. 学习地址: https://docs.microsoft.com/zh-cn/dotnet/csharp/tuples https:// ...
- iOS开发学习资源
最近想写点关于iOS开发的总结和心得.虽然网上资源一大堆,质量参差不齐,还是推荐一点干货吧! https://www.objc.io/issues/ 这个网站的文章质量很高,很多干货,可惜今年已经停 ...