C# AJAXform上传图片
前台：
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<link href="~/Scripts/jquery.imgareaselect-0.9.10/css/imgareaselect-animated.css" rel="stylesheet" /> --引用
<script src="~/Scripts/jquery.imgareaselect-0.9.10/scripts/jquery.imgareaselect.pack.js"></script> --引用
<script src="~/Scripts/jquery.imgareaselect-0.9.10/scripts/jquery.min.js"></script> --引用
<script src="~/Scripts/jquery.imgareaselect-0.9.10/jquery-form.js"></script> --引用
</head>
<body>
<div>
<form enctype="multipart/form-data" method="post" action="/show/markwater" id="submitForm">
<input type="file" name="Exc" id="pic" />
<input type="button" value="提交" onclick="submitForm();" />
</form>
<!--原始图片展示 move:此光标指示某对象可被移动-->
<img id="photo" style="cursor:move" src=""/>
<!--效果图片展示-->
<img id="photoNew" />
</div>
</body>
</html>
<script>
$(document).ready(function () {
debugger;
//选择图片事件
$('#photo').imgAreaSelect({
fadeSpeed: 500,//设置为大于零的数字，则用优美的淡入/淡出动画来显示图片，默认值为 false
autoHide: false,//设置为true，当选择区域选择结束时消失，默认值为：false
handles: true,//设置为true，调整手柄则会显示在选择区域内，如果设置为"corners"，则只有角处理会显示调整手柄，默认值为false
persistent: false,//设置为true，选择区以外的点击将不会启动一个新的选区（即用户将只能移动/调整现有的选择范围），默认值为false
onSelectEnd: function (img, selection)//结束选区时的回调函数
{
debugger;
var x1, y1, xwidth, yheight, spath;
x1 = selection.x1;//选择区域的左上角坐标
y1 = selection.y1;//选择区域的左上角坐标
xwidth = selection.width;
yheight = selection.height;
picurl = $("#photo").attr("src");
$.post("/show/crop", { x1: x1, y1: y1, width: xwidth, height: yheight, picurl: picurl }, function (url) {
$("#photoNew").attr("src", url + "?" + Math.random());//随机数的作用:避免游览器缓存图片
})
}
});
});
//form窗体异步提交事件
function submitForm()
{
debugger;
$("#submitForm").ajaxSubmit({
success:function(responseText)
{
debugger;
alert(responseText);
$("#photo").attr("src",responseText);//给照片赋值
}
})
}
</script>
后台：
using FileUploadDemo.Common;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Drawing;
using System.Drawing.Imaging;
using System.Drawing.Drawing2D;
using System.IO;
namespace 图片水印.Controllers
{
public class showController : Controller
{
// GET: show
public ActionResult Index()
{
return View();
}
/// <summary>
/// 上传
/// </summary>
/// <param name="pic"></param>
/// <returns></returns>
[HttpPost]
public ActionResult uppicture(HttpPostedFileBase pic)
{
var path = Server.MapPath("/images/");
string fname = Guid.NewGuid().ToString()+pic.FileName;
pic.SaveAs(path+fname);
string names = "/images/"+fname;
string waring = "";
//使用流方式，上产并保存文件
string url = ImageHelper.uploadbystream(pic.InputStream,"/images/",out waring);
//添加水印
string WarkUrl = ImageHelper.makewatermark(url, names,
ImageHelper.WaterType.Center,"/images/",
ImageHelper.ImageType.JPEG,
ImageHelper.FileCache.Delete,
out waring);
return Content(WarkUrl);
}
/// <summary>
/// 裁剪
/// </summary>
/// <param name="collection"></param>
/// <returns></returns>
[HttpPost]
public ActionResult Crop(FormCollection collection)
{
//选择区域的左上角坐标
int x1 = int.Parse(collection["x1"]);
int y1 = int.Parse(collection["y1"]);
int width = int.Parse(collection["width"]);
int height = int.Parse(collection["height"]);
string picurl = collection["picurl"];
string warning = ""; //返回图片剪辑过程的警告信息
string Url = ImageHelper.imgcrop(picurl, "/images/", x1, y1, width, height, ImageHelper.FileCache.Save, out warning);
return Content(Url);
}
[HttpPost] //上传功能2
public ActionResult markwater(HttpPostedFileBase Exc)
{
var path = Server.MapPath("/images/");
if (!Directory.Exists(path))
{
Directory.CreateDirectory(path);
}
string fname = Guid.NewGuid().ToString() + Exc.FileName;
Exc.SaveAs(path + fname);
string names =path + fname;//原图片和水印图片路径
string newnames = path + Guid.NewGuid().ToString() + ".png"; ///保存的路径
//调用方法
BuildWatermark(names, path+ "w.png", "123123",newnames);
int i = newnames.LastIndexOf("\\images");//把要保存的图片的物理路径的index最后出现的位置
string srcs = newnames.Substring(i); //截取index至所有长度。
return Content(srcs); //返回路径
}
/// <summary>
/// 添加文字水印
/// </summary>
public void ss()
{
string ImagePath = @"C:\Users\1\Pictures\斗图\v2-93729ef5335e8f6d8633213c88cb14a8_r.jpg";
try
{
Image image = Image.FromFile(ImagePath);
Graphics g = Graphics.FromImage(image);
//水印内容
string waterText = "wangyblzu";
Font font = new Font("宋体", 18);
//用于确定水印的大小
SizeF zisizeF = new SizeF();
zisizeF = g.MeasureString(waterText, font);
//亮度，红色，绿色，蓝色
SolidBrush solidBrush = new SolidBrush(Color.FromArgb(255, 255, 0, 0));
//水印
g.DrawString(waterText, font, solidBrush, new PointF(image.Width / 2+(image.Width/4), (image.Height- image.Height /4 )));
//图片另存
image.Save(@"C:\Users\1\Pictures\斗图\4ec5b03"+Guid.NewGuid().ToString()+"69c5b59e3d22_r.jpg", System.Drawing.Imaging.ImageFormat.Jpeg);
}
catch (Exception ex)
{
throw ex;
}
}
//图片方法2
/// <summary>
/// Creating a Watermarked Photograph with GDI+ for .NET
/// </summary>
/// <param name="rSrcImgPath">原始图片的物理路径</param>
/// <param name="rMarkImgPath">水印图片的物理路径</param>
/// <param name="rMarkText">水印文字（不显示水印文字设为空串）</param>
/// <param name="rDstImgPath">输出合成后的图片的物理路径</param>
public void BuildWatermark(string rSrcImgPath, string rMarkImgPath, string rMarkText, string rDstImgPath)
{
//以下（代码）从一个指定文件创建了一个Image 对象，然后为它的 Width 和 Height定义变量。
//这些长度待会被用来建立一个以24 bits 每像素的格式作为颜色数据的Bitmap对象。
Image imgPhoto = Image.FromFile(rSrcImgPath);
int phWidth = imgPhoto.Width;
int phHeight = imgPhoto.Height;
Bitmap bmPhoto = new Bitmap(phWidth, phHeight, PixelFormat.Format24bppRgb);
bmPhoto.SetResolution(72, 72);
Graphics grPhoto = Graphics.FromImage(bmPhoto);
//这个代码载入水印图片，水印图片已经被保存为一个BMP文件，以绿色(A=0,R=0,G=255,B=0)作为背景颜色。
//再一次，会为它的Width 和Height定义一个变量。
Image imgWatermark = new Bitmap(rMarkImgPath);
int wmWidth = imgWatermark.Width;
int wmHeight = imgWatermark.Height;
//这个代码以100%它的原始大小绘制imgPhoto 到Graphics 对象的（x=0,y=0）位置。
//以后所有的绘图都将发生在原来照片的顶部。
grPhoto.SmoothingMode = SmoothingMode.AntiAlias;
grPhoto.DrawImage(
imgPhoto,
new Rectangle(0, 0, phWidth, phHeight),
0,
0,
phWidth,
phHeight,
GraphicsUnit.Pixel);
//为了最大化版权信息的大小，我们将测试7种不同的字体大小来决定我们能为我们的照片宽度使用的可能的最大大小。
//为了有效地完成这个，我们将定义一个整型数组，接着遍历这些整型值测量不同大小的版权字符串。
//一旦我们决定了可能的最大大小，我们就退出循环，绘制文本
int[] sizes = new int[] { 16, 14, 12, 10, 8, 6, 4 };
Font crFont = null;
SizeF crSize = new SizeF();
for (int i = 0; i < 7; i++)
{
crFont = new Font("arial", sizes[i],
FontStyle.Bold);
crSize = grPhoto.MeasureString(rMarkText,
crFont);
if ((ushort)crSize.Width < (ushort)phWidth)
break;
}
//因为所有的照片都有各种各样的高度，所以就决定了从图象底部开始的5%的位置开始。
//使用rMarkText字符串的高度来决定绘制字符串合适的Y坐标轴。
//通过计算图像的中心来决定X轴，然后定义一个StringFormat 对象，设置StringAlignment 为Center。
int yPixlesFromBottom = (int)(phHeight * .05);
float yPosFromBottom = ((phHeight -
yPixlesFromBottom) - (crSize.Height / 2));
float xCenterOfImg = (phWidth / 2);
StringFormat StrFormat = new StringFormat();
StrFormat.Alignment = StringAlignment.Center;
//现在我们已经有了所有所需的位置坐标来使用60%黑色的一个Color(alpha值153)创建一个SolidBrush 。
//在偏离右边1像素，底部1像素的合适位置绘制版权字符串。
//这段偏离将用来创建阴影效果。使用Brush重复这样一个过程，在前一个绘制的文本顶部绘制同样的文本。
SolidBrush semiTransBrush2 =
new SolidBrush(Color.FromArgb(153, 0, 0, 0));
grPhoto.DrawString(rMarkText,
crFont,
semiTransBrush2,
new PointF(xCenterOfImg + 1, yPosFromBottom + 1),
StrFormat);
SolidBrush semiTransBrush = new SolidBrush(
Color.FromArgb(153, 255, 255, 255));
grPhoto.DrawString(rMarkText,
crFont,
semiTransBrush,
new PointF(xCenterOfImg, yPosFromBottom),
StrFormat);
//根据前面修改后的照片创建一个Bitmap。把这个Bitmap载入到一个新的Graphic对象。
Bitmap bmWatermark = new Bitmap(bmPhoto);
bmWatermark.SetResolution(
imgPhoto.HorizontalResolution,
imgPhoto.VerticalResolution);
Graphics grWatermark =
Graphics.FromImage(bmWatermark);
//通过定义一个ImageAttributes 对象并设置它的两个属性，我们就是实现了两个颜色的处理，以达到半透明的水印效果。
//处理水印图象的第一步是把背景图案变为透明的(Alpha=0, R=0, G=0, B=0)。我们使用一个Colormap 和定义一个RemapTable来做这个。
//就像前面展示的，我的水印被定义为100%绿色背景，我们将搜到这个颜色，然后取代为透明。
ImageAttributes imageAttributes =
new ImageAttributes();
ColorMap colorMap = new ColorMap();
colorMap.OldColor = Color.FromArgb(255, 0, 255, 0);
colorMap.NewColor = Color.FromArgb(0, 0, 0, 0);
ColorMap[] remapTable = { colorMap };
//第二个颜色处理用来改变水印的不透明性。
//通过应用包含提供了坐标的RGBA空间的5x5矩阵来做这个。
//通过设定第三行、第三列为0.3f我们就达到了一个不透明的水平。结果是水印会轻微地显示在图象底下一些。
imageAttributes.SetRemapTable(remapTable,
ColorAdjustType.Bitmap);
float[][] colorMatrixElements = {
new float[] {1.0f, 0.0f, 0.0f, 0.0f, 0.0f},
new float[] {0.0f, 1.0f, 0.0f, 0.0f, 0.0f},
new float[] {0.0f, 0.0f, 0.3f, 0.0f, 0.0f},
new float[] {0.0f, 0.0f, 0.0f, 0.3f, 0.0f},
new float[] {0.0f, 0.0f, 0.0f, 0.0f, 1.0f}
};
ColorMatrix wmColorMatrix = new
ColorMatrix(colorMatrixElements);
imageAttributes.SetColorMatrix(wmColorMatrix,
ColorMatrixFlag.Default,
ColorAdjustType.Bitmap);
//随着两个颜色处理加入到imageAttributes 对象，我们现在就能在照片右手边上绘制水印了。
//我们会偏离10像素到底部，10像素到左边。
int markWidth;
int markHeight;
//mark比原来的图宽
if (phWidth <= wmWidth)
{
markWidth = phWidth - 10;
markHeight = (markWidth * wmHeight) / wmWidth;
}
else if (phHeight <= wmHeight)
{
markHeight = phHeight - 10;
markWidth = (markHeight * wmWidth) / wmHeight;
}
else
{
markWidth = wmWidth;
markHeight = wmHeight;
}
int xPosOfWm = ((phWidth - markWidth) - 10);
int yPosOfWm = 10;
grWatermark.DrawImage(imgWatermark,
new Rectangle(xPosOfWm, yPosOfWm, markWidth,
markHeight),
0,
0,
wmWidth,
wmHeight,
GraphicsUnit.Pixel,
imageAttributes);
//最后的步骤将是使用新的Bitmap取代原来的Image。 销毁两个Graphic对象，然后把Image 保存到文件系统。
imgPhoto = bmWatermark;
grPhoto.Dispose();
grWatermark.Dispose();
imgPhoto.Save(rDstImgPath, ImageFormat.Jpeg);
imgPhoto.Dispose();
imgWatermark.Dispose();
}
}
}
C# AJAXform上传图片的更多相关文章
- C#使用ajaxForm进行上传图片
<div class='imgOuter addImgBtn l_canshu' id='ImagePath1' value=''> <img src="../Images ...
- ajax上传图片 jquery插件 jquery.form.js 的方法 ajaxSubmit; AjaxForm与AjaxSubmit的差异
先引入脚本 这里最好是把jquery的脚本升级到1.7 <script src="js/jquery-1.7.js" type="text/javascript& ...
- 手机端上传图片及java后台接收和ajaxForm提交
有很多微信开发的项目在手机端需要传图片,但是又不想调用微信的上传图片接口,于是采取了如下做法: 使用ajaxForm提交文件所需js:jquery.form.js 页面代码: <%@ page ...
- 异步上传图片，光用jquery不行，得用jquery.form.js插件
异步上传图片,光用jquery不行,得用jquery.form.js插件,百度一下下载这个插件,加jquery,引入就可以了 <form id="postbackground" ...
- 基于ASP.Net +easyUI框架上传图片，实现图片上传，提交表单
<body> <link href="../../Easyui/themes/easyui.css" rel="stylesheet" typ ...
- 博客使用BOS上传图片
1.博客平台的选定 从大学开始做个人主页算起,最开始是使用html,CSSS写简单的页面,后面大学毕业之后接触到了WordPress,就开始用WordPress搭建网站.现在还维护着一个农村网站.ht ...
- nodejs利用ajax实现网页无刷新上传图片
nodejs利用ajax实现网页无刷新上传图片 标签(空格分隔): nodejs 通常情况下上传图片是要通过提交form表单来实现的,但是这又不可避免的产生了网页转. 利用ajax技术和FormDat ...
- -Android -线程池 批量上传图片 -附php接收代码
(出处:http://www.cnblogs.com/linguanh/) 目录: 1,前序 2,类特点 3,用法 4,java代码 5,php代码 1,前序 还是源于重构,看着之前为赶时间写着的碎片 ...
- iOS 原生HTTP POST请求上传图片
今天项目里做一个上传图片等个人信息的时候,使用了第三方AFNetworking - (AFHTTPRequestOperation *)POST:(NSString *)URLString param ...
随机推荐
- pageadmin 网站建设系统如何新建进程池并在站点中使用
1.打开iis管理界面,右键应用程序池,点击添加应用程序池,添加界面如下图,注意pageadmin cms net版本选择4.0,托管模式建议选择集成模式. 2.添加完毕后,在网站中点击对应站点,点击 ...
- python--深浅拷贝 join() 列表和字典的删除 fromkeys建立字典
北京的冬天雾霾依旧很重,依稀记得人生初见雾霾时的样子,那时的回忆也是有些尴尬,不过雾霾也伴随了我的成长,成为了我肺泡中不可分割的一部分. 今天我想写的是拷贝的问题,不过在这之前我想先补充一点关于字符串 ...
- java学习笔记—EL表达式（38）
EL表达式 EL即Expression Language,主要的任务是帮助开发者简化获取域属性. 但是一般情况下需要使用EL和JSTL结合使用. 语法: ${ // 隐含对象|直接写域中的属性 } ...
- django_jquery中使用ajax发送post请求变成get请求
今天在进行js开发的过程中出现了一个奇怪的问题,就是使用ajax向后端发送post请求时,在浏览器network中查看response时,显示400 bad request 并且请求方式变成get,因 ...
- matlab中显示灰阶图像
matlab的数据源文件中400张图片,每张图片是一个112*92的矩阵表示,而400张图片存储在一个cell数组ime中,显示第一张图片,指令是: colormap(gray) imagesc(im ...
- jvm学习笔记（一）
一.java的运行原理 开发人员编写java代码(.java文件) 编译器将.java文件编译成字节码文件(.class文件) 字节码被装入内存,当字节码被装入内存之后,它就会被解释器解释执行或是被即 ...
- iOS开发debug跟release版本NSLog屏蔽方法
简单介绍以下几个宏: 1) __VA_ARGS__ 是一个可变参数的宏,这个可变参数的宏是新的C99规范中新增的,目前似乎只有gcc支持(VC6.0的编译器不支持).宏前面加上##的作用在于,当可变参 ...
- [整理]Unicode 与 UTF8
目录 先上总结 ASCII utf-8 编码规则 UTF-16 其他 先上总结 Unicode 是一个符号集, 规定了所有符号的二进制编号. UTF8 是unicode的一种编码方式(存储, 传输方式 ...
- 【Alpha】Phylab 测试报告
PhyLab Alpha 测试报告 测试中发现的bug Bug 可能原因 实验区域发布评论,如果需要验证码,无法填写 评论频率过快,实验区未接入验证码系统 忘记密码,但无邮件发送 忘记密码部分暂未修复 ...
- Windows开发经验 - Visual Studio 2017
1. 调试子进程 Visual Studio 2017及更早的版本原生不支持调试子进程,不确定未来是否会支持.可以通过官方插件让Visual Studio能够调试子进程. https://market ...