当前位置：首页 > news >正文

浏览器同源策略、跨域、跨域请求，服务器处理没、跨域解决方案

news 来源：原创 2025/5/9 11:55:04

目录

- 什么是同源策略
- 什么是跨域
- - 发生跨域时，服务器有没有接到请求并处理响应：（两种情况）
- 如何解决跨域

什么是同源策略

概念：
同源策略是浏览器的一种安全机制，用于防止恶意网站对用户的敏感数据进行未经授权的访问。它限制了从一个源加载的脚本对另一个源的资源进行访问。简单来说，同源策略规定只有当两个页面的协议、域名和端口都相同时，它们才属于同一个源，允许相互访问资源。

好处：

保护用户数据安全，不同源的脚本无法访问另一个源的Cookie、LocalStorage、SessionStorage
不同源的脚本无法读取或操作另一个源的Dom
跨源的XMLHttpRequest或Fetch请求会被浏览器阻止，除非目标服务器允许（使用CORS）

什么是跨域

当一个网页试图访问不同来源的资源（如API、图片、脚本、数据等），就会发生跨域，常说的跨域指的是ajax调用接口时的跨域，浏览器会根据同源策略来判断来源是否一致，如果不一致就认为是跨域请求。如果服务器没有做一些配置，那么跨域请求会失败。

发生跨域时，服务器有没有接到请求并处理响应：（两种情况）

简单请求：
1. 使用的方法是get、post时
2. http头部包含字段（Accept、 Accept-Language 、 Content-Language 、Content-Type（值仅限于 text/plain、multipart/form-data 或 application/x-www-form-urlencoded）

服务器会收到请求并处理该请求返回响应，如果服务器并没有设置跨域的响应头(如Access-Control-Allow-Origin)，浏览器会阻止前端代码访问响应数据，但服务器已经执行了请求逻辑

复杂请求：
1. put、delete等方法
2. 包含自定义的请求头（如 Authorization、X-Custom-Header）、Content-Type 的值是非简单值（如 application/json）

预检请求机制，在发送复杂请求之前，浏览器会自动发起一个OPTIONS预检请求。如果预检请求通过，浏览器会发送实际请求，如果预检失败，浏览器会直接阻止请求发送。

如何解决跨域

我们项目使用的是代理服务器解决跨域问题，跨域问题是存在于浏览器和服务器之间，服务器和服务器之间是不存在跨域问题的。

开发环境通过Vue配置代理服务器。在vue.config.js中添加devServer.proxy配置。将项目dev-api开头的请求转发到项目后台服务器上

module.exports = {devServer: {proxy: {// 代理 `/api` 开头的请求'/dev-api': {target: 'http://example.com', // 目标服务器地址},},},
};

生产环境是通过nginx配置反向代理，在nginx的conf配置文件中配置将prod-api开头的请求转发到项目后台服务器上。

location /prod-api  {proxy_pass https://heimahr-t.itheima.net;
}

使用CORS，服务器设置特定的http响应头，告诉浏览器哪些跨域请求是被允许的。

在服务器端添加以下响应头：
Access-Control-Allow-Origin: 指定允许访问的来源（如 https://example.com 或 *）。
Access-Control-Allow-Methods: 指定允许的请求方法（如 GET, POST, PUT, DELETE）。
Access-Control-Allow-Headers: 指定允许的自定义请求头（如 Content-Type, Authorization）。
Access-Control-Allow-Credentials: 是否允许携带 Cookies。

使用JSONP(仅支持get请求)

通过 <script> 标签加载数据，因为 <script> 不受同源策略限制。服务器返回的是 JavaScript 代码。

使用WebSocket

WebSocket 不受同源策略限制，可以用于双向跨域通信。需要服务器验证 Origin 确保安全。

相关文章：

浏览器同源策略、跨域、跨域请求，服务器处理没、跨域解决方案

目录什么是同源策略什么是跨域发生跨域时，服务器有没有接到请求并处理响应：（两种情况） 如何解决跨域什么是同源策略概念： 同源策略是浏览器的一种安全机制，用于防止恶意网站对用户的敏感数据进行未经授…...

编程日记 2025/5/9 11:55:04

深入理解网络安全等级保护：保障信息安全的关键策略与实践

随着信息技术的飞速发展，网络安全问题日益凸显。为了应对这一挑战，网络安全等级保护制度应运而生，旨在确保不同等级的信息和信息系统的安全。本文将探讨网络安全等级保护的基本概念、重要性及其实践方法。一、信息安全等级保护的基本概念 1…...

编程日记 2025/5/4 23:23:02

MySQL

InnoDB 引擎底层存储和缓存原理到目前为止，MySQL 对于我们来说还是一个黑盒，我们只负责使用客户端发送请求并等待服务器返回结果，表中的数据到底存到了哪里？以什么格式存放的？ MySQL 是以什么方式来访问的这些数据&…...

编程日记 2025/5/9 11:17:34

新书速览|循序渐进Node.js企业级开发实践

《循序渐进Node.js企业级开发实践》 1 本书内容《循序渐进Node.js企业级开发实践》结合作者多年一线开发实践，系统地介绍了Node.js技术栈及其在企业级开发中的应用。全书共分5部分，第1部分基础知识（第1～3章）&#xf…...

编程日记 2025/4/28 13:56:52

2024三掌柜赠书活动第三十五期：Redis 应用实例

目录前言 Redis操作都会，却不知道怎么用？ 关于《Redis 应用实例》编辑推荐内容简介作者简介图书目录《Redis 应用实例》全书速览拓展：Redis使用场景实例1：缓存应用场景描述实现方法具体代码示例实例2&a…...

编程日记 2025/5/5 2:14:28

Android 第三方框架：RxJava：源码分析：观察者模式

文章目录观察者模式RxJava中的观察者模式总结观察者模式 RxJava中的观察者模式以Observable、ObservableOnSubscribe、Observer为例 Observable是被观察者负责发射事件或数据 Observer是观察器负责对从被观察者中获取的数…...

编程日记 2025/5/8 22:24:49

开源模型应用落地-安全合规篇-用户输入价值观判断（四）

一、前言在深度合规功能中，对用户输入内容的价值观判断具有重要意义。这一功能不仅仅是对信息合法性和合规性的简单审核，更是对信息背后隐含的伦理道德和社会责任的深刻洞察。通过对价值观的判断，系统能够识别可能引发不当影响或冲突的内容，从而为用户提供更安全、更和谐的…...

编程日记 2025/5/9 11:03:20

【js逆向专题】13.jsvmp补环境篇一

目录一.了解jsvmp技术1. js虚拟机保护方案2.jsvmp实现原理3. 模拟jsvmp执行过程二.环境检测1. 什么是环境检测2.案例讲解三. 项目实战1. 案例11.逆向目标2. 项目分析1.补第一个referrer2. 调试技巧13. 调试技巧24. 补充sign5. 补 length6. 参数长短补充 3. 逆向结果 2. 案例…...

编程日记 2025/5/9 11:03:21

Java---每日小题

题目1-极大极小游戏给你一个下标从 0 开始的整数数组 nums ，其长度是 2 的幂。对 nums 执行下述算法： 设 n 等于 nums 的长度，如果 n 1 ，终止算法过程。否则，创建一个新的整数数组 newNums ，新数组长度…...

编程日记 2025/5/9 11:51:55

leetcode 23. 合并 K 个升序链表

给你一个链表数组，每个链表都已经按升序排列。输入：lists [[1,4,5],[1,3,4],[2,6]] 输出：[1,1,2,3,4,4,5,6] 解释：链表数组如下： [1->4->5,1->3->4,2->6 ] 将它们合并到一个有序链表中得到。 1->…...

编程日记 2025/5/9 11:05:25

Windows 小记 6 -- 为什么我的全局消息钩子卸载不掉？

Hook dll 在其消息循环中被卸载。强制它们进入消息循环有助于卸载它们。在 UnhookWindowsHookEx 之后添加此代码以强制唤醒所有消息循环： DWORD dwResult; SendMessageTimeout(HWND_BROADCAST, WM_NULL, 0, 0, SMTO_ABORTIFHUNG|SMTO_NOTIMEOUTIFNOTHUNG, 1000, &a…...

编程日记 2025/5/2 19:27:02

Python+onlyoffice 实现在线word编辑

onlyoffice部署 version: "3" services:onlyoffice:image: onlyoffice/documentserver:7.5.1container_name: onlyofficerestart: alwaysenvironment:- JWT_ENABLEDfalse#- USE_UNAUTHORIZED_STORAGEtrue#- ONLYOFFICE_HTTPS_HSTS_ENABLEDfalseports:- "8080:8…...

编程日记 2025/5/8 17:10:56

LC低通滤波器Bode图分析（传递函数零极点）

LC低通滤波器我们使得L4.7uH，C220uF；电感L的阻抗为Xl；电容C的阻抗为Xc； 传递函数 H ( s ) u o u i X C X C X L 1 s C 1 s C s L 1 1 s 2 L C （其中 s j ω ） H(s)\frac{u_{o} }{u_{i} } \frac{…...

编程日记 2025/5/9 7:06:58

【机器学习】机器学习的基本分类-无监督学习（Unsupervised Learning）

无监督学习（Unsupervised Learning） 无监督学习是一种机器学习方法，主要用于没有标签的数据集。其目标是从数据中挖掘出潜在的结构和模式。常见的无监督学习任务包括聚类、降维、密度估计和异常检测。 1. 无监督学习的核心目标 1.1 聚类…...

编程日记 2025/5/9 11:08:22

六、docker compose单机容器编排工具

六、docker compose单机容器编排工具 6.1 compose简介 Compose是一个用于定义和运行多容器Docker应用程序的工具。您可以使用Compose文件来配置应用程序的服务，然后使用单个命令从配置中创建并启动所有服务。compose的配置文件示例如下 compose的github网址&#…...

编程日记 2025/5/9 11:21:51

Python3 operator 模块

Python2.x 版本中，使用 cmp() 函数来比较两个列表、数字或字符串等的大小关系。 Python 3.X 的版本中已经没有 cmp() 函数，如果你需要实现比较功能，需要引入 operator 模块，适合任何对象，包含的方法有： o…...

编程日记 2025/5/3 21:46:00

沪合共融 “汽”势如虹 | 昂辉科技参加合肥上海新能源汽车产业融合对接会

为积极响应制造业重点产业链高质量发展行动号召，促进合肥、上海两地新能源汽车产业链上下游企业融合对接、协同发展，共同打造长三角世界级新能源汽车产业集群，11月28日，合肥市工信局组织部分县区工信部门及全市30余户新能源汽车产…...

编程日记 2025/5/9 11:10:23

访问http网页强制跳转到了https的解决办法

目录解决浏览器自动从 HTTP 重定向到 HTTPS 的问题问题原因：HSTS（HTTP Strict Transport Security）什么是 HSTS？HSTS 的工作原理如何解决？1. 清除浏览器的 HSTS 信息在 Chrome 中清除 HSTS 信息：在 Firef…...

编程日记 2025/5/9 11:21:50

PDF处理的创新工具:福昕低代码平台尝鲜

在当今数字化时代，PDF文件的处理和管理变得越来越重要。福昕低代码平台是新发布的一款创新的工具，旨在简化PDF处理和管理的流程。通过这个平台，用户可以通过简单的拖拽界面上的按钮，轻松完成对Cloud API的调用工作流，而…...

编程日记 2025/5/9 11:43:46

EmoAva:首个大规模、高质量的文本到3D表情映射数据集。

2024-12-03，由哈尔滨工业大学（深圳）的计算机科学系联合澳门大学、新加坡南洋理工大学等机构创建了EmoAva数据集，这是首个大规模、高质量的文本到3D表情映射数据集，对于推动情感丰富的3D头像生成技术的发展具有重要意义…...

编程日记 2025/5/5 12:12:31

SpringMVC ——（1）

1.SpringMVC请求流程 1.1 SpringMVC请求处理流程分析 Spring MVC框架也是⼀个基于请求驱动的Web框架，并且使⽤了前端控制器模式（是⽤来提供⼀个集中的请求处理机制，所有的请求都将由⼀个单⼀的处理程序处理来进⾏设计，再根据请求…...

编程日记 2025/5/8 21:49:25

测试工具LoadRunner Professional脚本编写-脚本设置

勾选扩展日志-全选原因：在并发完成后，通过抽查关键用户日志的方式，检查参数化是否如预期一致，比如抽查用户1（仓库一，物品一），用户11（仓库二，物品一），用户100（仓库十，物品十）设置忽略思考时间原因：是否忽略思考时间，请求数可能会有几十倍的差距…...

编程日记 2025/5/8 8:08:57

运用蓝光三维扫描仪的艺术与科技的完美融合-石膏头像模型3D扫描真实复刻

石膏头像具有独特的魅力，每一处细节都彰显着艺术之美。无论是深邃的眼神，还是精致的轮廓，都让人陶醉其中。随着雕塑形式的日渐丰富，越来越多的新材料和新的塑造手法被运用到雕塑创作中，蓝光三维扫描技术的应用&#…...

编程日记 2025/5/9 11:51:55

文本域设置高度加上文字限制并show出来：

文本域设置高度 :rows"4" 加上文字限制并show出来： maxlength"30" show-word-limit 效果: <el-form-item label"产品备注" prop"remark"><el-input v-model"form.remark" type"textarea"…...

编程日记 2025/5/9 11:50:55

探索数据确权、隐私保护、安全共享等方面的挑战与解决方案

在数据确权、隐私保护、安全共享等方面，当前确实面临着诸多挑战，同时也存在一些有效的解决方案。以下是对这些方面的详细探讨： 一、数据确权挑战权属关系模糊：由于数据具有复杂性和隐蔽性等特点，使得数据的权属关…...

编程日记 2025/5/9 11:04:25

麒麟 V10（ky10.x86_64）无网环境下 openssl - 3.2.2 与 openssh - 9.8p1 升级【最全教程】

目录背景安装包下载上传解压安装包安装zlib 安装OpenSSL 安装OpenSSH 验证背景近期，项目上线已进入倒计时阶段，然而在至关重要的安全检查环节中，却惊现现有的 OpenSSH 存在一系列令人担忧的漏洞： OpenSSH 资源管理错…...

编程日记 2025/5/8 11:14:24

前端技术(23) : 聊天页面

来源: GPT生成之后微调效果图 HTML代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>聊天</t…...

编程日记 2025/5/9 11:17:34

ArcMap 处理河道坡度、计算污染区、三维爆炸功能

ArcMap 处理河道坡度、计算污染区、三维爆炸功能今天分析一、计算河道方向坡度 1、折线转栅格确定 2、提取河道高程值确定后展示河流的高程值 3、计算坡向数据确定后展示 4、计算坡度数据确定后展示二、计算上游集水区污染值 1、填挖处理确定 2、计算流向确定 3、计算…...

编程日记 2025/5/4 13:52:34

数据结构（30）计算式查找法——哈希法

前言数据结构中的计算式查找法，特别是哈希法（又称散列法、杂凑法、关键字地址计算法），是一种高效的查找技术。一、哈希法的基本概念哈希法是通过一个哈希函数将关键字映射到哈希表中的某个位置，从而实现快速查找的技…...

编程日记 2025/5/6 3:11:20

电子商务人工智能指南 4/6 - 内容理解

介绍 81% 的零售业高管表示， AI 至少在其组织中发挥了中等至完全的作用。然而，78% 的受访零售业高管表示，很难跟上不断发展的 AI 格局。近年来，电子商务团队加快了适应新客户偏好和创造卓越数字购物体验的需求。采用 AI 不再是一…...

编程日记 2025/5/4 18:57:22

交易系统：线上交易系统流程详解

大家好，我是汤师爷~ 今天聊聊线上交易系统流程详解。线上交易系统为新零售连锁商家提供一站式线上交易解决方案。其核心目标是，通过数字化手段扩大商家的服务范围，突破传统门店的地理限制。系统支持电商、O2O等多种业务形态，为…...

编程日记 2025/5/9 11:06:18

如何通过自学成长为一名后端开发工程师？

大家好，我是袁庭新。最近，有星友向我提出了一个很好的问题：如何通过自学成为一名后端开发工程师？ 为了解答这个疑问，我特意制作了一个视频来详细分享我的看法和建议。戳链接：如何通过自学成长为一名后端开…...

编程日记 2025/5/3 18:05:13

实际车辆行驶轨迹与预设路线偏离检测的Java实现

准备工作本项目依赖于两个关键库：JTS Topology Suite（简称JTS），用于几何对象创建和空间分析；以及GeoTools，用于处理坐标转换和其他地理信息任务。确保开发环境中已经包含了这两个库，并且正确配…...

编程日记 2025/5/7 12:45:30

pci_resource相关函数

一、介绍 pci_resource_start函数用于获取PCI设备中指定Bar寄存器记录资源起始地址， 函数原型： resource_size_t pci_resource_start(struct pci_dev *dev, int bar) 参数： dev: PCI 设备结构体指针 bar: BAR 寄存器索引 (0-5) 返回&a…...

编程日记 2025/5/9 0:14:03

Android Studio 历史版本下载

Android Studio 历史版本下载官方链接：https://developer.android.google.cn/studio/archive 通过gradle插件版本反查Android Studio历史版本 Android Studio Ladybug | 2024.2.1 October 1, 2024 【https://redirector.gvt1.com/edgedl/android/studio/ide-zip…...

编程日记 2025/5/9 5:31:07

Jupyter Lab打印日志

有时候在 jupyter 中执行运行时间较长的程序，且需要一直信息，但是程序执行到某些时候就不再打印了。可以开启日志控制台，将日志信息记录在控制台中。参考：https://www.autodl.com/docs/jupyterlab/...

编程日记 2025/5/9 11:06:18

guava缓存的get方法的回调函数讲解一下

CacheBuilder.newBuilder()//设置缓存初始大小，应该合理设置，后续会扩容.initialCapacity(10)//最大值.maximumSize(100)//并发数设置.concurrencyLevel(5)//缓存过期时间，写入后10分钟过期.expireAfterWrite(600,TimeUnit.SECONDS)//统计缓存…...

编程日记 2025/5/9 11:24:59

【双分派小结】

双分派（Double Dispatch）是一种面向对象编程中的设计模式，通常用于实现多态性，尤其是在涉及多个对象交互时。它的基本思想是通过两个不同的对象来确定方法调用，而不仅仅是依赖于一个对象。双分派的工作原理在普通的…...

编程日记 2025/5/8 15:34:29

Python100道练习题

Python100道练习题 BIlibili 1、两数之和 num1 20 num2 22result num1 num2print(result)2、一百以内的偶数 list1 []for i in range(1,100):if i % 2 0:list1.append(i) print(list1)3、一百以内的奇数 # 方法一 list1 [] for i in range(1,100):if i % 2 ! 0:lis…...

编程日记 2025/5/9 11:08:22

Scala—Slice（提取子序列）方法详解

Scala—Slice（提取子序列）方法详解在 Scala 中，slice 方法用于从集合中提取一个连续的子序列（切片）。可以应用于多种集合类型，如 List、Array、Seq 等。一、slice 方法的定义 slice 根据提供的起始索引…...

编程日记 2025/5/9 11:43:46

nginx根据报文里字段转发至不同地址

nginx接收到post请求.请求报文里是一个json字符串，字符串里有个字段id。根据id不同，转发到不同地址。如果idaaa,转发到www.aaa.com.test 如果idbbb,转发到www.bbb.com.test 如何配置,请提供一个nginx.conf 要在 Nginx 中根据 POST 请求的 JSON 负载中的…...

编程日记 2025/5/9 11:47:50

Kafka单机及集群部署及基础命令

目录一、 Kafka介绍1、kafka定义2、传统消息队列应用场景3、kafka特点和优势4、kafka角色介绍5、分区和副本的优势6、kafka 写入消息的流程二、Kafka单机部署1、基础环境2、iptables -L -n配置3、下载并解压kafka部署包至/usr/local/目录4、修改server.properties5、修改/etc…...

编程日记 2025/5/9 11:15:30

TCP Robot Send Recive

Function main String data$ 定义字符串变量 SetNet #205, "192.168.0.1", 2004, CRLF, NONE, 0 设置端口号IP地址 OpenNet #205 As Server 端口号对应pc机的端口号 Print "等待201端口连接" WaitNet #201 等待201网…...

编程日记 2025/5/3 19:28:23

旅游管理系统｜Java｜SSM｜VUE｜前后端分离

【重要1⃣️】前后端源码万字文档部署文档【重要2⃣️】正版源码有问题包售后【包含内容】【一】项目提供非常完整的源码注释【二】相关技术栈文档【三】源码讲解视频【其它服务】【一】可以提供远程部署安装&#xf…...

编程日记 2025/5/9 11:20:49

qt-everywher交叉编译e-src-5.15.2

简化配置的方式： 你完全可以通过直接配置安装目录、编译链和目标架构来完成交叉编译，而不需要修改 mkspecs 配置。以下是如何通过简化配置来进行交叉编译 Qt 的步骤。准备交叉编译工具链首先，确保你已经安装了交叉编译工具链&#xff…...

编程日记 2025/5/3 4:10:55

Cursor vs VSCode：主要区别与优势分析

Cursor - The AI Code Editor 1. AI 集成能力 Cursor的优势原生AI集成： # Cursor可以直接通过快捷键调用AI # 例如：按下 Ctrl K 可以直接获取代码建议 def complex_function():# 在这里，你可以直接询问AI如何实现功能# AI会直接在编辑器中…...

编程日记 2025/5/4 12:51:24

Qt 小项目学生管理信息系统

主要是对数据库的增删查改的操作登录/注册界面： 主页面： 添加信息： 删除信息： 删除第一行（支持多行删除） 需求分析： 用QT实现一个学生管理信息系统，数据库为MySQL 要求&#xf…...

编程日记 2025/5/9 11:33:22

Hadoop3集群实战：从零开始的搭建之旅

目录一、概念 1.1 Hadoop是什么 1.2 历史 1.3 三大发行版本（了解） 1.4 优势 1.5 组成💗 1.6 HDFS架构 1.7 YARN架构 1.8 MapReduce概述 1.9 HDFS\YARN\MapReduce关系二、环境准备 2.1 准备模版虚拟机 2.2 安装必要软件 2.3 安…...

编程日记 2025/5/9 9:58:40

软件工程复习记录

基本概念软件工程三要素：方法、工具、过程软件开发方法：软件开发所遵循的办法和步骤，以保证所得到的运行系统和支持的文档满足质量要求。软件开发过程管理软件生命周期：可行性研究、需求分析、概要设计、详细设计、编码、测…...

编程日记 2025/5/9 11:22:54

爬虫运行后数据如何存储？

爬虫运行后获取的数据可以存储在多种不同的存储系统中，具体选择取决于数据的规模、查询需求以及应用场景。以下是一些常见的数据存储方法： 1. 文件系统对于小型项目或临时数据存储，可以直接将数据保存到本地文件中。常见的文件格式包括&…...

编程日记 2025/5/9 3:37:13