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 ...
随机推荐
- show user profile synchronization tools
C:\Program Files\Microsoft Office Servers\15.0\Synchronization Service\UIShell run miisclient.exe
- python--生成器,生成器推导式, yield from
一.生成器 生成器的本质就是迭代器,它一个一个的创建对象. 在python中有三种方式获取生成器: 1.通过生成器函数 2.通过各种推导式来实现生成器 3.通过数据的类型转换也可以获取生成器 二.生成 ...
- Python----初次见面,请多关照!
1.计算机的最基本认识 CPU(大脑) 3GHZ + 内存(DDR4) + 主板 + 电源(心脏)+ 显示器 + 键盘 +鼠标+ 显卡 + 硬盘 80MB/s 操作系统分为: windows 家用 l ...
- 201621123023《Java程序设计》第9周学习总结
一.本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 二.书面作业 1. List中指定元素的删除(题集题目) 1.1 实验总结.并回答:列举至少2种在List中删除 ...
- Syncthing源码解析 - 启动过程
我相信很多朋友会认为启动就是双击一下Syncthing程序图标,随后就启动完毕了!如果这样认为,对,也不对!对,是因为的确是这样操作,启动了Syncthing:不对是因为在调试Syncthing启动过 ...
- “全栈2019”Java异常第十四章：将异常输出到文本文件中
难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java异 ...
- Python(re模块,正则)
day18 正则表达式用处? 匹配 字符串 s = 'hello world' print(s.find('llo'))#第一个的位置 ret = s.replace('ll','xx') print ...
- php中ajax实例，用到json
调用的博客园苏恒锋的文章.先收藏,在学习: http://www.cnblogs.com/in-loading/archive/2012/05/18/2508123.html 程序中两个文件jsonT ...
- placeholder插件详解
placeholder插件是用来实现input或者textarea文本框显示默认文字的功能,当获得焦点时,默认文字消失.用户按删除键,把输入的字符删除掉,并失去焦点时,默认文字又出现等功能.使用此插件 ...
- [Objective-C语言教程]类别（28）
有时,可能会发现希望通过添加仅在某些情况下有用的行为来扩展现有类. 要向现有类添加此类扩展,Objective-C提供了类别和扩展. 如果需要向现有类添加方法,或许为了添加功能以便在应用程序中更容易地 ...