1.前提,设置跨域

2.在控制器头添加允许跨域

  /// <summary>
/// 文件管理口控制器
/// </summary>
[EnableCors("*", "*", "*")]
[RoutePrefix("File")]
public class FileController

3.上传方法

  /// <summary>
/// 图片上传 [FromBody]string token
/// </summary>
/// <returns></returns>
[HttpPost]
[Route("Upload/ImgUpload")]
public ResponseModel ImgUpload()
{
ResponseModel response = new ResponseModel();
// 文件保存目录路径
const string saveTempPath = "~/UploadFiles/";
if (!Directory.Exists(HttpContext.Current.Server.MapPath(saveTempPath)))
{
Directory.CreateDirectory(HttpContext.Current.Server.MapPath(saveTempPath));
}
HttpFileCollection files = HttpContext.Current.Request.Files;
const string fileTypes = "gif,jpg,jpeg,png,bmp";
foreach (string key in files.AllKeys)
{
HttpPostedFile file = files[key];//file.ContentLength文件长度 if (file.ContentLength > AllConfig.CommonStaticConfigInfo.MaxFileSize * 1024)
{
response.Fail("上传文件大小超过限制。");
return response;
}
else
{
var fileExt = file.FileName.Substring(file.FileName.LastIndexOf('.')); if (String.IsNullOrEmpty(fileExt) ||
Array.IndexOf(fileTypes.Split(','), fileExt.Substring(1).ToLower()) == -1)
{
response.Fail("不支持上传文件类型。");
return response;
}
else
{
if (string.IsNullOrEmpty(file.FileName) == false)
file.SaveAs(HttpContext.Current.Server.MapPath(saveTempPath) + file.FileName);
}
}
}
return response;
}

ResponseModel是自己实现的,有兴趣也可以看看,返回自己实现吧。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks; namespace Model
{
/// <summary>
/// 响应参数父级类型
/// </summary>
public class ResponseModel
{ /// <summary>
/// 构造
/// </summary>
public ResponseModel()
{
State = (int)RequestStateEnum.Success;
Msg = "成功";
}
/// <summary>
/// 构造
/// </summary>
/// <param name="state">请求状态</param>
/// <param name="callback">透传字段</param>
/// <param name="postTime">请求时间</param>
/// <param name="msg">返回信息</param>
public ResponseModel(RequestStateEnum state, string callback, string postTime, string msg)
{
State = (int)state;
Callback = callback;
PostTime = postTime;
Msg = msg;
}
/// <summary>
/// 构造
/// </summary>
/// <param name="callback">透传字段</param>
/// <param name="postTime">请求时间</param>
/// <param name="msg">返回信息</param>
public ResponseModel(string callback, string postTime, string msg)
{
State = (int)RequestStateEnum.Success;
Callback = callback;
PostTime = postTime;
Msg = msg;
}
/// <summary>
/// 构造
/// </summary>
/// <param name="callback">透传字段</param>
/// <param name="postTime">请求时间</param>
public ResponseModel(string callback, string postTime)
{
State = (int)RequestStateEnum.Success;
Callback = callback;
PostTime = postTime;
Msg = "成功";
}
/// <summary>
/// 请求状态
/// </summary>
public int State { get; protected set; }
/// <summary>
/// 透传字段
/// </summary>
public string Callback { get; set; } /// <summary>
/// 请求时间
/// </summary>
public string PostTime { get; set; } /// <summary>
/// 返回信息
/// </summary>
public string Msg { get; protected set; } /// <summary>
/// 错误
/// </summary>
/// <param name="msg"></param>
/// <param name="state"></param>
public void Fail(string msg, RequestStateEnum state = RequestStateEnum.Error)
{
Msg = msg;
State = (int)state;
}
/// <summary>
/// 错误,根据错误短语获取错误详细描述
/// </summary>
/// <param name="shortMsg">错误短语</param>
public void Fails(string shortMsg)
{
Msg = AllMsg.GetMsg(shortMsg);
State = (int)RequestStateEnum.Error;
} /// <summary>
/// 系统级错误
/// </summary>
/// <param name="msg"></param>
public void SystemErr(string msg)
{
Msg = msg;
State = (int)RequestStateEnum.SystemErr;
} /// <summary>
/// 成功
/// </summary>
/// <param name="msg"></param>
/// <param name="state"></param>
public void Success(string msg, RequestStateEnum state = RequestStateEnum.Success)
{
this.Msg = msg;
State = (int)RequestStateEnum.Success;
}
/// <summary>
/// 未登录验证
/// </summary>
public void NeedLogin()
{
this.Msg = "请登录系统后再进行操作!";
State = (int)RequestStateEnum.NeedLogin;
}
private string RealName;
public void SetRealName(string realName)
{
RealName = realName;
} public string GetRealName() { return RealName; } private string RequestJson; public void SetRequestJson(string requestJson)
{
RequestJson = requestJson;
} public string GetRequestJson() { return RequestJson; }
} /// <summary>
/// 返回的父级类型
/// </summary>
/// <typeparam name="T"></typeparam>
public class ResponseModel<T> : ResponseModel where T : new()
{ /// <summary>
/// 构造
/// </summary>
/// <param name="state">请求状态</param>
/// <param name="callback">透传字段</param>
/// <param name="postTime">请求时间</param>
/// <param name="msg">返回信息</param>
/// <param name="postContent">返回泛型</param>
public ResponseModel(RequestStateEnum state, string callback, string postTime, string msg, T postContent)
{
State = (int)state;
Callback = callback;
PostTime = postTime;
Msg = msg;
PostContent = postContent;
}
/// <summary>
/// 构造
/// </summary>
/// <param name="callback">透传字段</param>
/// <param name="postTime">请求时间</param>
/// <param name="msg">返回信息</param>
public ResponseModel(string callback, string postTime, string msg) : base(callback, postTime, msg)
{
//PostContent = new T();
}
/// <summary>
/// 构造
/// </summary>
/// <param name="callback">透传字段</param>
/// <param name="postTime">请求时间</param>
public ResponseModel(string callback, string postTime) : base(callback, postTime)
{ //PostContent = new T();
}
/// <summary>
/// 构造
/// </summary>
public ResponseModel()
{
PostContent = new T();
}
/// <summary>
/// 请求内容类以及返回内容类
/// </summary>
public T PostContent { get; set; } /// <summary>
/// 错误
/// </summary>
/// <param name="msg"></param>
/// <param name="state"></param>
/// <param name="obj"></param>
public void Fail(string msg, T obj, RequestStateEnum state = RequestStateEnum.Error)
{
PostContent = obj;
Msg = msg;
State = (int)state;
} /// <summary>
/// 成功
/// </summary>
/// <param name="obj"></param>
/// <param name="msg"></param>
/// <param name="state"></param>
public void Success(T obj, string msg = null, RequestStateEnum state = RequestStateEnum.Success)
{
Msg = msg;
this.PostContent = obj;
State = (int)state;
}
/// <summary>
/// 成功
/// </summary>
/// <param name="obj"></param>
public void Success(T obj)
{
this.PostContent = obj;
State = (int)RequestStateEnum.Success;
}
} }

4.html代码

<!doctype>
<head>
<script src="jquery-1.10.2.min.js"></script>
<!--<script src="jquery-1.11.1.js"></script>-->
<!--<script src="ajaxfileupload.js"></script>-->
<script>
$(document).ready(function () {
var appDomain = "http://localhost/TLSC.Api.File/";
$("#btn_fileUpload").click(function () {
/**
* 用ajax方式上传文件 -----------
* */
//-------asp.net webapi fileUpload
//
var formData = new FormData($("#uploadForm")[0]);
$.ajax({
url: appDomain + 'File/Upload/ImgUpload',
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function (data) {
console.log(JSON.stringify(data));
},
error: function (data) {
console.log(JSON.stringify(data));
}
});
//----end asp.net webapi fileUpload
//----.net core webapi fileUpload
// var fileUpload = $("#files").get(0);
// var files = fileUpload.files;
// var data = new FormData();
// for (var i = 0; i < files.length; i++) {
// data.append(files[i].name, files[i]);
// }
// $.ajax({
// type: "POST",
// url: appDomain+'api/Files',
// contentType: false,
// processData: false,
// data: data,
// success: function (data) {
// console.log(JSON.stringify(data));
// },
// error: function () {
// console.log(JSON.stringify(data));
// }
// });
//--------end net core webapi fileUpload
/**
* ajaxfileupload.js 方式上传文件
* */
// $.ajaxFileUpload({
// type: 'post',
// url: appDomain + 'api/Files',
// secureuri: false,
// fileElementId: 'files',
// success: function (data) {
// console.log(JSON.stringify(data));
// },
// error: function () {
// console.log(JSON.stringify(data));
// }
// });
});
//end click
})
</script>
</head>
<title></title>
<body>
<article>
<header>
<h2>article-form</h2>
</header>
<p>
<form action="/" method="post" id="uploadForm" enctype="multipart/form-data">
<input type="file" id="files" name="files" placeholder="file" multiple>file-multiple属性可以选择多项<br><br>
<input type="button" id="btn_fileUpload" value="fileUpload">
</form>
</p>
</article>
</body>

6.上传成功

demo就不贴了,拷贝上面的代码直接写就行了。

1.5 WEB API 上传文件的更多相关文章

  1. 演示如何通过 web api 上传文件MVC40

    演示如何通过 web api 上传文件WebApiWebFormHost/UploadFileController.cs /* * 通过 web api 上传文件 */ using System; u ...

  2. 返璞归真 asp.net mvc (11) - asp.net mvc 4.0 新特性之自宿主 Web API, 在 WebForm 中提供 Web API, 通过 Web API 上传文件, .net 4.5 带来的更方便的异步操作

    原文:返璞归真 asp.net mvc (11) - asp.net mvc 4.0 新特性之自宿主 Web API, 在 WebForm 中提供 Web API, 通过 Web API 上传文件, ...

  3. C# Web Api 上传文件

    一. 使用默认方法上传文件: 1.Action: /// <summary> /// 上传文件 使用上传后的默认文件名称 /// 默认名称是BodyPart_XXXXXX,BodyPart ...

  4. 前端AngularJS后端ASP.NET Web API上传文件

    本篇体验使用AngularJS向后端ASP.NET API控制器上传文件.    首先服务端: public class FilesController : ApiController { //usi ...

  5. HttpClient 测试web API上传文件实例

    1.使用HttpClient 测试上传文件并且设置header信息: using Lemon.Common; using Newtonsoft.Json; using System; using Sy ...

  6. ASP.NET Web API 上传文件

    HTML表单: <form id="form1" method="post" enctype="multipart/form-data" ...

  7. 数据採集之Web端上传文件到Hadoop HDFS

    前言 近期在公司接到一个任务.是关于数据採集方面的. 需求主要有3个: 通过web端上传文件到HDFS; 通过日志採集的方式导入到HDFS; 将数据库DB的表数据导入到HDFS. 正好近期都有在这方面 ...

  8. php 下 html5 XHR2 + FormData + File API 上传文件

    FormData的作用: FormData对象可以帮助我们自动的打包表单数据,通过XMLHttpRequest的send()方法来提交表单.当然FormData也可以动态的append数据.FormD ...

  9. Web API 上传下载文件

    1.引用了一个第三方组件 ICSharpCode.SharpZipLib.Zip; 2.具体代码 实体类,可以用hashtable 替代 ,感觉hashtable 比较灵活 public class ...

随机推荐

  1. business expressions(一)

    一. 1.24/7 24/7 :twenty four hours a day, seven days a week I work 24/7.——meaing i work all the time. ...

  2. 前端的UI设计与交互之文案篇

    在界面中,我们需要通过对话的方式与用户产生共鸣.精准.清晰的语言会更容易让用户理解,合适的语气更容易让用户建立信任感.因此在界面设计时,文案也应当被重视. 在使用和书写文案时有以下几点需要注意:从用户 ...

  3. 机器学习(1) - TensorflowSharp 简单使用与KNN识别MNIST流程

    机器学习是时下非常流行的话题,而Tensorflow是机器学习中最有名的工具包.TensorflowSharp是Tensorflow的C#语言表述.本文会对TensorflowSharp的使用进行一个 ...

  4. Algorithm --> 字母重排

    字母重排 输入一个字典(用***结尾),然后再输入若干单词.没输入一个单词w,都需要在字典中找出所有可以用w的字幕重排后得到的单词,并按照字典序从小到大的顺序在一行中输出,如果不存在,输出“:(”.单 ...

  5. [HNOI2002]营业额统计_Treap

    [HNOI2002]营业额统计 题目大意:给你一串n数序列,对于每一个刚输入的数a,找到一个前面的数k,使得|a-k|最小. 注释:$n<=32767,ai<=10^6$. 想法:刚学Tr ...

  6. Sum of xor

    Sum of xor jdoj-2160 题目大意:给你一个n,求1^2^...^n. 注释:$n<=10^{18}$. 想法:第一道异或的题.先来介绍一下什么是异或.a^b表示分别将两个数变成 ...

  7. KVM之一:安装准备(基于CentOS6.7)

    KVM 虚拟机简介: Kernel-based Virtual Machine的简称,是一个开源的系统虚拟化模块,自Linux 2.6.20之后集成在Linux的各个主要发行版本中.它使用Linux自 ...

  8. SUSE 安装 iServer、iDesktop启动异常问题

    前言: SUSE作为一款经典的linux发行版本,在很多企业用户中都有使用. 本文记录的是在SUSE11 SP3系统中安装iServer.iDesktop出现异常的问题. 环境: 系统:SUSE 11 ...

  9. 听翁恺老师mooc笔记(14)--格式化的输入与输出

    关于C语言如何做文件和底层操作: 文件操作,从根本上说,和C语言无关.这部分的内容,是教你如何使用C语言的标准库所提供的一系列函数来操作文件,最基本的最原始的文件操作.你需要理解,我们在这部分所学习的 ...

  10. 20162330 实验三 《敏捷开发与XP实践》 实验报告

    2016-2017-2 实验报告目录: 1 2 3 4 5 20162330 实验三 <敏捷开发与XP实践> 实验报告 课程名称:<程序设计与数据结构> 学生班级:1623班 ...