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文件,因为没有 ...

随机推荐

Eclipse设置内存大小
Eclipse设置内存大小 1.修改Eclipse的配置文件 (1)打开Eclipse目录 (2)以EditPlus打开eclipse.ini,修改"-Xms40m -Xmx512m&qu ...
基于 angular 规范的 commit
基于 angular 规范的 commit commit格式如下: <type>: <subject> <BLANK LINE> <body> type ...
Babel 安装教程
Babel是一个广泛使用的转码器,可以将ES6代码转为ES5代码,从而在现有环境执行. 这意味着,你可以现在就用 ES6 编写程序,而不用担心现有环境是否支持.下面是一个例子. // 转码前 inpu ...
Keras官方中文文档：序贯模型
快速开始序贯(Sequential)模型序贯模型是多个网络层的线性堆叠,也就是"一条路走到黑". 可以通过向Sequential模型传递一个layer的list来构造该模型: f ...
结合实例分析Android MVP的实现
最近阅读项目的源码,发现项目中有MVP的痕迹,但是自己却不能很好地理解相关的代码实现逻辑.主要原因是自己对于MVP的理解过于概念话,还没有真正操作过.本文打算分析一个MVP的简单实例,帮助自己更好的理 ...
[APIO2009]抢掠计划
题面: Description Siruseri城中的道路都是单向的.不同的道路由路口连接.按照法律的规定,在每个路口都设立了一个Siruseri银行的ATM取款机.令人奇怪的是,Siruseri的酒 ...
javascript三角函数的使用
其实很多编程语言里面都有数学函数,而且很多数学函数包括三角函数,只不过有些时候可能我们用的并不多,我最近在做一个h5的游戏,其中有一个需求就是射击的枪支需要更随鼠标变换位置,鼠标移动到什么地方,炮口就 ...
java 关键字final static native详解
java 关键字native static final详解一.final 根据程序上下文环境,Java关键字final有"这是无法改变的"或者"终态的"含义, ...
Linux系统默认权限之umask
默认情况下,目录权限值为755, 普通文件权限值为644, 那么这个值是由谁规定的,追究其原因是 umask [root@adminx]# vim /etc/profile 1.假设umask值为:0 ...
那些年踩过的WebAPI的坑（一）
---恢复内容开始--- Visual Studio创建一个web项目, 在下一步的时候创建WebAPI项目的时候勾选web API之后,系统会生成一个web项目. 首先看一下webapi的路由配置, ...

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

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

随机推荐

热门专题