ajax请求模板

模板一

1.html

	<script src="/jquery/jquery.js"></script>

<div class="login">
	<div class="message">管理登录</div>
	<div id="darkbannerwrap"></div>

	<div class="layui-form" id="loginForm">
		<input name="username" placeholder="账号"  type="text" lay-verify="required" class="layui-input" id="username">
		<hr class="hr15">
		<input name="password" lay-verify="required" placeholder="密码"  type="password" class="layui-input" id="password">
		<hr class="hr15">
		<input class="loginin" value="登录" style="width:100%;" type="button" id="submit-btn" onclick="submit()">
		<hr class="hr20" >
	</div>
</div>

2.Ajax

	function submit() {
			$.ajax({
				async: false,//同步，待请求完毕后再执行后面的代码
				type: "POST",
				url: 'sys/user/login',
				data: JSON.stringify({
					userUsername: $("#username").val(),
					userPassword: $("#password").val()
				}),
				dataType: "json",
				contentType:"application/json",
				success: function (data) {
					if(data.code==0) {
						window.location.href="index/home";
					} else{
						layer.alert(data.msg, {
							icon: 5,
							title: "提示"
						});
					}
				},
				error: function () {
					alert("数据获取失败")
				}
			})
	}

3.Controller

@Api(tags = "组织模块-用户管理")
@RequestMapping("/sys")
@RestController
public class UserController {

    @Autowired
    private UserService userService;

    @PostMapping("/user/login")
    @ApiOperation(value = "用户登录接口")
    public DataResult login(@RequestBody @Valid UserLoginReqVO vo){
        LoginRespVO loginRespVO = new LoginRespVO();
        Subject subject = SecurityUtils.getSubject();
        UsernamePasswordToken token = new UsernamePasswordToken(vo.getUserUsername(), vo.getUserPassword());
        try {
            subject.login(token);
            User user = userService.selectByUsername(vo.getUserUsername());
            loginRespVO.setUserId(user.getUserId());
            loginRespVO.setUserUsername(user.getUserUsername());
            loginRespVO.setUserPhone(user.getUserPhone());
            return DataResult.getResult(0,"登录成功！",loginRespVO);
        } catch (UnknownAccountException e) {
            throw new BusinessException(BaseResponseCode.NOT_ACCOUNT);
        } catch (IncorrectCredentialsException e) {
            throw new BusinessException(BaseResponseCode.PASSWORD_ERROR);
        }catch (Exception e){
            throw new BusinessException(BaseResponseCode.OPERATION_ERRO);
        }
    }
}    

模板二

ajax不声明成json 后端不写requestBody
ajax必须声明application/json就是因为requestBody注解必须json

1.html

如上

2.Ajax

	function submit() {
			$.ajax({
				async: false,//同步，待请求完毕后再执行后面的代码
				type: "POST",
				url: 'sys/user/login',
				data: {
					userUsername: $("#username").val(),
					userPassword: $("#password").val()
				},
				dataType: "json",
				success: function (data) {
					if(data.code==0) {
						window.location.href="index/home";
					} else{
						layer.alert(data.msg, {
							icon: 5,
							title: "提示"
						});
					}
				},
				error: function () {
					alert("数据获取失败")
				}
			})
	}

3.Controller

@Api(tags = "组织模块-用户管理")
@RequestMapping("/sys")
@RestController
public class UserController {

    @Autowired
    private UserService userService;

    @PostMapping("/user/login")
    @ApiOperation(value = "用户登录接口")
    public DataResult login(@Valid UserLoginReqVO vo){
        LoginRespVO loginRespVO = new LoginRespVO();
        Subject subject = SecurityUtils.getSubject();
        UsernamePasswordToken token = new UsernamePasswordToken(vo.getUserUsername(), vo.getUserPassword());
        try {
            subject.login(token);
            User user = userService.selectByUsername(vo.getUserUsername());
            loginRespVO.setUserId(user.getUserId());
            loginRespVO.setUserUsername(user.getUserUsername());
            loginRespVO.setUserPhone(user.getUserPhone());
            return DataResult.getResult(0,"登录成功！",loginRespVO);
        } catch (UnknownAccountException e) {
            throw new BusinessException(BaseResponseCode.NOT_ACCOUNT);
        } catch (IncorrectCredentialsException e) {
            throw new BusinessException(BaseResponseCode.PASSWORD_ERROR);
        }catch (Exception e){
            throw new BusinessException(BaseResponseCode.OPERATION_ERRO);
        }
    }