springmvc獲取axios數據爲null狀況

    場景:前端用了vue沒有用ajax與後臺通訊,用了axios,可是在代碼運行過程當中發現axios傳遞到後臺的值接受到數據爲null。前端

    問題緣由:此處的問題在與axios返回給後臺的數據爲json類型的,後臺接收和返回也應該是json類型的才行。vue

    解決方式:這裏用的是@ResquestBody和@ReponseBody這兩個註解來解決的。以下圖代碼使用@RequestBody Map map去獲取前臺傳遞過來的數據,而後返回給前端的數據也必須爲json格式,這時候須要在方法上方加一個@ReponseBody註解。或者在類的上用@RestController代替@Controller註解也有相同的效果。node

public String toMainPage(@RequestBody Map map, HttpServletRequest request) throws Exception {
    String username = (String) map.get("username");
    String password = (String) map.get("password");
    String flag = (String) map.get("flag");
    ModelAndView mv = new ModelAndView();
    HttpSession session = request.getSession();
    String getPassword = null;
    if("0".equals(flag)){//登陸用戶爲管理員的狀況
        getPassword = this.userSystemService.getSSystemByUsername(username,password);
    }else{//普通用戶登陸
        getPassword = this.userSystemService.getUserByUsername(username,password);
    }
    if(!"".equals(getPassword) && getPassword != null){//用戶名密碼都正確的狀況下將用戶的數據放入session
        session.setAttribute("loginName",username);//登陸用戶名
        session.setAttribute("flag",flag);//登陸角色類型
    }
    return getPassword;
}

    axios方法講解:因爲也是第一次使用axios像後臺傳遞數據,這裏只寫出我的的使用感悟,若是有不對的地方但願指正。axios和ajax的使用很類似,下面的例子是一個post請求,而then就至關於ajax中的success,catch則至關於error。post裏面的「/judgeUser」爲請求地址,後面的爲須要傳遞給後臺的數據。ios

    axios引入說明,axios引入有兩種方法。一種是:若是項目中使用了node的話經過node的方式引入,這邊本項目沒有使用node,在這裏不對這種方式作講解。本項目經過第二種方式:以js文件的形式引入的。ajax

<script src="https://unpkg.com/axios/dist/axios.min.js">

或者也能夠登如上面的地址將內容複製下來而後放在axios.min.js文件來引入json

<script src="/resources/js/axios.min.js"></script>
axios.post('/judgeUser', {
        username : username,
        password : password,
        flag : flag,
    })
        .then(function (res) {
            if(res.data == "1") {
                if(flag == "0") {//管理員登陸
                    location.href = "/toMain";
                }else {//普通人員登陸
                    location.href = "/toMain";
                }
            }else {
                alert("用戶名或者密碼不正確");
            }
        })
        .catch(function (err) {
            alert("驗證失敗,用戶名或者密碼不正確");
        });
相關文章
相關標籤/搜索