zoukankan      html  css  js  c++  java
  • vue中axios使用二:axios以post,get,jsonp的方式请求后台数据

    本文为博主原创,转载请注明出处

      axios在上一篇中讲过:vue中axios使用一:axios做拦截器,axios是请求后台资源的模块,用来请求后台资源。

      axios本身是支持get,post请求后台数据,示例如下:

    post方式:

    axios.post('/user', {
        firstName: 'Fred',
        lastName: 'Flintstone'
      })
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      });

      get方式:

    axios.get('/user?ID=12345')
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      });

      axios不支持jsonp的方式,在网上搜寻了很多的方式,找到一个可以使用jsonp在前端跨域请求的一个方法,特此记录

        axios不支持jsonp,因为axios的作者觉得jsonp不太友好,推荐用CORS方式更为干净,但是jsonp支持范围更加广阔一些,

      一些老式的IE浏览器也能支持,所以有些公司还是jsonp用的多些,那么如果要使用jsonp,可以独立安装

      npm i jsonp --save-dev 然后在页面中引用import jsonp from 'jsonp',使用方式也是非常简单的:

     jsonp(config.ajaxUrl + '路径', null, (err, data) => {
       if (err) {
         console.error(err.message);
       } else {
         if (data.list.length > 0) {
           data.list.map((item) => this.list.push(item))
           console.log(data);
         }
       }
     })
  • 相关阅读:
    NET ERP系统架构设计
    WebApi的一种集成测试写法(in-memory)
    开发类工具
    GitHub版本控制
    TortoiseGit安装与配置(转)
    tortoisegit使用密钥连接服务器(转)
    重构一个功能块的总结
    脚本绘图工具总结(转)
    Oracle 多表关联更新
    数据结构与算法之递推算法 C++与PHP实现
  • 原文地址:https://www.cnblogs.com/zjdxr-up/p/11474989.html
Copyright © 2011-2022 走看看