一、背景

由於近期工作需要將人臉識別功能與選課系統結合，但是對前端知識瞭解的很少，只能邊做邊學了，因此在這邊把遇到的一些坑說明一下，希望能幫助到像我一樣的初學者

二、具體內容

這裡採用框架為MVC，如果想在頁面中不通過提交表單方式與控制器互動的話，可以用ajax去呼叫控制器方法並傳遞引數以及處理返回的json資料，方法如下

頁面程式碼：

 $.ajax(
    {
           url: '/User/facelog',     // 請求地址, 就是你的控制器, 如 test.com/home/index/index
           data: JSON.stringify({ stuID: stuID2 }),   // 需要傳送的引數
           type: 'POST',   // 請求方式
           dataType: 'json', // 返回資料的格式, 通常為JSON
           contentType: 'application/json',             
           success: function (result) {
               window.location.href = result.NextUrl;
               msg = result.Msg;
               console.log(result); // 請求成功後的回撥函式, result 為響應內容
           },
           error: function () {
               console.log('Send Request Fail..'); // 請求失敗時的回撥函式
           }
       }
   );
 

控制器程式碼：

 [HttpPost]
 public JsonResult facelog(string  stuID)
    {
       User user = this.UserService.Select((User T) => (T.UserName == stuID) && T.Status == 0);
        if (user != null)
        {
            base.Session["UserInfo"] = user;
            AjaxMsg ajaxMsg = new AjaxMsg()
            {
                Statu = "ok",
                Msg = "登陸成功，正在跳轉頁面...",
                NextUrl = "/User/Main"
            };
            return base.Json(ajaxMsg);
        }
        return base.Json(new { Statu = "error", Msg = "賬號或密碼錯誤！"});
    }   
 

這裡有幾個坑需要特別說明一下：

1. 在URL填寫中為‘/控制器/方法名’這裡一定要注意，控制器指的並不是控制器全名，而是去掉controller的那個，這裡我的控制器為UserController,因此這裡填寫User,話說我踩到這個坑，害我除錯了好久。。。

2. 就是傳遞引數格式了，data這裡傳遞的引數是動態的，因此就定義了全域性變數儲存，這裡被坑的地方是stuID2 的值是從另外一個ajax請求中獲得，但另外一個數據還未返回時這個ajax已經執行了，害我一直以為是data填的格式不對才導致資料無法傳遞到控制器中

3. 接第二點，如果想要在一個ajax執行完成後再執行另外一個，這裡用 async: false即可，預設情況是為true的

4. JSON.stringify 要與 contentType: 'application/json' 一起用才能很好的將資料傳遞過去

5. 關於返回資料，一般為json的需要解析一下