axios中跨域请求

vue1.0时代我们可以通过jsonp方法进行跨域,但是vue更新到2.0之后,作者就不再推荐使用vue-resouce跟后台进行交互而是推荐使用axios,然而axios默认是没有跨域的jsonp方法的,我们可以在配置文件中设置代理来进行跨域。
在webpack.config.js(config—>index.js)文件里设置代理

dev: {
    env: require('./dev.env'),
    port: process.env.PORT || 8080,
    autoOpenBrowser: true,
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {
      '/api': {
        target: 'http://yiinb.com', //设置调用接口域名和端口号别忘了加http
        changeOrigin: true,
        pathRewrite: {
          '^/api': '/' //这里理解成用‘/api’代替target里面的地址,组件中我们调接口时直接用api代替
          // 比如我要调用'http://yiinb.com/login.php',直接写‘/api/login.php’即可
        }
      }
    }

这样配置好之后我们就可以正常的使用get或post请求了,不用担心跨域问题

mounted(){
//    this.$http.post('/api/login.php',"").then((res)=>{
//        console.log(res)
//    })
      this.$http({
        method: 'post',
        url: '/api/login.php',
        data: {username: 'Fred'}
      }).then((res)=>{
          console.log(res)
      })
    }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 有了我们家竞竞后, 几乎变成了全职妈妈。 昨晚上竞竞爸爸说, 妈妈早点睡, 晚上由爸爸带。 然后最终结果是: 竞竞...
    玉妖阅读 166评论 0 0
  • 广元到西安,足足开了六个多小时,本来还打算成都直接到西安,这是不想要命的节奏。 在西安的堂弟在曲江高速路口等我,结...
    天蝎C加加阅读 486评论 0 2