springmvc实现前后端交互 spring怎么和前端交互

转载

mob64ca13fe9c58 2024-06-28 19:26:39

文章标签 springmvc实现前后端交互 java ajax Springmvc 数据 文章分类 架构后端开发

文章目录

1. 在有无返回值的情况下，页面跳转并传值

1.1 在有返回值信息的情况下；
1.2 在没有返回值的情况下，如何跳转到指定的页面

2. 返回值是ModelAndView
3. 用关键词的方式来进行转发和重定向
4. RequestBody接收请求Json数据ResponseBody响应Json数据

1. 在有无返回值的情况下，页面跳转并传值

1.1 在有返回值信息的情况下；

//有返回值返回页面信息的时候
    @RequestMapping("/testString")
    public String testString(String name, Model model) {
        User user = new User();
        user.setName(name);
        user.setAge(21);//这些值，目前就自己简单的设置，毕竟只是为了掩饰如何在返回的页面接收；
        model.addAttribute("key", user);//将这个对象放到了request域对象里面；
        return "success";
    }

------------------------在页面最简单的接收方法------------------
${key.getName()}//通过这个方式就可以知道，上面的值确实已经放到了request域里面；

由于是通过get的方法传值，信息都在地址栏上；

springmvc实现前后端交互 spring怎么和前端交互_数据

在这里有一点需要注意的是，在页面上取值的时候是通过那个放入的键来取值；比如上面的例子用key来取值；

1.2 在没有返回值的情况下，如何跳转到指定的页面

@RequestMapping("/testvoid")
    public void testvoidd(String name, HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        User user = new User();
        user.setName(name);
        //首先可以通过取值,取到Servlet的request参数，于是就可以用下面的方法进行请求转发，
        //request.getRequestDispatcher("/WEB-INF/pages/success.jsp").forward(request, response);
                //这个不能够访问到WEB-INF里面的文件，所以就在外面设置另外一个页面跳转吧；
        //response.sendRedirect(request.getContextPath()+"/");

        //由于取到Servlet的原生API，可以通过它来设置输出的字符集；
        response.setCharacterEncoding("UTF-8");
        response.setContentType("text/html;charset=UTF-8");

        //直接进行响应；
        PrintWriter writer = response.getWriter();
        writer.write("hellp");

    }

request.getContextPath()可以获得当前工程的路径；然后重定向的时候就可以用来指定路径

2. 返回值是ModelAndView

ModelAndView这个和之前的Model类的使用有些类似，唯一的大的不同就是这个类可以设置返回页面，而Model不可以； 如下事例：

@RequestMapping("/testModelAndView")
    public ModelAndView testModelAndView(String name, ModelAndView mv) {
        //在上面的参数中就可以获得ModelAndView对象，
        User user = new User();
        user.setName(name);
        user.setAge(21);
        mv.addObject("key", user);
        //规定跳转的页面,这里是指跳转名
        mv.setViewName("success");
        return mv;//返回这个ModelAndView 的对象，就可以了，会自动跳转到指定的界面；
    }

取得的效果和第一个有返回值，用Model传值是一样的；

springmvc实现前后端交互 spring怎么和前端交互_数据_02

3. 用关键词的方式来进行转发和重定向

先使用关键词forward进行请求转发；

@RequestMapping("/testforword")
    public String testforword(String name){
        //请求转发的方式
        return "forward:/WEB-INT/pages/success.jsp";
    }

使用关键词redirect进行重定向；

@RequestMapping("/testredirect")
    public String testdirect(String name){
        //重定向的方式进行跳转
        return "redirect:/index.jsp";//工程路径已经由框架底层加好了，所以不需要加也能跳转到这个最表面的层；
    }

重定向会发送两次请求，请求转发只会发送一次；

4. RequestBody接收请求Json数据ResponseBody响应Json数据

下面并不是完整的代码很多配置文件，以前的博客整理过，所以不再重复整理，每学过一个东西，就是主记这一块；1.我们需要准备一个简单的页面，这次只是测试一下Ajax的值传输；

<html>
<head>
    <title>测试json</title>
    <script src="js/jquery.min.js"></script>
    <script>
        $(function () {
            $("#btn").click(function () {
                alert("发送中。。。")
                $.ajax({
                    //里面进行JSON格式数据编写；
                    url: "acontroller/testJson",//路径
                    contentType: "application/json;charset=UTF-8",
                    //下面是json的传值方式；
                    data: '{"name":"dxs","age":"23"}',
                    //下面表示返回的类型；
                    dataType: "json",
                    //表示上传的方式
                    type: "post",
                    success: function (user) {//响应这里要一个参数进行值的接收；
                        //服务器响应的数据，这是可以在这个方法里面再次进行解析并使用；
                        alert(user);//直接输出获得的对象；
                        alert(user.getName())//获得对象中name的值；
                    },
                });
            });
        });
    </script>
</head>
<body>
<button id="btn">按钮</button>
</body>
</html>

2.导入需要的处理JSON的包；由于是Maven项目，只要导入依赖就可以了；

<dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>2.9.0</version>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-core</artifactId>
            <version>2.9.0</version>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-annotations</artifactId>
            <version>2.9.0</version>
        </dependency>

然后在Controller包里，写一个类，类中写一个专门接收这个Json数据的方法，并对其进行处理然后返回JSON数据；

@RequestMapping("/testJson")
    /*为了获得上传的信息，可以使用下面的RequestBody注解获得方法体；
    然后通过注解ResponseBody将值以Json的方式返回；
    * */
    public @ResponseBody User testJson(@RequestBody User user){
        System.out.println(user);
        System.out.println(user.getName());
        user.setName("神");//对其name重新赋值；
        return user;
    }

4.但是仅仅只是做了上面的操作还是不行的，因为之前配置过一个前端控制器，这个前端控制器，会对所有经过的请求进行拦截，同样的还需要对资源文件进行开放，否则，可能会因为拦截而无法访问资源文件；如下在Spring的配置文件中配置，这里我命名为SpringMVC.xml；

<!--在web.xml里面打开了前端控制器，所以在这里要将其关闭一些地方的拦截
    比如静态资源拦截就需要关闭；**的意思是所有的文件都解除了拦截；工程路径
    不需要配置，应当只需要配置工程下的路径；
    还有静态的图片路径，静态的css文件；
    -->
    <mvc:resources mapping="js/**" location="js/"/>
    <mvc:resources mapping="images/**" location="image/"/>
    <mvc:resources mapping="css/**" location="css/"/>

通过Springmvc框架对ajax进行处理还是一种比较方便的操作；不管是数据的请求，还是服务器的响应，都很快；

本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。