配置axios在vue-cli中的使用:

  在main.js中配置

  

import axios from "axios"

Vue.config.productionTip = false
Vue.prototype.$axios = axios
axios.defaults.baseURL = "/api"
// axios.defaults.timeout = 1000

在vue.config.js文件中

devServer: {
// port: 8081,
proxy: {
'/api': {
target: 'http://localhost:8080/api',
changeOrigin: true,
ws: true,
pathRewrite: {
'^/api': ''
}
}
},
},

目的:

  实现代理(跨域)请求后端数据

出现情况:

  只是通过url可以拿到数据,但是在network中没有返回值,在控制台上出现下面的错误

Error: timeout of 1000ms exceeded
at createError (webpack-internal:///./node_modules/axios/lib/core/createError.js:16:15)
at XMLHttpRequest.handleTimeout (webpack-internal:///./node_modules/axios/lib/adapters/xhr.js:89:14)

原因:

axios.defaults.timeout = 1000

这是设置了axios请求不能超过一秒,但是在这个项目中请求的时间超过了设置的timeout,所以出现了上面的问题

使用axios请求的坑的更多相关文章

  1. 解决在vue中axios请求超时的问题

    查看更多精彩内容请访问我的新博客:https://www.cssge.com/ 自从使用Vue2之后,就使用官方推荐的axios的插件来调用API,在使用过程中,如果服务器或者网络不稳定掉包了, 你们 ...

  2. vue脚手架用axios请求本地数据

    首先需要声明的是:本地请求,不用考虑跨域问题,这适用刚入坑的前端小白看,小白在做自己的项目时,通常都是用自己写的json数据,之后用axios请求过来,渲染到页面上. 1.cnpm install a ...

  3. [转]axios请求超时,设置重新请求的完美解决方法

    自从使用Vue2之后,就使用官方推荐的axios的插件来调用API,在使用过程中,如果服务器或者网络不稳定掉包了, 你们该如何处理呢? 下面我给你们分享一下我的经历. 具体原因 最近公司在做一个项目, ...

  4. Vue框架axios请求(类似于ajax请求)

    Vue框架axios get请求(类似于ajax请求) 首先介绍下,这个axios请求最明显的地方,通过这个请求进行提交的时候页面不会刷新 <!DOCTYPE html> <html ...

  5. nodejs-5.2 axios请求

    1.npm官方文档:https://www.npmjs.com/package/axios 2.axios:用于 浏览器 和 node.js的基于Promise的HTTP客户端 请求 特征 从浏览器制 ...

  6. 10. vue axios 请求未完成时路由跳转报错问题

    axios 请求未完成时路由跳转报错问题 前两天项目基本功能算是完成了,在公司测试时遇到了遇到了一个问题,那就是在请求未完成时进行路由跳转时会报错,想了几种办法来解决,例如加loading,请求拦截, ...

  7. axios请求本地的json文件在打包部署到子目录域名下,路径找不到

    前言: 因为要同时部署两个项目,有一个是部署到域名下面的子目录下,如:https://xxx.com/siot-admin vue 项目中使用axios请求了本地项目的static文件夹下的json文 ...

  8. 记录一次axios请求造成的数组初始化失败

    axios请求是一个异步的请求,简单来讲就是在做其他事情的时候可以把这个先放一边等其他的事情做完后再来做这件事件. 我之前这样调用了一个方法: mounted() { this.first() thi ...

  9. token回话保持,axios请求拦截和导航守卫以及token过期处理

    1:了解token:有时候大家又说token令牌.整个机制是前端第一次登陆发送请求,后端会根据前端的用户名和密码, 通过一些列的算法的到一个token令牌, 这个令牌是独一无二的,前端每次发送请求都需 ...

随机推荐

  1. metronic-v4.6 使用经验

    1.弹框居中显示 上下居中 需要上下居中引用  bootstrap-modalmanager.js 左右居中 修改 bootstrap-modal.js 中 this.$element.css('ma ...

  2. Python练习_数据类型_day5

    1. 1.作业 1,有如下变量(tu是个元祖),请实现要求的功能 tu = ("alex", [11, 22, {"k1": 'v1', "k2&qu ...

  3. Win10安装PyQt5与Qt Designer

    1.直接在cmd中通过pip安装PyQt5 1 pip install pyqt5 会自动下载PyQt5以及sip并安装,因为PyQt5不再提供Qt Designer等工具,所以需要再安装pyqt5- ...

  4. form表单详解

    form表单 form是一个复杂的系统标签,其内部又可包含很多的一些输入标签 例如input 输入文本标签  checkbox 多选标签等等 form表单有几个属性我们需要注意一下 1:action属 ...

  5. php获取客户机mac地址

    @exec("arp -a",$array); //执行arp -a命令,结果放到数组$array中 foreach($array as $value){ //匹配结果放到数组$m ...

  6. friend

    #include <iostream> using namespace std; //friend 友元,效率的问题 //get 方法和set方法,是标准封装的结果,friend破坏了这种 ...

  7. Missing Push Notification Entitlement解决方法

    原委 最近提交APP到Apple Store审核,结果很快就收到Apple很"贴心"的邮件.原文如下: Dear developer, We have discovered one ...

  8. 【vue开发】vue指令Vue.directive使用教程

    1.指令的注册 指令跟组件一样需要注册才能使用,同样有两种方式,一种是全局注册: ? 1 2 3 4 5 Vue.directive('dirName',function(){   //定义指令   ...

  9. Axure流程图

    什么是流程图 一个流程图可用于展示各种各样的处理流程,包括用例流程.商业流程.页面流程等.在Axure中,流程图常用于提供一个高保真的.能通过所设计的页面来完成的任务视图.一张简明的流程图,能促进和其 ...

  10. JavaFX WebView and WebEngine Tutorial教程

    JavaFX WebView JavaFX WebView is a mini browser that is called as an embedded browser in JavaFX appl ...