可能是最简单的解决本地开发接口请求跨域问题的方案

最新推荐文章于 2024-07-25 14:14:08 发布
最新推荐文章于 2024-07-25 14:14:08 发布
阅读量1.6w 收藏 8
点赞数 4
分类专栏： 工具 文章标签： 跨域
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xyrshc/article/details/82876021
版权

这个问题出现的原因，很多时候是我们在本地起的 localhost 服务下，访问一些线上或者日常接口下出现的跨域提示。

跨域是由于浏览器安全策略，是正常的。

网上有很多方案，大部分都是需要做 Nginx 的反向代理来中转的，这种会有非常多的问题，而且过程复杂，浪费时间。

推荐的解决方案

安装一个 Chrome 插件，https://github.com/yize/xswitch。

比如我们想要让 reactjs.org 能够跨域访问 baidu.com 下的资源，那么只需要按下图配置下即可。

然后就 OK 了，并且只会影响到你本地。想关闭的话，注释掉就好了。

插件下载地址

https://github.com/yize/xswitch

 

九神九神
关注
专栏目录
本地开发接口并调试的跨域问题
christyleylh的博客
06-06 7990
由于后端接口与前端布置的服务器地址和端口的不一致，都会导致跨域不允许。类似于下图这种，动后端代码和前端代码（type：jsonp等）都可以，但是我们不这么做，这时候我们可以采用nginx来解决跨域问题，原理大致是：通过nginx配置一个代理服务器做跳板机，反向代理后端接口第一步：先配置nginx.config，直接贴代码server { listen 8000; ...
AJAX请求及解决跨域问题
m0_54853420的博客
09-09 885
AJAX其实就是异步的js和xml通过ajax可以在浏览器中发送异步请求。最大优势：无刷新获取数据优点：1.可以无需刷新页面与服务器进行通信2.允许根据用户事件更新部分页面内容当然也存在其缺点问题：比如跨域问题等！深知大多数初中级Java工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但对于培训机构动则近万的学费，着实压力不小。自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！因此收集整理了一份《Java开发全套学习资料。
接口调用的跨域问题
weixin_33963594的博客
03-18 551
本次参考: https://www.jianshu.com/p/2e93f14e1807 详细: https://blog.csdn.net/wxb880114/article/details/80606434 package com.tansuo365.test1.config; import org.springframework.context.annotation.Bean; impo...
为什么127.0.0.1和localhost之间算跨域？
longlongqin的博客
07-01 1407
跨域问题是指在浏览器中，当一个网页向不同域名、不同端口或不同协议的资源发起请求时，会受到限制。这是由浏览器的**同源策略（Same-Origin Policy）**所导致的安全限制。同源策略规定，浏览器允许页面中加载的脚本只与其来源相同的资源进行交互，包括协议（http或https）、主机/域名（domain）、端口（port）。同源策略的主要目的是保护用户的隐私和安全，防止恶意网站通过脚本获取用户的敏感信息或执行恶意操作。
本地html画面ajax请求url 报跨域错误
emmmmmm的博客
04-13 3753
1.报错原因（本地文件跨域访问问题https://blog.csdn.net/sjohnny/article/details/70256172）方案一：src/main/java/com.project.xxx/configCorsConfig.javapackage com.project.xxx.config;import org.springframework.context.annotat...
使用nginx解决本地环境访问线上接口跨域问题
最新发布
SilenceJude的博客
07-25 1198
前端项目开发过程中，经常会遇到各种各样的跨域问题。虽然大部分时候，由脚手架自带的proxy功能即可解决问题，如webpack，vite等；但是若没有通过脚手架搭建项目，或者必须使用某些特殊规则转发时，使用nginx则能够轻松解决问题。
localhost跨域问题解决
m0_56308072的博客
05-22 2786
同源策略：为了保证浏览器的安全，不同源的客户端脚本在没有明确授权的情况下，不能去读写对方的资源所谓同源就是指两个页面有相同的协议，主机和端口号，一旦其中有一个不一样，就是不同源，此时无法读取非同源网页的Cookie，当然也就无法发送axios请求。
SpringBoot解决跨域问题的六种方式
m0_61083409的博客
07-29 324
错误原因2.4.0之后如果写。
跨域问题产生的原因以及十种解决方案
LYFlied的博客
04-12 8208
一、什么是跨域？ 同源策略：协议+域名+端口 三、解决方案 1.JSONP跨域 2.跨域资源共享（CORS） 简单请求 CORS跨域示例 3.nginx代理跨域 nginx配置解决iconfont跨域 nginx反向代理接口跨域 4.nodejs中间件代理跨域 5.document.domain + iframe跨域 6.location.hash + iframe跨域 7.window.name + iframe跨域 8.postMessage跨域 9.WebSocket协议跨域 10.浏览器开启跨域
新版vue-cli模板下本地开发环境使用node服务器跨域的方法
08-27
在新版Vue-cli模板下，本地开发环境中使用Node服务器跨域是一种常见的解决方案。为了解决浏览器的同源策略限制，本文将为大家介绍一种使用Node服务器跨域的方法。 一、浏览器的同源策略 浏览器有一个核心安全功能...
Vue动态加载图片在跨域时无法显示的问题及解决方法
10-15
为了解决这一问题，我们可以采用配置代理的方法，只对需要访问后端接口的请求进行转发，而其他资源请求则直接从本地加载。具体做法是在vue-cli3的项目配置文件vue.config.js中修改devServer的proxy配置。通过在请求...
前端本地调试出现跨域
zgz15515397650的博客
11-05 2228
前端本地调试出现跨域，但是测试环境正常 1.问题 前端本地使用Safair浏览器请求后端测试环境调试，出现跨域问题。 前端请求的header。 Accept: application/json, text/plain, */* Origin: http://192.168.14.248:10086 Referer: http://192.168.14.248:10086/ User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWeb
跨域问题的三种解决办法
编程就像打游戏，编出一个项目就打过了一个BOSS
02-19 2848
项目常见的跨域问题
跨域问题：学习把从GitHub上面拉下的项目跑起来
qq_33991272的博客
09-05 1609
背景：最近有个叫人生重开模拟器的网页游戏火起来了，发现挺有意思，重要的是它还被作者开源了，然后我就想去GitHub上把它拷贝下来跑一下，顺便还能学一下他们怎么写的代码以及后续自己可以进行diy 遇到的问题：找到index.html并且打开，然后出现了报错 解决过程： 根据报错信息，以为是发送请求的方式不对，但是因为还不了解fetch这个api，去百度和谷歌也没找到好的解决方法，就在GitHub上面发起了提问，然后有个热血网友回复了： 可惜，网络请求这方面的内容比较薄弱，看了回复也不怎么怎么改。然后去请
【GitHub案例】axios请求跨域问题——组件间的通信：全局事件总线的实施+工程化的显示
阿牛哥的博客
06-06 463
【GitHub案例】axios请求跨域问题——组件间的通信：全局事件总线的实施+工程化的显示
9种常见的前端跨域解决方案（详解）
热门推荐
zh0623的博客
03-25 2万+
文章转载自：9种常见的前端跨域解决方案（详解）_慕课手记 (imooc.com) 一、什么是跨域？   在前端领域中，跨域是指浏览器允许向服务器发送跨域请求，从而克服Ajax只能同源使用的限制。 什么是同源策略？   同源策略是一种约定，由Netscape公司1995年引入浏览器，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同，即便两个不同的域名指向同一个ip地址，也非同源。   同源策略限
解决跨域的三种方案
m0_70477767的博客
05-03 5028
解决跨域的三种方案 到目前为止，我们编写的 GET 和 POST 接口，存在一个很严重的问题：不支持跨域请求 解决接口跨域问题的方案主要有三种 CORS (主流的解决方案，推荐使用) 反向代理 (推荐使用) JSONP (有缺陷的解决方案：只支持 GET 请求) 3.代码演示 <!DOCTYPE html> <html lang="en"> ​ <head> <meta charset="UTF-8"> .
跨域问题（三种解决方法）
weixin_47414034的博客
12-31 5608
两个请求的协议（比如http），域名（比如说localhost或者192.168.0.0），端口号三者一模一样（其他可以不一样）才算两个请求在同一个域内，三者但凡有一个不一样都是跨域。跨域就是一个域名的网页去请求另一个域名的资源，比如你刚刚在A网站输入了自己的账号密码，然后访问B网站，B网站无法获取账号密码。比如现在前端工程想要访问后端工程中的list方法，只需要在这个方法上面添加@CrossOrigin注解即可。其实后端是有接收到请求，也给前端工程返回了数据，但是浏览器收到之后拒绝前端读取响应数据。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值