简体   繁体   中英

ASP .NET MVC Core WEB API upload file showing error using Angular JS

Here is my client side html (I used ng file upload)

<button type="file" ngf-select="uploadFileToUrl($file)"
        ngf-max-size="100MB">
    <!--ngf-max-height="1000"-->
    Photo
</button>

Here is my client side js

$scope.uploadFileToUrl = function (file) {
        console.log(file) // Here console prints my file information 
        alert(file);
        var data = new FormData();
        data.append('photo', file)

        $.ajax({
            type: "POST",
            url: "http://localhost:22475/api/FileUpload",
            contentType: false,
            processData: false,
            data: data,
            success: function (message) {
                alert(message);
            },
            error: function () {
                alert("There was error uploading files!");
            }
        });
    }

Here is my server side

 private IHostingEnvironment hostingEnv ;

    public FileUploadController(IHostingEnvironment env)
    {
        this.hostingEnv = env;
    }

[HttpPost]
public async Task<IActionResult> PostProfilePicture(ICollection<IFormFile> files) // Here i get file count 0 on tool tip
{
    var uploads = Path.Combine(hostingEnv.WebRootPath, "uploads");
    foreach (var file in files)
    {
        if (file.Length > 0)
        {
            using (var fileStream = new FileStream(Path.Combine(uploads, file.FileName), FileMode.Create))
            {
                await file.CopyToAsync(fileStream);
            }
        }
    }
    return null;
}

Here i get file upload error i searched through net, all i got this code but its not working, can anyone help and point out what am i doing wrong here..

You are calling action result name in URL is 'FileUpload' and Server side action result name is 'PostProfilePicture'. You need to maintain same name in both sides or you can add route name above httppost in server side code

[Route("api/FileUpload")]
[HttpPost]

Ya i got my answer

public async Task<IActionResult> Post(ICollection<IFormFile> files)
{
    var v = Request.Form.Files[0];
    var uploads = Path.Combine(hostingEnv.WebRootPath, "uploads");


            using (var fileStream = new FileStream(Path.Combine(uploads, v.FileName), FileMode.Create))
            {
                await v.CopyToAsync(fileStream);
            }
    return null;
}

Take the file from request and upload it,Thanku

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM