使用angularjs将数据发布到asp.net核心控制器

时间:2016-07-20 14:44:26

标签: c# asp.net angularjs asp.net-core

我是Asp.net核心新手。我正在尝试创建连接到数据库的简单登录页面。但由于某种原因,我无法向控制器发布用户名和密码。

控制器/ HomeController.cs

namespace WebApplication12.controllers
 {
public class HomeController : Controller
{
    public ActionResult Index()
    {
        MysqlConnector test = new MysqlConnector();
        return View(test);
    }




    public string test_name { get; set; }
    public string test_role { get; set; }

    private MySqlConnection connectio;

    [HttpPost]
    public JsonResult PostData(string User, string Pass)
    {
        connect(User,Pass);
        MySqlCommand query = new MySqlCommand();
        query.Connection = connectio;
        query.CommandText = string.Format("Select * from users");

        MySqlDataReader reader = query.ExecuteReader();

        reader.Read();
        try
        {
            test_name = reader["user"].ToString(); //reader.getString(1);
            test_role = reader["role"].ToString();
            reader.Close();
            return Json(new {success=true , user=test_name});

        }
        catch (Exception err)
        {
            test_name = err.ToString();
            test_role = err.ToString();
            reader.Close();
            return Json(new { success = false });
        }



    }


    private void connect(string user,string pass)
    {


        string ConnectionString =  string.Format("server=localhost ;database=xdata; uid={0} ; pwd={1}",user,pass);

        connectio = new MySqlConnection(ConnectionString);
        connectio.Open();



    }
}

的login.html

 <p><input ng-model="username" value="Username"/></p>
 <p><input ng-model="password" value="Password"/></p>
<p><button type="button" ng-click="submit(username,password)">Click to Submit</button></p>

角度代码

 $http.post('/HomeController/PostData/', {
        'User': user,
        'Pass': pass

    })

    .success(function (data) {
        $scope.something = data;
        console.log(data);

    }).error(function (response) {

        alert("Fail");

    });

单击按钮时,在控制台上显示整个html。显然发布时出错。提前致谢。 (“HomeController / PostData /(?)”中的错误

2 个答案:

答案 0 :(得分:3)

取出“控制器”一词。尝试将代码更改为:

 $http.post('/Home/PostData/', {
    'User': user,
    'Pass': pass

})

.success(function (data) {
    $scope.something = data;
    console.log(data);

}).error(function (response) {

    alert("Fail");

});

答案 1 :(得分:1)

您的代码必须更改以解决两个问题。

问题1:路由

由于Rani Radcliff指出$http.post中的网址必须更改为'/Home/PostData';,否则将收到404状态代码。控制器“fooMethod”中方法“fooController”的默认路由为“/foo/fooMethod”。

问题2:从正文中读取模型

引入模型类并使用[FromBody]

注释操作
public class LoginModel {
    public string User {get; set;}
    public string Pass {get; set;}
}

public class HomeController : Controller
{
    ...

    [HttpPost]
    public JsonResult PostData([FromBody] LoginModel model)
    {
       ...
    }
}

问题3:首选HTTP状态代码以表示成功或失败

在您的示例中,JSON响应包含布尔success属性。根据RESTful API的原则,我们最好使用HTTP状态代码。在ASP.NET Core中,您可以使用Controller-Base-Class的特定辅助函数,例如,而不是返回JsonResult,你可以使用

return Ok(); 
return Ok(someObject); // someObject will be converted to JSON

return Unauthorized();