axios请求

get请求:

      this.$axios.get("http://www.wwtliu.com/sxtstu/news/juhenews.php",{

        params:{//是否添加.get都是使用get方式发送请求,axios的默认方式

          type:"junshi",

          count:30

        }

      })

      .then(res => {

        this.newsData = res.data;

      })

      .catch(error => {})

 

post请求:

      form-data:?name=iwen&age=20

      x-www-form-urlencoded:{name:"iwen",age:20}

      注意:axios接受的post请求参数的格式是form-data格式

      this.$axios.post("http://www.wwtliu.com/sxtstu/blueberrypai/login.php",

             qs.stringify({

                    user_id:"iwen@qq.com",

                    password:"iwen123",

                    verification_code:"crfvw"

             }))

  .then(res => {})

  .catch(error => {})

 

全局axios默认值

axios.defaults.baseURL = 'https://api.example.com';

axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;

axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

全局拦截器

axios.interceptors.request.use(function (config) {

    //在发送请求之前的处理

    if (config.method == "post") {//处理post请求

        config.data = qs.stringify(config.data);

    }

    return config;

}, function (error) {

    //对请求错误处理

    return Promise.reject(error);

});

//响应拦截器

axios.interceptors.response.use(function (response) {

    //对响应数据处理

    return response;

}, function (error) {

    //对响应错误处理

    return Promise.reject(error);

});

 解决跨域问题

//解决跨域问题(与config中index.js一起配置)

//main.js添加代码

Vue.prototype.HOST = '/api'

//index.js文件中在dev:{}中添加

proxyTable: {

    "/api": {

        target: "http://localhost:8080",

        changeOrigin: true,

        pathRewrite: {

            '^/api': ''

        }

    }

},

//使用时

var url = this.HOST + "/illness/GetHospitalList";

axios.get(url, {}).then(response => {}).catch(error=>{});

//开发时建议不在前端进行跨域处理,因为在打包合并时需要处理的请求url过多,

//建议使用axios默认配置中的默认url进行配置,打包合并时只需要修改一处即可

//跨域与默认配置不可用时使用,使用跨域时需要注释掉默认配置

vue-resource使用

this.$http.get(url).then(response => {

   console.log(response.body);

}).catch(error => {

   console.log(error);

})

posted @ 2019-04-15 15:21  <h2>Login</h2>  阅读(223)  评论(0编辑  收藏  举报