vue-cli怎样做出跨域请求

这次给大家带来vue-cli怎样做出跨域请求,vue-cli做出跨域请求的注意事项有哪些,下面就是实战案例,一起来看一下。

前端开发时,请求后台接口经常需要跨域,vue-cli实现跨域请求只需要打开config/index.js,修改如下内容即可。

//例如要请求的接口url为http://172.3.2.1:8000/look/1module.exports = {  dev:{    proxyTable:{      '/api':{        target: 'http://172.3.2.1:8000',        changeOrigin: true,        pathRewrite: {         '^/api': ''        }      }    }  }}

登录后复制

 这时在你想请求接口的url处,输入/api/look/1 即可实现跨域请求。

这时如果打开F12会发现请求的url是localhost:8080/api/look/1,这其实是虚拟从本地请求数据,这样就不会有跨域的问题产生了。

一般情况下上面的方法是没有问题的,要是上面的方法行不通,可以试试这样写:

//例如要请求的接口url为http://172.3.2.1:8000/look/1module.exports = {  dev:{    proxyTable:{      '/look':{        target: 'http://172.3.2.1:8000',        changeOrigin: true,        pathRewrite: {         '^/look': '/look'        }      }    }  }}

登录后复制

这时在你想请求接口的url处,输入/look/1 即可实现跨域请求。

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

JS动态操作HTML标记

使用JS操作input文本框内容

以上就是vue-cli怎样做出跨域请求的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2765882.html

(0)
上一篇 2025年3月8日 11:04:18
下一篇 2025年3月8日 11:05:07

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • vue-cli 3.0使用详解

    这次给大家带来vue-cli 3.0使用详解,vue-cli 3.0使用的注意事项有哪些,下面就是实战案例,一起来看一下。 环境安装 全新版本的脚手架、逼格非常高、 记住这个名字 @vue/cli ,对就是这个 你npm 或者yarn 安装…

    2025年3月8日 编程技术
    400
  • vue-cli里使用node服务器跨域步骤详解

    这次给大家带来vue-cli里使用node服务器跨域步骤详解,vue-cli里使用node服务器跨域的注意事项有哪些,下面就是实战案例,一起来看一下。 背景 我们都知道浏览器有一个既核心也最基本的安全功能,即同源策略。同源分别是:协议,域名…

    2025年3月8日
    400
  • vue+axios做出登录请求拦截

    这次给大家带来vue+axios做出登录请求拦截,vue+axios做出登录请求拦截的注意事项有哪些,下面就是实战案例,一起来看一下。 当我们在做接口请求时,比如判断登录超时时候,通常是接口返回一个特定的错误码,那如果我们每个接口都去判断一…

    编程技术 2025年3月8日
    200
  • 怎样快速解决vue axios请求超时

    这次给大家带来怎样快速解决vue axios请求超时,解决vue axios请求超时的注意事项有哪些,下面就是实战案例,一起来看一下。 具体原因 最近公司在做一个项目, 服务端数据接口用的是Php输出的API, 有时候在调用的过程中会失败,…

    2025年3月8日 编程技术
    200
  • vue减少对服务器请求次数

    这次给大家带来vue减少对服务器请求次数,vue减少对服务器请求次数的注意事项有哪些,下面就是实战案例,一起来看一下。 VUE2.0中提供了一个keep-alive方法,可以用来缓存组件,避免多次加载相应的组件,减少性能的消耗。比如, 一个…

    编程技术 2025年3月8日
    200
  • vue-cli有哪些方式缩短首屏加载时间

    这次给大家带来vue-cli有哪些方式缩短首屏加载时间,vue-cli有哪些方式缩短首屏加载时间的注意事项有哪些,下面就是实战案例,一起来看一下。 最近实习的项目需求上要求不多,就学了下项目优化,主要是首屏加载太慢。 大文件定位 我们可以使…

    编程技术 2025年3月8日
    200
  • Postman怎样模拟发送请求

    这次给大家带来Postman怎样模拟发送请求,Postman模拟发送请求的注意事项有哪些,下面就是实战案例,一起来看一下。 Postman模拟发送带token的请求方法 1)google浏览器中安装扩展程序Interceptor 2)Pos…

    2025年3月8日
    200
  • axios怎样操作数据请求方式及跨域处理

    这次给大家带来axios怎样操作数据请求方式及跨域处理,axios操作数据请求方式及跨域处理的注意事项有哪些,下面就是实战案例,一起来看一下。 安装axios cnpm install axios –save 登录后复制 在要使用axio…

    编程技术 2025年3月8日
    200
  • vue-cli配置文件步骤详解

    本文章适合初学者学习,如有错请提出。近期对vue比较感兴趣,所以准备用vue写一个blog。早期先对vue脚手架了解一下,对于新手官网建议先不用vue-cli,但我觉得如果没有任何的依据凭自己写一个项目(包括webpack的配置等)这无疑是…

    2025年3月8日
    200
  • JS怎样操作红黑树

    这次给大家带来JS怎样操作红黑树,JS操作红黑树的注意事项有哪些,下面就是实战案例,一起来看一下。 红黑树的性质 一棵满足以下性质的二叉搜索树是一棵红黑树 每个结点或是黑色或是红色。 根结点是黑色的。 每个叶结点(NIL)是黑色的。 如果一…

    2025年3月8日 编程技术
    200

发表回复

登录后才能评论