C#实现图片上传（PC端和APP）保存及 跨域上传说明

C#实现图片上传（PC端和APP）保存及 跨域上传说明

本文将会详细介绍C#如何实现图片上传并保存，以及如何进行跨域上传，下面将分别进行讲解。

PC端图片上传及保存

1.前端上传代码

前端的上传代码可以使用form表单配合input文件控件来完成：

<form action="upload.aspx" method="post" enctype="multipart/form-data">
    <input type="file" name="file1" />
    <input type="submit" value="上传" />
</form>

2.后端代码

后端将上传的图片进行保存的代码如下所示：

string fileName = Path.GetFileName(file1.PostedFile.FileName);//获取上传文件的文件名
string fileEx = Path.GetExtension(fileName);//获取文件类型
string newFileName = DateTime.Now.ToString("yyyyMMddHHmmss") + new Random().Next(10000, 99999).ToString() + fileEx;//生成新文件名
string SaveLocation = Server.MapPath("~\\uploads\\") + newFileName;//上传文件保存的路径
try
{
    file1.PostedFile.SaveAs(SaveLocation);//保存文件
    Response.Write("文件上传成功！");//上传成功后输出提示信息
}
catch (Exception ex)
{
    Response.Write(ex.Message);//上传失败时输出错误信息
}

3.注意事项

在进行上传时，需要注意以下几点：

• 上传文件大小要限制，否则可能会造成服务器崩溃；
• 应该对上传的文件类型进行验证，防止上传非法文件；
• 上传文件应该保存在专门的文件夹中，以免混淆。

APP图片上传及保存

1.前端代码

Android和iOS开发中，一般使用第三方库或框架来实现图片上传功能，这里介绍一下Android中使用OkHttp库上传图片的方法：

public void uploadFile(File file) throws IOException {
    OkHttpClient client = new OkHttpClient();
    RequestBody requestBody = new MultipartBody.Builder()//构造请求体
            .setType(MultipartBody.FORM)
            .addFormDataPart("file", file.getName(), RequestBody.create(MediaType.parse("application/octet-stream"), file))
            .build();
    Request request = new Request.Builder()//构造请求
            .url(uploadUrl)//上传接口地址
            .post(requestBody)
            .build();
    Response response = client.newCall(request).execute();//执行请求
    if (response.isSuccessful()) {
        String responseStr = response.body().string();//请求响应的字符串
        //处理响应
    } else {
        throw new IOException("Unexpected code " + response);
    }
}

2.后端代码

后端将上传的图片进行保存的代码如下所示：

[HttpPost]
public ActionResult Upload()
{
    HttpFileCollectionBase files = Request.Files;
    //如果没有上传文件
    if (files == null || files.Count == 0)
    {
        return Json(new { status = "error", message = "没有上传文件" });
    }

    HttpPostedFileBase file = files[0];
    string fileName = Path.GetFileName(file.FileName);//获取上传文件的文件名
    string fileEx = Path.GetExtension(fileName);//获取文件类型
    string newFileName = DateTime.Now.ToString("yyyyMMddHHmmss") + new Random().Next(10000, 99999).ToString() + fileEx;//生成新文件名
    string SaveLocation = Server.MapPath("~\\uploads\\") + newFileName;//上传文件保存的路径
    try
    {
        file.SaveAs(SaveLocation);//保存文件
        return Json(new { status = "success", message = "文件上传成功！" });
    }
    catch (Exception ex)
    {
        return Json(new { status = "error", message = ex.Message });//上传失败时返回错误信息
    }
}

3.注意事项

在进行APP端的图片上传时，需要注意以下几点：

• 在构造请求体时，需要使用MultipartBody来构造；
• 上传接口地址应该与后端代码中的地址相匹配；
• 上传成功后，应该对响应进行处理。

跨域图片上传

1.前端代码

在进行跨域上传时，需要使用XMLHttpRequest对象来实现异步上传。下面是一个基本的跨域上传示例：

function upload(){
    var xhr = new XMLHttpRequest();
    xhr.open('POST', 'http://www.example.com/upload', true);//跨域上传地址
    xhr.setRequestHeader('Content-Type', 'multipart/form-data');
    xhr.onreadystatechange = function(){
        if(xhr.readyState == 4){
            if(xhr.status == 200){
                console.log(xhr.responseText);//上传成功后的处理
            }else{
                console.error(xhr.statusText);//上传失败后的处理
            }
        }
    }
    xhr.send(new FormData(document.getElementById('upload-form')));
}

2.后端代码

后端将上传的图片进行保存的代码与之前的示例是一样的，这里不再赘述。需要注意的是，在进行跨域上传时，需要根据实际情况设置Access-Control-Allow-*头，使得前端能够正常访问。

3.注意事项

在进行跨域上传时，需要注意以下几点：

• 必须使用XMLHttpRequest对象来实现上传；
• 需要设置Access-Control-Allow-*头以实现跨域访问；
• 在进行跨域上传时，浏览器会发出OPTIONS请求，需要在后端进行相应处理。

以上就是C#实现图片上传（PC端和APP）保存及跨域上传说明的详细攻略。