配置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. jQuery组件封装之return this.each(function () {});

    记录一下自己的调试历程 组件封装经常看到这么一段代码 $.fn.plugin = function (options) { return this.each(function (i,t) { new ...

  2. CAD二次开发之入门坑

    如果没有引用第一个dll,则会报未找到引用CommandMethod

  3. MVC方式显示数据(数据库)

    新建实体数据模型 选择ADO.NET实体数据模型,名称改为数据库名 因为使用现有数据库,所以选择来自数据库的EF设计器,只演示所以只选择一个表,空模型可后期增加表 选择从数据库更新模型 新建数据库连接 ...

  4. Django drf:分页器详解

    一.简单分页(查看第n页,每页显示N条) 二.偏移分页(在第n个位置,向后查看n条数据) 三.CursorPagination(加密分页,只能看上一页和下一页,速度快) 一.简单分页(查看第n页,每页 ...

  5. python网络爬虫第三弹(<爬取get请求的页面数据>)

    一.urllib库 urllib是python自带的一个用于爬虫的库,其主要作用就是通过代码模拟浏览器发送请求,其常被用到的子模块在 python3中的为urllib.request 和 urllib ...

  6. Vue 将一个组件嵌入到另一个组件中

    https://github.com/JasmineQian/Vue_Sample App.vue是所有组件的 要嵌入到App.vue组件中, 在script处导入 import xxx  from ...

  7. web开发原生开发混合开发的区别优势

    最近有人在讨论是原生开发好还是,混合开发好,以下是引用了数据来说: 最近原生应用.Web应用.混合应用的名字让我们听得比较熟悉了,现在我们就通过评析各种应用的优缺点来更进一步看看这三者的区别. 一.原 ...

  8. 使用IDEA快速搭建基于Maven的SpringBoot项目(集成使用Redis)

    迫于好久没写博客心慌慌,随便写个简单版的笔记便于查阅. 新建项目 新建项目 然后起名 继续next netx finish. 首先附上demo的项目结构图 配置pom.xml <?xml ver ...

  9. MySql忘记密码了咋办

    对内 忘记密码终端修改操作: #停止mysql服务 sudo /opt/lampp/lampp stopmysql #参数启动mysqld sudo /opt/lampp/sbin/mysqld -- ...

  10. LOJ2265. 「CTSC2017」最长上升子序列

    题意:中文题意很清楚 LOJ2263 分析: 根据Dilworth定理,最小链覆盖=最长反链. 问题转化为求 $k$ 个最小不上升序列能覆盖的最大数的个数. 参考链接: 1. https://blog ...