Question

我是Web API的新手，这里将表单数据从Angular 4应用程序发送到Web API。

表单数据包含作为mFormData的用户注册详细信息和作为mImage的用户图像。

我要将图像存储在系统文件夹ex中：D：/ uplodedImages 并且需要将所有用户详细信息存储在数据库中。

我正在努力做上述事情。

service.ts（角度4）

getFormData : function(){

    var _this = this;
    var x = _this.$props.currentModuleFormId;
    console.log(x);
    let urs = 'http://localhost:3000/getFormData?formID='+_this.$props.currentModuleFormId.toString();
    axios
        .get(urs , {
            params: {
              formID: _this.$props.currentModuleFormId
            }
        })
        .then(function(response){

            console.log(response);

        })
}

API

  CreateNewComitteeMember(mFormData, mImage) {
    const formData: FormData = new FormData();
    formData.append('ImageFile', mImage, mImage.name);  
    formData.append('mFormData', JSON.stringify(mFormData));
    return this.http.post(this.BASE_URL + `/api/CreateNewComitteeMember`, formData)
  }

谁能帮我解决这个问题。

Answer 1

您可以简单地通过访问附加数据时使用的名称来获取数据。

但是由于ASP.NET无法识别Java对象。您将需要序列化“ mFormData”。因此，请求将像这样更改。

formData.append('mFormData', JSON.stringify(mFormData));

现在，在Web API中，创建一个复制“ mFormData”的模型，将其称为MFormData。

示例

public class MFormData 
{
    public string Name {get; set;}
    public int Age {get; set;}
    public string Xyz {get; set;}
    public string ImageUrl {get; set;}
    ...
}

现在，在您的API中，您可以像这样访问数据。

    [AllowAnonymous]
    [HttpPost]
    [Route("api/CreateNewComitteeMember")]
    public Task<HttpResponseMessage> CreateNewComitteeMember()
    {
        var imageData = HttpContext.Current.Request.Params["mImage"];
        var formData = new JavaScriptSerializer()
        .Serialize<MFormData>(HttpContext.Current.Request.Params["mFormData"]);
        try
        {
            //Function to save the file and get the URL
            formData.ImageUrl = new ApplicationBussinessLayer().SaveFileInDir(imgeData);
            //Function to save data in the DB
            var saveData = await new AppicationBussinessLayer().SaveUserInfo(formData);    
        }
        catch(Exception ex)
        {
            return Request.Create(HttpStatusCode.Code, "Some error");
        }
        return Request.Create(HttpStatusCode.OK, "Data Saved");
    }

如何在Web API中接收表单数据和处理数据

1 个答案: