最最常见两种,一则返回视图模板(文档),二则为json数据。就使用一个源代码文件来看看springmvc是怎么做到的。

1、UserController.java源代码文件

(这里额外的使用了fastjson架包来将对象解析为json)

package com.zay;

import com.alibaba.fastjson.JSON;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody; import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException; /**
* Created by zay on 2016/11/29.
*/ @Controller
@RequestMapping("/User/")
public class UserController { /*
* 前后端json数据交流
* */
@ResponseBody
@RequestMapping("CheckUsername.do")
public String checkUsername(HttpServletRequest request, HttpServletResponse response) throws IOException{
System.out.println(request.getParameter("username")); //获取username字段值
//这里可进行处理
//得到处理结果
AjaxModel ajax = new AjaxModel(); //自定义的 一个ajax数据模型,为了规范前后端数据交流。
ajax.setMsg("the password is wrong ");
return JSON.toJSONString(ajax);
}
/*
* 返回视图模板字符串,这里将自动补充先前spring配置的视图前后缀以确定最终的视图页面。
* */
@RequestMapping("register.do")
public String register(){
return "register";
}
}

2、其他文件的配置

springmvc-servlet.xml

<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:p="http://www.springframework.org/schema/p"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd">
<!-- 启动注解驱动的Spring MVC功能,注册请求url和注解POJO类方法的映射-->
<mvc:annotation-driven />
<!-- 启动包扫描功能,以便注册带有@Controller、@Service、@repository、@Component等注解的类成为spring的bean -->
<context:component-scan base-package="com.zay" />
<!-- 对模型视图名称的解析,在请求时模型视图名称添加前后缀 -->
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver" p:prefix="/" p:suffix=".jsp" />
</beans>

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
version="3.1">
<servlet>
<servlet-name>springmvc</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
<!-- load-on-startup元素标记容器是否在启动的时候就加载这个servlet(
值必须是一个整数,表示servlet应该被载入的顺序 -->
</servlet> <servlet-mapping>
<servlet-name>springmvc</servlet-name>
<url-pattern>*.do</url-pattern>
</servlet-mapping>
</web-app>

register.jsp

<%--
Created by IntelliJ IDEA.
User: zay
Date: 2016/11/29
Time: 15:56
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>注册页面</title>
<script src="js/jquery-3.1.1.min.js"></script>
<script>
$(function(){
$("#user").blur(function(){
$.ajax({
url:'/springmvc/User/CheckUsername.do',
data:{
username:$("#user").val()
},
dataType:"json",
type:"POST",
success:function(data,status){
alert(data.msg);
}
});
});
});
</script>
</head>
<body>
<p>给自己找个登录名:</p>
<input id="user" type="text" name="user"/>
</body>
</html>

3、架包的引用,除了基本的spring架包外,还使用了fastjson架包。

【springMVC】简单的前后端数据交流的更多相关文章

  1. SpringMVC参数绑定学习总结【前后端数据参数传递】

    目录 1. 绑定机制 2. 支持的数据类型 3. 参数请求中文乱码解决 4.自定义类型转换器 5.最后参数绑定学习小结 SpringMVC作为Controller层(等价servlet和struts中 ...

  2. 微信小程序 + thinkjs + mongoDB 实现简单的前后端交互

    说明:这段时间跟老师学习了一下mongodb数据库,这次也是第一次搭建后台服务,出了不少差错,特此来复盘一下,非常感谢对我提供帮助的同学~ 一.使用 thinkjs + mongodb 创建后台服务 ...

  3. 对GraphQL-BFF:微服务背景下的前后端数据交互方案的研究-------引用

    随着多终端.多平台.多业务形态.多技术选型等各方面的发展,前后端的数据交互,日益复杂. 同一份数据,可能以多种不同的形态和结构,在多种场景下被消费. 在理想情况下,这些复杂性可以全部由后端承担.前端只 ...

  4. web前后端数据交互

    前后端数据交互是每一名web程序员必须熟悉的过程,前后端的数据交互重点在于前端是如何获取后端返回的数据,毕竟后端一般情况下只需要将数据封装到一个jsonMap,然后return就完了.下面通过一个li ...

  5. 两种方法实现asp.net方案的前后端数据交互(aspx文件、html+ashx+ajax)

    一个HTML页面只能显示HTML代码信息,不能与数据库进行数据的交互.asp.net方案提供了网页与数据库交互的方法,这里举出两种:①aspx文件 ②ashx文件+ajax技术 一.创建数据库 这里以 ...

  6. vue-resource的使用,前后端数据交互

    vue-resource的使用,前后端数据交互 1:导入vue与vue-resource的js js下载:   https://pan.baidu.com/s/1fs5QaNwcl2AMEyp_kUg ...

  7. 前后端数据交互处理基于原生JS模板引擎开发

    json数据错误处理,把json文件数据复制到----> https://www.bejson.com/ 在线解析json 这样能直观的了解到是否是json数据写错,在控制台打断点,那里错误打那 ...

  8. 前后端数据交互利器--Protobuf

    Protobuf 介绍 Protocol Buffers(又名 protobuf)是 Google 的语言中立.平台中立.可扩展的结构化数据序列化机制. https://github.com/prot ...

  9. 前后端数据交互(八)——请求方法 GET 和 POST 区别

    WEB 开发同学一看 get 和 post 请求方法的区别,第一感觉都是 So easy! 学习ajax.fetch.axios时,发送网络请求携带参数时,都需要分别处理get和post的参数.所以我 ...

随机推荐

  1. Read4096

    Given API: int Read4096(char* buf); It reads data from a file and records the position so that the n ...

  2. geometric median

    The geometric median of a discrete set of sample points in a Euclidean space is the point minimizing ...

  3. 【iCore3 双核心板】例程二十六:MODBUS TCP实验——电源监控

    实验指导书及代码包下载: http://pan.baidu.com/s/1pKhxKd9 iCore3 购买链接: https://item.taobao.com/item.htm?id=524229 ...

  4. velocity.js用法整理1

    velocity.js 此框架相对于JQ的运动算法, 有很大的优势. 例如,A和B两个元素,position:absolute;  top:0; 现在让A元素用JQ的animate,B用velocit ...

  5. SVN 分支管理

    平时在工作中使用 SVN 只是限于 commit,update 这样的操作,至多再 reslove 解决一下冲突,没有用过分支管理.开发过程中一般都是一个功能开发完成之后整体进行提交,而最近在项目中有 ...

  6. C#winform调用外部程序,等待外部程序执行完毕才执行下面代码

    1.简单调用外部程序文件(exe文件,批处理等),只需下面一行代码即可 System.Diagnostics.Process.Start(“应用程序文件全路径”); 2.如果要等待调用外部程序执行完毕 ...

  7. 我的面经(ing)

    爱立信: C和C++区别 堆和栈的区别 多态性:类的继承 重载与重复声明的区别 大端和小端的概念 一个排序程序(任意) 三次握手过程,优点 为什么UDP没有三次握手 TCP,UDP的区别 五层协议,各 ...

  8. Javascript模块化编程(二):AMD规范 作者: 阮一峰

    声明:转载自阮一峰的网络日志 这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块. (接上文) 七.模块的规范 先想一想,为什么模块很重要? 因为有了模块,我们就可 ...

  9. k8s入门系列之集群安装篇

    关于kubernetes组件的详解介绍,请阅读上一篇文章<k8s入门系列之介绍篇> Kubernetes集群安装部署 •Kubernetes集群组件: - etcd 一个高可用的K/V键值 ...

  10. 产品Backlog

    产品BACKLOG ID Name Imp Est How to demo Notes 1 界面(首页.订单.资料) 50 2 进入界面,选择需要的界面 使用分栏界面 2 首页里的功能按钮 40 6 ...