美文网首页关于vue
SpringBoot+Vue数据交互

SpringBoot+Vue数据交互

作者: 简小园 | 来源:发表于2019-05-26 11:10 被阅读0次

    后端框架Spring Boot,前端框架vue

    1. 跨域+携带cookie

    跨域-携带cookie

    2. 拦截器

    在main.js里设置拦截器

    // 添加请求拦截器
    axios.interceptors.request.use(function (config) {
      // 在发送请求之前,格式化参数,增加token
      let data = config.data;
      let params = new URLSearchParams()
      for (var key in config.data) {
        params.append(key, data[key])
      }
    //params.append("tokenStr", getTimes())
      config.data = params;
      return config;
    }, function (error) {
      return Promise.reject(error);
    });
    
    拦截器

    3. 发送请求

        login:function(){
          let that=this;
          this.axios({
            method: 'post',
            url: 'http://000.00.00.0:8888/login', //后端api
            data: {
              account: $("#account").val(),  //传给后端的数据
              userPassword: $("#pwd").val()
            },
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}   //跨域
          }).then(function (res) {
            console.log(res);
          }).catch(function (error) {
            console.log(error)
          });
        },
    

    相关文章

      网友评论

        本文标题:SpringBoot+Vue数据交互

        本文链接:https://www.haomeiwen.com/subject/splxtctx.html