SpringMVC后端返回数据到前端代码示例

时间：2021-05-19

1.返回ModelAndView对象（.jsp）

controller代码：

package controller;import java.util.List;import javax.annotation.Resource;import model.Comment;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Controller;import org.springframework.stereotype.Service;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.servlet.ModelAndView;import service.CommentService;@Controller//@RequestMapping("comment")public class CommentController { @Resource private CommentService commentService; @RequestMapping(value="showComments") public ModelAndView test(){ ModelAndView mav = new ModelAndView(); List<Comment> comments = commentService.selectAllComment(); for(Comment com:comments){ System.out.println(com.getC_text()); } mav.addObject("msg",comments); mav.setViewName("textIndex.jsp"); return mav; }}

jsp页面代码

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <base href="<%=basePath%>" rel="external nofollow" > <title>My JSP 'index.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css" rel="external nofollow" > --> </head> <body> <c:forEach items="${msg}" var="com"> ${com.getUid()}:${com.getC_text()}:${com.getC_date()}<br> </c:forEach> </body></html>

2.返回JSON数据到html页面

利用ajax接收数据

ajax({ method:'post', url:'http://localhost:8080/graduate/showComments.do', data:'null', success:function(response){ console.log(response); }})

controller

@Controller//@RequestMapping("comment")public class CommentController { @Resource private CommentService commentService; @RequestMapping(value="showComments") @ResponseBody public List<Comment> test(){ List<Comment> comments = commentService.selectAllComment(); for(Comment com:comments){ System.out.println(com.getC_text()); } return comments; }}

3.顺便记录一下原生ajax,方便以后使用

function ajax(opt) { opt = opt || {}; opt.method = opt.method.toUpperCase() || 'POST'; opt.url = opt.url || ''; opt.async = opt.async || true; opt.data = opt.data || null; opt.success = opt.success || function () {}; var xmlHttp = null; if (XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } else { xmlHttp = new ActiveXObject('Microsoft.XMLHTTP'); }var params = []; for (var key in opt.data){ params.push(key + '=' + opt.data[key]); } var postData = params.join('&'); if (opt.method.toUpperCase() === 'POST') { xmlHttp.open(opt.method, opt.url, opt.async); xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8'); xmlHttp.send(postData); } else if (opt.method.toUpperCase() === 'GET') { xmlHttp.open(opt.method, opt.url + '?' + postData, opt.async); xmlHttp.send(null); } xmlHttp.onreadystatechange = function () { if (xmlHttp.readyState == 4 && xmlHttp.status == 200) { opt.success(JSON.parse(xmlHttp.responseText)); } }; }

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

相关文章