ASP.net WebAPI 上传图片实例

下面我详细讲解一下“ASP.net WebAPI 上传图片实例”的完整攻略。

一、准备工作

在进行图片上传之前，需要先在项目中添加相应的 NuGet 包，具体步骤如下：

1. 打开 Visual Studio，打开项目，右键点击项目名称，选择“Manage NuGet Packages...”。
2. 在“NuGet 包管理器”中搜索“Microsoft.AspNet.WebApi”、“Microsoft.AspNet.WebApi.Core”、“Microsoft.AspNet.WebApi.Client”、“Microsoft.AspNet.WebApi.WebHost”包，并依次安装。

接下来需要创建一个包含图片上传方法的 WebAPI 控制器，具体步骤如下：

1. 在项目中创建一个新的控制器，右键点击控制器所在文件夹，选择“添加”->“控制器”。
2. 在弹出的“添加项”中选择“Web API 2 控制器 - 空”，并设置控制器名称。
3. 在新创建的控制器中添加一个 POST 方法，用于接收图片数据。

二、实现图片上传

在控制器中实现图片上传需要通过以下步骤完成：

1. 在 POST 方法中接收图片数据

通过添加 [FromBody] 特性，将传递过来的 HttpPostedFileBase 数据流转换为 byte[] 数组，代码如下：

public async Task<IHttpActionResult> Post([FromBody] HttpPostedFileBase file)
{
    byte[] bytes;
    using (var stream = new MemoryStream())
    {
        file.InputStream.CopyTo(stream);
        bytes = stream.ToArray();
    }
    // 在这里进行图片处理
    ...
}

2. 将图片数据存储到本地

使用 File.WriteAllBytes 方法将图片数据存储到本地指定路径下，代码如下：

var fileName = Path.GetFileName(file.FileName);
var filePath = HttpContext.Current.Server.MapPath($"~/Uploads/{fileName}");
File.WriteAllBytes(filePath, bytes);

3. 返回上传成功信息

通过返回一个 HttpResponseMessage 对象，向客户端返回上传结果信息，代码如下：

return new HttpResponseMessage(HttpStatusCode.OK)
{
    Content = new StringContent("上传成功"),
};

三、上传图片示例

示例一：使用 WebAPI 客户端上传图片

可以使用 WebAPI 客户端来模拟客户端上传图片的过程，代码如下：

public async Task UploadImageAsync()
{
    var file = new FileInfo(@"C:\path\to\your\image.jpg");
    using (var client = new HttpClient())
    {
        using (var content = new MultipartFormDataContent())
        {
            using (var fileStream = file.OpenRead())
            {
                var fileContent = new StreamContent(fileStream);
                fileContent.Headers.ContentDisposition = new ContentDispositionHeaderValue("form-data")
                {
                    Name = "file",
                    FileName = file.Name,
                };
                fileContent.Headers.ContentType = new MediaTypeHeaderValue("image/jpeg");
                content.Add(fileContent, "file", file.Name);

                var response = await client.PostAsync("http://localhost:xxxx/api/image/upload", content);
                var message = await response.Content.ReadAsStringAsync();
                Console.WriteLine(message);
            }
        }
    }
}

示例二：使用 jQuery Ajax 上传图片

可以使用 jQuery Ajax 来实现客户端上传图片的功能，具体代码如下：

<input id="fileInput" type="file" />

<button id="uploadButton" type="button">上传</button>

<script>
    $(function () {
        $("#uploadButton").on("click", function () {
            var formData = new FormData();
            var file = $("#fileInput").prop("files")[0];
            formData.append("file", file);

            $.ajax({
                url: "api/image/upload",
                type: "POST",
                processData: false,
                contentType: false,
                data: formData,
                success: function () {
                    alert("上传成功");
                },
                error: function () {
                    alert("上传失败");
                }
            });
        });
    });
</script>

以上是针对“ASP.net WebAPI 上传图片实例”的完整攻略，希望可以帮助到你。