前端使用ajax给SpringBoot传递参数

以前看了好多SpringBoot做web应用
上一次看到做前端的，还是用的thymeleaf的模板引擎
最近看的项目使用的是swagger，没有进行前端的开发
所以今天就做一下ajax和springboot组合的小页面，一弄就是一天……

代码

controller部分

@Controller
public class LoginController {
    @RequestMapping("/")
    public String gotoLogin(){
        return "login";
    }
    //@ResponseBody注释说明返回的信息不是要跳转到的页面，而是作为数据写回ResponseBody中
    //这里的返回值就是ajax中success后得到的值
    @ResponseBody
    @RequestMapping("/login")
    //得到ajax的数据，参数写json数据的key值，就能得到value值
    public String login(String name, String password){
        System.out.println("12313");
        String na = name;
        String pas = password;
        if (na.equals(pas))
            return "1";
        else
            return "0";
    }
}

index.html

只有部分代码

//自己的js要放在jquery后面
<script src="../static/js/jquery-3.1.0.min.js">script>
<script src="../static/actionJs/login2.js">script>
//两个输入框，一个按钮
<input type="text" id="login_name" class="form-control" placeholder="用户名" />
<input type="password" id="password" class="form-control" placeholder="密码" />
<button type="button" id="btn">登录button>

login.js

$(document).ready(function () {
    alert("进来了")
    $('#btn').click(function () {
        var login_name = $("#login_name").val();
        var login_password = $("#password").val();
        $.ajax({
            url: "/login",
            type: "post",
            dataType: "json",
            data : {
                "name": login_name,
                "password": login_password
            },
            success: function (data) {
                if(data==1)
                //这里的路径是相对于js的路径
                    window.location.href='../templates/index.html';
                else
                    window.location.href='login.html';
            },
            error: function (e) {
                console.log("faild")
            }
        })
    });
})

注意问题

引入thymeleaf模板引擎

不过不引入thymeleaf模板引擎，controller中 return 就不能在 templates 下面自动找到 html 页面

yml中配置静态资源的路径

不配置路径会导致 js 和 css 等静态资源找不到

Spring:
  resources:
    static-locations: classpath:/