Question

我在AccountController中有此方法

RouterModule.forRoot([
  { path: 'home', component: HomeComponent },
  { path: '', redirectTo: 'home', pathMatch: 'full' },
  { path: 'admin', component: AdminComponent }
]),

此ajax代码在视图中：

[HttpPut]
[Route("UserInfo")]
public async Task<IHttpActionResult> SetUserInfo(UserViewModel model)
{
    if (!ModelState.IsValid)
    {
        return BadRequest(ModelState);
    }

    var user = UserManager.FindByName(User.Identity.Name);

    user.UserName = model.UserName;
    user.Email = model.Email;
    user.FullName = model.FullName;
    user.Skype = model.Skype;
    user.PhoneNumber = model.PhoneNumber;

    SaverPhotos.SavePhoto(model);

    IdentityResult result = await UserManager.UpdateAsync(user);

    if (!result.Succeeded)
    {
        return GetErrorResult(result);
    }

    return Ok();
}

public class UserViewModel
{
    public string UserName { get; set; }
    public string FullName { get; set; }
    public string Email { get; set; }
    public string Skype { get; set; }
    public string PhoneNumber { get; set; }
    public HttpPostedFileBase Avatar { get; set; }
}

以很多代码的形式出现，但是文件输入看起来像这样：

$.ajax({
    type: 'PUT',
    contentType: false,
    processData: false,
    url: '/api/account/UserInfo',
    data: data,
    beforeSend: function (xhr) {
        var token = window.app.model.get('tokenInfo');
        xhr.setRequestHeader("Authorization", "Bearer " + token);
    },
    success: function (response) {
        alert("Successfully saving info!");
    },
    error: function (response) {
        alert('Error');
    }
});

当我尝试保存此表单时，出现代码415的错误。没有contentType和proccessType的“ false”错误为500，但是在调试模式下，我什至没有进入SetUserInfo方法。 UserViewModel只是null。为什么？在互联网上，很多人说编写UploadFileController来保存图像，但是我该如何与用户一起设置此图像呢？请帮助。

Answer 1

好的，我解决了。

[HttpPost]
        [Route("UserInfo")]
        public async Task<IHttpActionResult> SetUserInfo()
        {
            NameValueCollection form = HttpContext.Current.Request.Form;
            var model = Pawmapper<UserViewModel>.Map(form, new UserViewModel());

            var user = UserManager.FindByName(User.Identity.Name);
            user.UserName = model.UserName;
            user.Email = model.Email;
            user.FullName = model.FullName;
            user.Skype = model.Skype;
            user.PhoneNumber = model.PhoneNumber;

            if (HttpContext.Current.Request.Files.Count > 0)
            {
                model.Avatar = HttpContext.Current.Request.Files["Avatar"];
                var photoId = Guid.NewGuid() + Path.GetExtension(model.Avatar.FileName);

                user.Photo = new DataProvider.Photo
                {
                    FileName = model.Avatar.FileName,
                    Path = "app/modules/main/img/users/" + photoId
                };

                model.Avatar.SaveAs(HttpContext.Current.Server.MapPath("~/Client/app/modules/main/img/users/" + photoId));
            }

            var result = await UserManager.UpdateAsync(user);

            if (!result.Succeeded)
            {   
                return GetErrorResult(result);
            }

            return Ok();
        }

Pawmapper

public static class Pawmapper<T>
    {
        public static T Map(NameValueCollection nameValueCollection, T model)
        {
            foreach (string keyValue in nameValueCollection.AllKeys)
            {
                PropertyInfo property = model.GetType().GetProperty(keyValue, BindingFlags.Public | BindingFlags.Instance);
                if (property != null)
                {
                    property.SetValue(model, nameValueCollection[keyValue], null);
                }
            }

            return model;
        }
    }

如何使用Web API保存图片？

1 个答案: