vue调用公开接口出现跨域解决办法

最新推荐文章于 2024-05-23 11:08:14 发布
最新推荐文章于 2024-05-23 11:08:14 发布
阅读量3.3k 收藏 2
点赞数 1
分类专栏： javascript 文章标签： 跨域代理请求 vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/liang1169/article/details/102563098
版权
vue调用公开接口出现跨域解决办法1、直接跨域请求代理最近做vue项目心血来潮，想做一个自己的个人网站，其中就有调用一些网上的免费接口，但是总是出现跨域的问题，尝试过部署到阿里云服务器也不行。直到试了下跨域请求代理，就可以了。不多说，看下图。1、直接跨域请求代理打开vue项目结构下的config/index.js,增加proxyTable内容：module.exports = { de...
摘要由CSDN通过智能技术生成

vue调用公开接口出现跨域解决办法


最近做vue项目心血来潮，想做一个自己的个人网站，其中就有调用一些网上的免费接口，但是总是出现跨域的问题，尝试过部署到阿里云服务器也不行。直到试了下跨域请求代理，就可以了。不多说，看下图。

1、直接跨域请求代理

打开vue项目结构下的config/index.js,增加proxyTable内容：


module.exports = {
   
 dev: {
   
   // Paths
   assetsSubDirectory: 'static',
   assetsPublicPath: '/',
   proxyTable: {
   
     <
最低0.47元/天 解锁文章
小梁三三三
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
解决Vue调用springboot接口403跨域问题
10-16
主要介绍了解决Vue调用springboot接口403跨域问题,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
详解Vue-cli代理解决跨域问题
01-19
使用vue-cli调接口的时候，总是会出现垮与问题，因为vue的localhost与访问域名不一致导致。而这一点，开发者显然也想到了，故而在vuejs-templates，也就是vue-cli的使用的模板插件里，有关于API proxy的说明，这个...
史上最全最实用网站来袭
热门推荐
zjf1665119803的博客
03-24 2万+
1、Windows、Office等微软原版镜像下载：https://msdn.itellyou.cn/ 2、V2EX：科技宅/程序员，新奇想法聚集地：https://www.v2ex.com/ 3：计算机书籍控：汇总各类编程语言的pdf书籍下载： http://bestcbooks.com/ 4：最新版迅雷发布站：http://yangtai.xunlei.com/ 5、有趣网址之家：汇...
Jwt
xiaoyi215的博客
10-11 141
Jwt 1. JWT是什么 JSON Web Token (JWT)，它是目前最流行的跨域身份验证解决方案 2. 为什么使用JWT JWT的精髓在于：“去中心化”，数据是保存在客户端的。 3. JWT的工作原理: 1. 是在服务器身份验证之后，将生成一个JSON对象并将其发送回用户，示例如下： {"UserName": "Chongchong","Role": "Admin","Ex...
Vue3项目使用axios调用后端接口解决跨域且部署服务器nginx相关跨域配置
最新发布
李长渊的博客
05-23 1092
Vue3项目使用axios调用后端接口解决跨域且部署服务器nginx相关跨域配置
vue项目如何解决跨域问题
shi15926lei的博客
11-08 4057
vue项目跨域解决方案
php+public+路径,publicPath路径问题及解决方法实例
weixin_42515448的博客
03-18 479
这篇文章主要给大家介绍了webpack学习教程之publicPath路径问题的相关资料，文中通过示例代码介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面来一起看看吧。本文主要给大家介绍了关于webpack中publicPath路径问题的相关内容，分享出来供大家参考学习，下面来看看详细的介绍：output: {filename: "[name].js",path:path.resolv...
前端解决接口跨域的方法
Something的博客
03-27 5069
跨域产生的原因：浏览器受到同源策略的限制，在不同域名、不同端口、不同协议等情况下不允许资源共享。 解决跨域的方法： （1）jsonp 通常为了减轻web服务器的负载，我们把js、css，img等静态资源分离到另一台独立域名的服务器上，在html页面中再通过相应的标签从不同域名下加载静态资源，而被浏览器允许，基于此原理，我们可以通过动态创建script，再请求一个带参网址实现跨域通信。 缺点...
vue proxyTable 接口跨域请求调试的示例
12-12
VUE解决通过proxyTable: 在 config/index.js 配置文件中 dev: { env: require('./dev.env'), port: 8080, autoOpenBrowser: true, assetsSubDirectory: 'static', assetsPublicPath: '/', //proxyTable: {},...
Vue proxyTable配置多个接口地址,解决跨域的问题
10-14
主要介绍了Vue proxyTable配置多个接口地址,解决跨域的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
微信小程序开发文章详情页面
weixin_45499080的博客
10-14 2336
微信小程序文章页面 具体代码在git上，欢迎下载分享。 git:https://github.com/gitqin8170/wechat_applet_article
【Vue3+TS】Axios拦截器封装及跨域 [cors] 解决方案
黑夜中的潜行者
11-19 3481
跨域问题弄明白了还是很容易解决的，一般来说，只需要在一端解决跨域即可，并且一般建议使用后端跨域解决方案。后面会单独出一篇后端跨域的多种解决方案和各种方案的适用范围以及如何选择最佳方案。
接口的跨域问题
m0_52810430的博客
04-22 6526
接口的跨域问题 1.解决接口跨域问题的方案主要有两种： ​ ① CORS（主流的解决方案，推荐使用） ​ ② JSONP（有缺陷的解决方案：只支持 GET 请求） 2.使用 cors 中间件解决跨域问题的步骤： ​ cors 是 Express 的一个第三方中间件。通过安装和配置 cors 中间件，可以很方便地解决跨域问题。 ​ 使用步骤分为如下 3 步： ​ ①运行 npm install cors 安装中间件 ​
接口被第三方调用出现跨域问题如何处理
asdhls的博客
12-09 7771
1 跨域原因：浏览器同源策略         跨域指的是浏览器不能执行其它网站的脚本，它是由浏览器的同源策略造成的，是浏览器对JavaScript 施加的安全限制。出于浏览器安全考虑，防止其他人恶意攻击，获取浏览器上的信息。         同源策略它是由 Netscape 提出的一个安全策略，它是浏览器最核心也是最基本的安全功能，如果缺少同源策略，
关于vue调用接口时产生的跨域问题
weixin_54599299的博客
05-24 6706
在vue项目中，我们会遇到很多调用接口的场景，但是很多小白不知道怎样去处理，今天我们来简单的讲一下这个事情(作为一个小白选手，我也曾被这个简单的问题困扰许久所以想写个帖子作为记录，如果有哪里写的不对的地方请指正)： 什么是跨域 跨域，是源与浏览器的一个同源策略，简单说就是访问的页面域名是 www.a.com，而在此页面中请求接口，请求的是 www.b.com 的接口，出于安全考虑，浏览器默认不允许这样做，便会报错，提示跨域。 当然，如果访问的页面和页面中请求的接口都在一个域名下，就解决跨域了。 解决跨域的方
跨域请求的API接口
追梦
10-22 1万+
跨域 搜索引擎接口 1.谷歌（Google） http://suggestqueries.google.com/complete/search?client=youtube&q=#content#&jsonp=window.google.ac.h callback：window.google.ac.h window.google.ac.h([“关键字”,[[“关键字”,0],[“...
前端解决 API 跨域的几种方式
river、的博客
11-16 4199
文章目录使用 webpack 配置代理使用 http-server 模块进行代理使用 nodejs 的 node-http-proxy 模块来处理使用 nginx 配置 使用 webpack 配置代理 webpack 对于前端来说是个强大的工具, 除了能够帮助你打包和启动调试服务器外, 代理的功能也值得你了解下 中文文档地址 webpack 印记中国 最简单的配置 module.exports =...
vue proxyTable 接口跨域请求调试
weixin_34194087的博客
04-10 167
在不同域之间访问是比较常见，在本地调试访问远程服务器。。。。这就是有域问题。 VUE解决通过proxyTable: 在 config/index.js 配置文件中 dev: { env: require('./dev.env'), port: 8080, autoOpenBrowser: true, assetsSubDirectory: ...
阿里云ECS服务器 跨域Access-Control-Allow-Origin 问题
清流弯弯
04-25 1073
目录 现象： 解决： 1、连接FTP 2、默认网站配置路径 3、自定义配置路径处修改 4、如果FTP方式无权限，就得使用VIM方式编辑 现象： 本地网页，使用JS.load 加载阿里云ECS 资源时，出现跨域问题 $("#youshengHeader").load('http://gudianxiaoshuo.com/js/youshengHeader.html ',function(){}); 解决： 1、连接FTP 2、默认网站配置路径
vue调用外部接口双跨域
05-25
如果你的Vue应用需要调用一个不同域名下的外部接口，那么你需要处理跨域请求。双跨域即涉及到Vue应用和外部接口都存在跨域问题。 解决这个问题的方法有很多种，以下是其中一些常用的方法： 1. 使用代理 Vue CLI...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值