配置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. Vue框架axios请求(类似于ajax请求)

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

  4. nodejs-5.2 axios请求

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

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

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

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

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

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

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

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

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

  9. vue 路由拦截、axios请求拦截

    路由拦截 项目中,有些页面需要登录后才能进入,例如,在某页面A,用户在操作前需要先进入登录页(此时需要将上一页的地址(/survey/start)作为query存入login页面的地址中,如: htt ...

随机推荐

  1. android开发Preference的使用

    1  .Preference是androidSDK提供的一个基类从API1就开始有了,用于显示界面给用户. 2  .在使用Preference显示activity时,此activity需要继承Pref ...

  2. Java 的局部变量和成员变量

    在Java语言中没有全局变量  分析各种变量的作用域的最简单方法是以花括号为界, 1.在类体中定义的是成员变量,成员变量会被默认初始化 2.在方法中定义的是局部变量,局部变量不会被默认初始化

  3. yum添加网易和搜狐源

    先进入yum源配置目录 cd /etc/yum.repos.d 备份系统自带的yum源 mv CentOS-Base.repo CentOS-Base.repo.save 163的yum源: wget ...

  4. DEDECMS中,友情链接

    友情链接:dede:flink {dede:flink row='24' type='image' titlelen="24" typeid="0"} [fie ...

  5. android如何调用显示和隐藏系统默认的输入法(一)

    1.调用显示系统默认的输入法 方法一. InputMethodManager imm = (InputMethodManager) getSystemService(Context.INPUT_MET ...

  6. CCF201812-3 CIDR合并

    按题意模拟即可...主要CCF吞代码... #include<bits/stdc++.h> #define pb push_back #define mp make_pair #defin ...

  7. pytest的fixture和conftest

    解决问题:用例1需要先登录,用例2不需要登录,用例3需要先登录.很显然这就无法用setup和teardown来实现了,这个时候就可以自定义测试用例的预置条件,比setup灵活很多. 1.fixture ...

  8. CentOS 5.x上配置JBoss6.x步骤图解教程

    1.如何远程连接CentOS和文件上传下载 使用工具Xmanager下的Xbroswer 首先在Xbroswer下的Xshell下新建文件夹JavaPlatServer,新建一个Xshell Sess ...

  9. 【译】DTD - Entities

    原文:DTD - Entities 实体用于定义XML文档中特殊字符的快捷方式. 实体主要有四种类型: 内置实体(Built-in entities) 字符实体(Character entities) ...

  10. 【前端】display: box布局教程 [转]

    css display:box 新属性   一.display:box; 在元素上设置该属性,可使其子代排列在同一水平上,类似display:inline-block;. 二.可在其子代设置如下属性 ...