ASP.NET 最小 WebAPI 上传文件

后端

// accept upload image file
app.MapPost("/api/upload-img/{id}", async Task<IResult> (int id, HttpRequest request) =>
{
    Log.Information("Upload image request for id: {0}", id);
    if (!loginManager.IsLogin(request.HttpContext.GetIpAddress()))
    {
        return Results.Json(new ServerAckDash()
        {
            Success = false,
            Message = "Not logged in"
        });
    }
    
    if (!request.HasFormContentType)
        return Results.Json(new ServerAckDash()
        {
            Success = false,
            Message = "Invalid content type"
        });
    
    var form = await request.ReadFormAsync();

    if (form.Files.Any() == false)
        return Results.Json(new ServerAckDash()
        {
            Success = false,
            Message = "No file found"
        });

    var file = form.Files.FirstOrDefault();

    if (file is null || file.Length == 0)
        return Results.Json(new ServerAckDash()
        {
            Success = false,
            Message = "No file found"
        });

    using var stream = file.OpenReadStream();
    
    // read image data
    byte[] data = new byte[file.Length];
    await stream.ReadAsync(data, 0, (int)file.Length);

    // save image to file
    var fileName = file.FileName;
    Log.Information("Image file name: {0}", fileName);

    var storePath = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "customImg");

    if (!Directory.Exists(storePath))
    {
        Directory.CreateDirectory(storePath);
    }
    
    var filePath = Path.Combine(storePath, fileName);
    
    Log.Information("Image will be write to {0}", filePath);

    if (File.Exists(filePath))
    {
        File.Delete(filePath);
    }
    
    using var fileStream = new FileStream(filePath, FileMode.Create);
    await fileStream.WriteAsync(data, 0, data.Length);
    fileStream.Close();
    return Results.Json(new ServerAckDash()
    {
        Success = true,
        Message = "Image uploaded"
    });
}).Accepts<IFormFile>("multipart/form-data");

前端

uploadImage(id) {
    const formData = new FormData();
    const fileInput = document.getElementById('bg-input');
    const file = fileInput.files[0]; // 获取选中的文件
    formData.append('file', file); // 将文件添加到FormData对象中
    fetch('/api/upload-img/' + id, {
        method: 'POST',
        body: formData // 设置请求体为FormData对象
    })
        .then(response => response.json())
        .then(data => {
        if (data.success) {
            Swal.fire({ title: 'Image uploaded!', text: data.message });
        } else {
            Swal.fire({ title: 'Image upload failed!', text: data.message });
        }
    })
        .catch(error => console.error(error));
},