springmvc 使用json交互数据 (ajax)

秒速五厘米 2022-05-27 08:47 193阅读 0赞

spirngmvc默认使用的是MappingjacksonHttpMessageConverter对json数据进行转换，需要加入

jackson-core-asl.jar

jackson-mapper-asl.jar

jackson-databind.jar

jackson-core.jar

jackson-annotations.jar

然后使用@RequestBody  @ResponseBody这两个注解。

public class StoreQueryAction {
    
    	/**
    	 * 提交登陆页面
    	 * @param i
    	 * @return
    	 * @throws Exception
    	 */
    	@RequestMapping("/login")
    	public @ResponseBody Map<String, String> login(String username, String password) throws Exception {
    		// TODO Auto-generated method stub	
    		
    		Map<String, String> map = new HashMap<String, String>();	
    		map.put("code", "haha");
    		map.put("enen", "发发");
    		
    		return map;
    	}
    
    	
    }

前台页面

<!DOCTYPE HTML>
    <html>
    <head>
    <title>乌云后台登录</title>
    
    <link href="css/loginstyle.css" rel="stylesheet" type="text/css" media="all"/>
    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <meta name="keywords" content="后台登录" />
    
    <script type="text/javascript" src="js/jquery/jquery-3.3.1.min.js"></script>
    <script type="text/javascript">
    	function login() {
    		var userdata = {
                "username":$("#username").val(),
                "password":$("#password").val()};
    		$.ajax({
    			url : "login.do",
    			method : "post",
    			dataType : "json",
    			data : {"username":"ssss", "password":"ccccc"},
    			success : function(data){
    				var d = JSON.stringify(data);
    				if (d.code == "100") {
    					window.location.href = "jsp/main.jsp";
    				}else{
    					var msg = d.msg;
    					document.getElementById("error").innerHTML = msg;
    				}
    			}
    		});
    	
    	}
    </script>
    
    </head>
    <body>
    
    <div class="login-form">
    			<div class="top-login">
    				<span><img src="img/group.png" alt=""/></span>
    			</div>
    			<h1>塔南店信息查系统</h1>
    			<div class="login-top">
    			<form>
    				<div class="login-ic">
    					<i ></i>
    					<input type="text" id="username" value="用户" onFocus="this.value = '';" onBlur="if (this.value == '') {this.value = 'User name';}"/>
    					<div class="clear"> </div>
    				</div>
    				<div class="login-ic">
    					<i class="icon"></i>
    					<input type="password" id="password" value="密码" onFocus="this.value = '';" onBlur="if (this.value == '') {this.value = 'password';}"/>
    					<div class="clear"> </div>
    				</div>
    			
    				<div class="log-bwn">
    					<input type="submit" value="Login" οnclick="login()">
    				</div>
    				</form>
    				<div id="error"></div>
    			</div>
    
    </div>		
    
    </body>
    </html>