跨域 同源策略通俗讲解

什么是跨域

字面理解,前后端不"同源",这就发生了跨域

怎么区分不同的域

域的组成:协议+域名+端口

同源策略:浏览器的一种安全机制。目的是保证限制前端请求的读取能力,防止恶意网站随意对我们浏览器数据进行读取,造成数据泄露


跨域问题的解决方案:

CORS跨域资源共享

当一个请求发送跨域时,浏览器会给这个请求的请求头加上origin,确定请求来源,相当于自报家门。

后端处理到这个请求时 设置一些字段返回响应

浏览器处理到这个响应时

通过Access-Control-Allow_origin 判断哪些请求源可以访问

通过Access-Control-Allow_Methods 判断哪些请求方法可以访问

通过Access-Control-Allow_Headers 判断哪些请求头可以访问

缺点:

1 需要后端配合

2 非简单请求会导致预检请求,额外发送一次HTTP请求

相关推荐
java1234_小锋4 分钟前
Java高频面试题:Spring-AOP通知和执行顺序?
java·开发语言·spring
SuperEugene16 分钟前
Vue3 + Element Plus 表格实战:批量操作、行内编辑、跨页选中逻辑统一|表单与表格规范篇
开发语言·前端·javascript
SmartBrain32 分钟前
Spring Boot的高性能技术栈的工程实践
spring boot·后端·架构
极梦网络无忧40 分钟前
基于 Vite + Vue3 的组件自动注册功能
前端·javascript·vue.js
AMoon丶1 小时前
Golang--内存管理
开发语言·后端·算法·缓存·golang·os
Predestination王瀞潞1 小时前
5.4.3 通信->WWW万维网内容访问标准(W3C):WWW(World Wide Web) 协议架构(分层)
前端·网络·网络协议·架构·www
爱学习的程序媛1 小时前
【Web前端】优化Core Web Vitals提升用户体验
前端·ui·web·ux·用户体验
zabr1 小时前
花了 100+ 篇笔记,我整理出 了一套 AI Agent 工程完全指南
前端·后端·agent
软弹1 小时前
深入理解 React Ref 机制:useRef 与 forwardRef 的协作原理
前端·javascript·react.js
神奇小汤圆1 小时前
Java面试题及答案整理(2026年金三银四最新版,持续更新)
后端