记录一下跨域的问题,讲讲跨域

news/2024/11/16 20:45:34 标签: 前端

一、为什么有跨域

跨域问题本质上是由于浏览器的同源策略(Same Origin Policy)引起的。这个策略是为了增强网页的安全性,防止恶意网站获取用户的敏感信息。也就是说经过浏览器的才有跨域,在前端代码中进行数据请求的时候往往都要注意跨域的问题,而这个问题在后端是不存在,后端可以调用另外一个后端的接口。

二、怎么样算跨域

浏览器的同源策略指出URL 中的协议、域名和端口号必须完全相同
也就是http跟https,哪怕域名端口号相同都是不同的。
举例:
http://127.0.0.1:8080
https://127.0.0.1:8080
http://127.0.0.1:8081
http://127.0.0.1:8082
都属于跨域。

三、前端跨域的作用

前端(浏览器端)请求跨域限制的原因主要是为了保护用户的安全。 当您在浏览器中访问一个网站(例如 https://example.com)时,该网站的 JavaScript 代码可以尝试访问其他源(例如 https://anotherdomain.com)的资源。如果没有限制,一个恶意网站可能会通过 JavaScript 获取另一网站用户的敏感数据,比如 cookies、账户信息等。

四、为什么后端请求没有跨域

1.环境不同:后端应用服务器(例如 Node.js、Java EE、Django 等)并不受同源策略的限制。后端服务可以自由地向其他域发起 HTTP 请求,而不会受到浏览器的安全机制阻止。
2.信任模型:后端代码通常运行在可信的环境中,不会直接暴露给用户,因此可以更自由地访问外部 API。
3.业务逻辑设计:后端通常需要与多个服务通信(例如数据库、第三方 API 服务等),这方面的限制较少,因此允许跨域请求。

五、如何解决前端跨域问题

1.CORS(跨源资源共享):后端服务器可以通过设置 CORS 头部来允许特定来源的请求。例如,后端可以在响应头中包含:
Access-Control-Allow-Origin: *
这是很常见的做法,让前端无需再代理直接访问后端

2.JSONP:该方法已经不推荐使用,通过动态添加

3.代理服务器:在开发环境中,可以配置代理,将前端请求的路径代理到后端服务器,从而避免跨域问题。
也是一种常见的做法,通过代理,规避这个问题,如在react中可以使用http-proxy-middleware

  • WebSocket:WebSocket 的连接不受同源策略的限制,因此可以用于实现跨域通信。

http://www.niftyadmin.cn/n/5754602.html

相关文章

高防服务器的费用受到哪些原因影响?

在如今的互联网社会中,越来越多的企业都开始了线上网络业务的发展,网络安全也日益受到了重视,高防服务器成为了众多企业的首要选择,不仅可以帮助企业有效抵御各种网络攻击,保证网站和应用的稳定性。 但是高防服务器与其…

ES6更新的内容中什么是proxy

Proxy 是 ES6(ECMAScript 2015)中引入的一个新的内置对象,用于定义某些操作的自定义行为(如属性查找、赋值、枚举、函数调用等)。Proxy 可以被看作是一个拦截器,它拦截并自定义对象上的基本操作。通过创建一…

将 HTML 转换为 JSX:JSX 和 JSX 规则

JSX 是 JavaScript 的语法扩展。您可以在 JavaScript 文件中编写 HTML 格式。 它基于 Web、Html、Css 和 JavaScript。Web 开发人员将页面内容分别编写为 Html 文件,将设计编写为 Css 文件,将逻辑编写为 JavaScript 文件。 须知 : JSX 是一个…

嵌入式学习-C嘎嘎-Day04

嵌入式学习-C嘎嘎-Day04 1. 模(m)板 1.1 函数模板 1.2 类模板 2. 容器 2.1 相关概念 2.2 容器分类 2.2.1 顺序容器 2.2.1.1 array 数组 2.2.1.2 vector 向量 2.2.1.3 list 列表 2.2.1.4 deque 队列 2.2.2 关联容器 2.3 迭代器 iterator 1. 模&#xff08…

前端怎么获取视口大小

方式一:使用 window.innerWidth 和 window.innerHeight 这两个属性分别返回浏览器窗口的视口宽度和高度(单位为像素),包括滚动条占用的空间(如果有的话)。 例如: const viewportWidth window.…

模态融合技术在多模态大模型中的应用研究

随着人工智能技术的快速发展,多模态大模型成为了研究的热点。模态融合技术作为多模态大模型的核心,它允许模型处理和理解来自不同模态(如文本、图像、音频)的数据。本文旨在探讨模态融合技术的原理、方法、挑战及其在多模态大模型…

MySQL时间字段TIMESTAMP和DATETIME

SELECT global.time_zone, session.time_zone;查询数据库的全局时区和当前会话的时区信息,一般如果使用navicat进行连接,没有显示指定时区信息,会默认使用system_time_zone。 可以使用 SET time_zone 08:00; SELECT global.time_zone, sess…

Cpolar 内网穿透使用

Cpolar登录地址:cpolar - secure introspectable tunnels to localhost 使用固定公网TCP连接ssh ssh -p端口号 用户名公网地址