<script src="https://code.jquery.com/Jquery-3.3.1.min.js"></script>
图片压缩<script src="localResizeIMG/dist/lrz.all.bundle.js"></script>
html
<div id="loading"></div>
<input type="file" accept="image/*" class="loaddot" id="doCard" />
<div class="imgUrl"></div>
jq
$("input[type=file]").change(function () {
/* 压缩图片 */
lrz(this.files[0], {
width: 300 //设置压缩参数
}).then(function (rst) {
/* 处理成功后执行 */
if (rst.base64 != "") {
rst.formData.append('base64img', rst.base64); // 添加额外参数
$("#loading").html("<img src='img/loading.gif' />"); //loading 加载图片
setTimeout(function () {
loadPicUrl(rst.base64);
}, 2000);
}
}).catch(function (err) {
/* 处理失败后执行 */
}).always(function () {
/* 必然执行 */
})
})
//上传图片
function loadPicUrl(base64) {
if (base64 != "") {
$.ajax({
type: "post",
url: "url",
dataType: "text",
ifModified: true,
cache: false,
data: { "imgdata": base64.substring(23), "filehzm": ".jpg" },
timeout: 10000,
async: false,
beforeSend: function (XMLHttpRequest) {
},
success: function (msg) {
$(".imgUrl").html('<img src="' + msg + '">');
loaddotUrl = msg;
console.log(loaddotUrl);
//更新当前id的图片
}, complete: function (XMLHttpRequest, textStatus) {
$("#loading").empty();
},
});
}
}
ashx
protected void getvalue(HttpContext context)
{
StringBuilder strBul = new StringBuilder();
string res = "";
string dir = "/uploads/uploadfile";
//站点文件目录
string fileDir = HttpContext.Current.Server.MapPath("~" + dir);
//文件名称
string fileName = "img" + DateTime.Now.ToString("yyyyMMddHHmmssff");
//保存文件所在站点位置
string filePath = Path.Combine(fileDir, fileName);
if (!System.IO.Directory.Exists(fileDir))
System.IO.Directory.CreateDirectory(fileDir);
//将Base64String转为图片并保存
byte[] arr2 = Convert.FromBase64String(context.Request.Params["imgdata"].ToString());
using (MemoryStream ms2 = new MemoryStream(arr2))
{
System.Drawing.Bitmap bmp2 = new System.Drawing.Bitmap(ms2);
bmp2.Save(filePath + context.Request.Params["filehzm"].ToString(), System.Drawing.Imaging.ImageFormat.Jpeg);
}
res = dir + "/" + fileName + context.Request.Params["filehzm"].ToString();
strBul.Append(res);
context.Response.Write(strBul);
}