mui手机图片压缩上传+C#

前台参考网址：http://www.bcty365.com/content-146-3263-1.html

<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script type="text/javascript" src="js/jquery.js"></script>
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet" />
<script src="js/app.js"></script>
<script>
var flag=0,cnt=0;
var swt;

// 扩展API加载完毕后调用onPlusReady回调函数
document.addEventListener( "plusready", onPlusReady, false );
var r = null;
// 扩展API加载完毕，现在可以正常调用扩展API
function onPlusReady() {
// 获取设备默认的摄像头对象
var cmr = plus.camera.getCamera();
//alert( "Camera supperted image resolutions: " + cmr.supportedImageResolutions );
}

// 拍照
function captureImage(){
var cmr = plus.camera.getCamera();

cmr.captureImage( function( path ){
//保存图片路径
alert( "Capture image success: " + path );
},
function( error ) {
alert( "Capture image failed: " + error.message );
},
{resolution:res,format:fmt}
);
}

var files = [];

//相册选取
function galleryImgs() {
files = [];
index = 1;
plus.gallery.pick(function(e) {
document.getElementsByClassName("mui-progressbar mui-progressbar-infinite")[0].style.display="block";
document.getElementById("itemlist").style.display="block";
document.getElementById("itemlist").innerHTML="";
cnt=0;
plus.nativeUI.showWaiting('图片压缩加载中，请勿关闭');
for(var i = 0; i < e.files.length; i++) {
var dstname = "_doc/" + getUid() + ".jpg"; //设置压缩后图片的路径
compressImage(e.files[i], dstname);
// $("#bimg").attr("src", dstname);
//cutImg();
appendfile(dstname);

//mui('#picture').popover('toggle');
}

var bval=$("#bimg").text();
bval=bval.substr(0,bval.length-1);
$("#bimg").text(bval+e.files.length);
$("#bimg").show();
}, function(e) {
//outSet( "取消选择图片" );
}, {
filter: "image",
multiple: true
});
}

//添加文件
var index = 1;

function appendfile(p) {
files.push({
name: "uploadkey" + index, //这个值服务器会用到，作为file的key
path: p
});
index++;
}

//拍照
function getImage() {
// var cmr = plus.camera.getCamera();
// cmr.captureImage(function(p) {
// plus.io.resolveLocalFileSystemURL(p, function(entry) {
// var localurl = entry.toLocalURL(); //
// // $("#bimg").attr("src", localurl);
// var dstname = "_doc/" + getUid() + ".jpg"; //设置压缩后图片的路径
// compressImage(localurl, dstname);
// //$("#report").html('<img src="/static/css/default/img/default.jpg" data-original="' + localurl + '">');
// //cutImg();
// mui('#picture').popover('toggle');
// });
// });
}

// 产生一个随机数
function getUid() {
return Math.floor(Math.random() * 100000000 + 10000000).toString();
}

//压缩图片，这个比较变态的方法，无法return
function compressImage(src, dstname) {
//var dstname="_downloads/"+getUid()+".jpg";
var itemlist = document.getElementById("itemlist");

plus.zip.compressImage({
src: src,
dst: dstname,
overwrite: true,
quality: 20
},
function(event) {
//console.log("Compress success:"+event.target);
fname = dstname;
filepath = event.target;
//$("#bimg").attr("src", event.target);
// return event.target;
//var temp = '<li class="mui-table-view-cell mui-media"><a href="javascript:;"><img class="mui-media-object mui-pull-left" src="' +
//event.target + '" onclick="showimg();"><div class="mui-media-body"><p class="mui-ellipsis"></p></div></a></li>';

var temp ='<li class="mui-table-view-cell mui-media mui-col-xs-4"><a href="#">'+
'<img class="mui-media-object" src="'+event.target+'"></a></li>';

itemlist.innerHTML += temp;
cnt++;
},
function(error) {
console.log(error);
return src;
//alert("Compress error!");
});
}

var blag=false;
setInterval(function comeover(){
if(cnt==files.length){
plus.nativeUI.closeWaiting();
document.getElementsByClassName("mui-progressbar mui-progressbar-infinite")[0].style.display="none";
blag=true;
}
},2000)

// 创建上传任务
function createUpload() {
if (cnt !=files.length)
{
mui.alert('图片压缩未完成请稍后...','提示');
return;
}
var wt = plus.nativeUI.showWaiting('图片上传中，请勿关闭');
var url = app.geturlstr()+"uploadingimages.ashx?action=appupload";

var task = plus.uploader.createUpload(url, {
method: "POST",
blocksize: 0,//204800,
priority: 100
},
function(t, status) {
//console.log('test');
if(t.responseText.substring(0, 1) == "0") {
if (flag<=3)
{
wt.close();
createUpload();
flag++;
}
else
{
wt.close();
alert(t.responseText.substring(1, t.responseText.length));
}
} else {
// 上传完成
if(status == 200) {
$("#bimg").hide();
$("#bimg").text("您选择的图片总数: ");
$("#device").val("");
$("input[type='radio']").removeAttr("checked");
index = 1;
files = [];
wt.close();
plus.uploader.clear();
document.getElementById("itemlist").innerHTML="";
alert("文件上传成功");
} else {
wt.close();
plus.uploader.clear();
alert("文件上传失败: " + status);
}
}
}
);

</form>

<button id="btnselect" name="file" type="button" class="mui-btn mui-btn-primary" onclick="showActionSheet();">图片选择</button>

<button id="btnsave" type="button" class="mui-btn mui-btn-primary" onclick="createUpload();">确定上传</button>
<br/>

<div id="report" style="text-align: center; margin-top: 10px;">
<h5>一次上传照片数请控制在30张以内</h5>
<h5 id="bimg" hidden="hidden">您选择的图片总数: </h5>
</div>

<div class="mui-content" style="background-color:#fff;margin-top:15px;">
<p class="mui-progressbar mui-progressbar-infinite" style="display: none;"></p>
<ul class="mui-table-view mui-grid-view" id="itemlist" style="display: none;">
</ul>
</div>

</div>
</body>
</html>

后台-----------------------------------------

void UploadImage(HttpContext context)
{
try
{
int id = 0;
string saccount, stoken, sitemid, sversion, device, mold, msg=string.Empty;
ArrayList sqlStringlist = new ArrayList();
//LogHelper.WriteInfoLog(typeof(uploadingimages), "test");

saccount = context.Request["account"];
stoken = context.Request["token"];
sitemid = context.Request["itemid"];
sversion = context.Request["version"];
device = context.Request.Form["device"] != "" ? context.Request.Form["device"] : "";//机号
mold = context.Request.Form["mold"] != "" ? context.Request.Form["mold"] : "";//类型
device = device.ToUpper().Trim();
//LogHelper.WriteInfoLog(typeof(uploadingimages), string.Format("device={0},mold={1}", device, mold));

//int ifg = appBll.CheckUser(saccount, stoken, "uploadimage");

decimal dclientversion = decimal.Parse(sversion);//客户端版本号
decimal dversion = decimal.Parse("1.02");//服务端版本号

if (dversion <= dclientversion)//版本符合要求
{
// if (ifg == 2)
//{
// msg = "0长时间未登录,请退出重新登录后操作";
//}
//else if (ifg == 0)
//{
// msg = "0人员登录异常";
//}
// else if (ifg == 3)
// {
// msg = "0你未被授权";
// }
// else
// {
//判断机号是否存在
string sql = string.Format("select count(*) from ds1.ima_file where ima01='{0}' ", device);
int ima = Convert.ToInt32(OraSqlHelper.returnval(sql));
if (ima==0)
{
msg = "0不存在此机号";
}
else
{
//判断上传的图片是否已存在表中
sql = string.Format("select filename from qc_file where jh='{0}' and kinds='{1}' order by id desc", device, mold);
string fileName = SqlHelper.returnval(sql);
if (!string.IsNullOrEmpty(fileName))
{
fileName = fileName.Replace(device, "");
fileName = fileName.Replace("-" + mold + "-", "");
fileName = fileName.Replace(".jpg", "");
id = Convert.ToInt32(fileName);
}
id += 1;
int count = context.Request.Files.Count;
LogHelper.WriteInfoLog(typeof(uploadingimages), count.ToString());
for (int i = 0; i < count; i++)
{
int l = context.Request.Files["uploadkey" + (i + 1)].ContentLength;
}
for (int i = 0; i < count; i++)
{
int l = context.Request.Files["uploadkey" + (i + 1)].ContentLength;
//LogHelper.WriteInfoLog(typeof(uploadingimages), l.ToString());
byte[] buffer = new byte[l];

System.IO.Stream s = context.Request.Files["uploadkey" + (i + 1)].InputStream;
System.Drawing.Bitmap image = new System.Drawing.Bitmap(s);

string imagname = string.Format("{0}-{1}-{2}.jpg", device, mold, id++);
string path = "F:/qcimage/" + DateTime.Now.ToString("yyyyMM") + "/";
string patha = DateTime.Now.ToString("yyyyMM") + "/";
if (!System.IO.Directory.Exists(path))
{
System.IO.Directory.CreateDirectory(path);
}

image.Save(path + imagname);

sql = string.Format("insert into qc_file values('{0}','{1}','{2}','{3}','{4}',getdate()) ", device, mold, imagname, patha, saccount);
sqlStringlist.Add(sql);
}
int ii = SqlHelper.ExecuteSqlTran(sqlStringlist);
if (ii == 0)
{
msg = "0上传文件失败";
}
//LogHelper.WriteInfoLog(typeof(uploadingimages), "over" + ii.ToString());
// }
}
}
else
{
msg = "0版本过低不能操作,请先升级后操作";
}
context.Response.Write(msg);
}
catch (Exception ex)
{
context.Response.Write("0上传文件失败");
LogHelper.WriteErrorLog(typeof(uploadingimages), ex);
}
}

mui手机图片压缩上传+C#的更多相关文章

基于H5+ API手机相册图片压缩上传
// 母函数 function App(){} /** * 图片压缩,默认同比例压缩 * @param {Object} path * pc端传入的路径可以为相对路径,但是在移动端上必须传入的路径是照 ...
基于vue + axios + lrz.js 微信端图片压缩上传
业务场景微信端项目是基于Vux + Axios构建的,关于图片上传的业务场景有以下几点需求: 1.单张图片上传(如个人头像,实名认证等业务) 2.多张图片上传(如某类工单记录) 3.上传图片时期望能 ...
分享图片压缩上传demo,可以选择一张或多张图片也可以拍摄照片
2016-08-05更新: 下方的代码是比较OLD的了,是通过js进行图片的剪切旋转再生成,效率较低. 后来又整合了一个利用native.js本地接口的压缩代码 ,链接在这 .页面中有详细的说明, ...
js 图片压缩上传（base64位）以及上传类型分类
一.input file上传类型 1.指明只需要图片 <input type="file" accept='image/*'> 2.指明需要多张图片 <input ...
三款不错的图片压缩上传插件(webuploader+localResizeIMG4+LUploader)
涉及到网页图片的交互,少不了图片的压缩上传,相关的插件有很多,相信大家都有用过,这里我就推荐三款,至于好处就仁者见仁喽: 1.名气最高的WebUploader,由Baidu FEX 团队开发,以H5为 ...
Html5+asp.net mvc 图片压缩上传
在做图片上传时,大图片如果没有压缩直接上传时间会非常长,因为有的图片太大,传到服务器上再压缩太慢了,而且损耗流量. 思路是将图片抽样显示在canvas上,然后用通过canvas.toDataURL方法 ...
纯原生js移动端图片压缩上传插件
前段时间,同事又来咨询一个问题了,说手机端动不动拍照就好几M高清大图,上传服务器太慢,问问我有没有可以压缩图片并上传的js插件,当然手头上没有,别慌,我去网上搜一搜. 结果呢,呵呵...诶~又全是基于 ...
springMVC多图片压缩上传的实现
首先需要在配置文件中添加配置:  <bean id="multipar ...
HTML多图片压缩上传
本文介绍的是多张图片在前端统一压缩后再通过ajax提交给后台处理的业务,使用到的是LocalResizeIMG.js插件. 一.首先介绍项目结构二.分享引用核心文件,这里没有分享CSS文件,因为没有 ...

随机推荐

Deadlock found when trying to get lock; try restarting transaction
1.错误描述 [ERROR:]2015-06-09 16:56:19,481 [抄送失败] org.hibernate.exception.LockAcquisitionException: erro ...
程序员的职场潜意识Top10
什么叫潜规则?其实就是不明文规定的一些规则,关键是他没法明文规定,因为有的规则太没节操.在我们职场中有些规则你不遵守将举步艰难,而要玩转这些潜规则,那么你必须要具备如下10个潜意识: 1.项目会议.那 ...
Java中用正则表达式找出数字
Java中用正则表达式找出数字 1.题目 String str = "fjd789klsd908434jk#$$%%^38488545",从中找出78990843438488 ...
windows驱动程序wdf--KMDF获取应用程序数据缓冲区地址
有3种常用方式:METHOD_BUFFERED METHOD_IN_DIRECT METHOD_OUT_DIRECT 还有METHOD_NEITHER,<windows设备驱动WDF开发 ...
关于vue如何解决数据渲染完成之前，dom树显示问题
在id="app"以下的标签中添加属性v-cloak 并且在css文件中添加[v-cloak]{display:none} 如果效果失效,这种原因是有几种可能,游览器大的解析加载速 ...
activemq的案例
在VCS仿真器中使用FSDB
FSDB(Fast Signal Database)是Verdi支持的文件格式,用于保存仿真产生的信号波形.据Verdi文档说明,FSDB比标准的VCD格式节省磁盘空间,处理速度更快.要用VCS仿真器 ...
java支付宝开发-01-沙箱环境接入
一.沙箱环境说明 (1)蚂蚁沙箱环境(Beta)是协助开发者进行接口功能开发及主要功能联调的辅助环境.沙箱环境模拟了开放平台部分产品的主要功能和主要逻辑(当前沙箱支持产品请参考“沙箱支持产品列表”). ...
360加固apk并自动签名
我们知道Android加混淆之后,代码的安全性得到了提高,即使你hook,反编译得到的也是乱码的,对于阅读性造成了影响,为了增强代码的破解难度,我们通常退对apk进行加固,常见的有腾讯,360,爱加密 ...
ASP.NET Core 一步步搭建个人网站（7）_Linux系统移植
摘要考虑我们为什么要选择.NET Core? 因为它面向的是高性能服务器开发,抛却了 AspNet 的臃肿组件,非常轻量,加上微软的跨平台战略,对 Docker 的亲和性,对于开发人员也非常友好,所 ...

mui手机图片压缩上传+C#

mui手机图片压缩上传+C#的更多相关文章

随机推荐

热门专题