随机掉落的项目足迹:Vue3中vite.config.ts配置代理服务器解决跨域问题

跨域问题产生的原因:浏览器同源策略

后面的通俗解释小标题下的内容是便于大家理解同源策略和跨域问题。

同源策略跨域问题这两个小标题下的内容虽然比较专业不容易阅读,但是还是建议大家花时间理解并记忆,因为这是前端面试中的常考点。

同源策略

同源策略(Same-0rigin Policy)是指浏览器安全策略中的一项重要规则,它规定了浏览器只允许当前网页的脚本与来自同一站点(协议、主机、端口号相同)的窗口进行交互,而限制了与不同源(协议、主机、端口号任一不同)的窗口进行交互。这种限制能够有效保障用户的信息安全和隐私。

同源策略限制了跨域请求、Cookie、Localstorage、IndexedDB 等跨站点资源的访问,防止恶意网站窃取用户数据和攻击。同源策略的存在是 Web 安全的重要保障,是浏览器防范跨站脚本攻击(XSS)、跨站请求伪造(CSRF)等安全威胁的关键措施。

如果需要进行跨域请求或共享数据,可以通过特定的手段(如 JSONP、CORS、代理等)来实现。同时,Web 应用开发中应当严格遵守同源策略的原则,避免将敏感信息暴露在跨域页面中。

跨域问题

跨域问题(Cross-0rigin Resource sharing,CORs)是由于浏览器的同源策略(Same-0rigin Policy)导致的。如果两个 URL 的协议、主机名和端口号都相同,那么它们就是同源的,否则就是跨域的。当网页发起跨域请求时,浏览器会根据同源策略限制请求。 

通俗解释

举个例子:我的前端服务运行在我电脑的5173端口,而后端服务运行在我队友电脑的8080端口,由于咱们前后端不在同一个端,所以我通过浏览器向我队友的后端服务发送请求,浏览器会认为我的请求是不安全的,于是拒绝我的请求

而如果是小程序开发&

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/54865.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

TCP(Transmission Control Protocol,传输控制协议)整理

TCP(Transmission Control Protocol,传输控制协议)是一种面向连接的、可靠的传输协议,它是OSI(Open System Interconnection,开放式系统互联)模型中的第四层协议,通常使用于网络中的…

【linux系统】进程

文章目录 进程和PCBlinux与进程的相关命令PS linux下的PCB进程标识符父子进程fork 进程状态磁盘睡眠 -- D暂停和跟踪暂停 -- T和t僵尸进程 -- Z孤儿进程 进程优先级 进程地址空间再谈fork进程地址空间分布虚拟地址和页表mm_struct 进程控制进程终止进程退出码信号 进程等待进程…

【翻译】在 Python 应用程序中使用Qt Designer的UI文件

原文地址:Using a Designer UI File in Your Qt for Python Application 直接上图,上代码 将UI文件转为Python 为了演示,我们使用 Qt Widgets 简单示例说明。 这个应用程序由一个源文件 easing.py、一个 UI 文件 form.UI、一个资源文件 ea…

Linux补丁命令patch

1、生成补丁,创建两个相同的目录结构,修改里面文件的内容 diff -uNr old_version new_version > update.patch 2、打补丁,应用到一个名为 target_version/ 的目录上,该目录与old_version/ 文件相同。 cd target_version patc…

考研笔记之操作系统(四) - 文件管理

文件管理 1. 简介1.1 前情回顾1.2 文件的属性1.3 文件内部数据的组织方式1.4 操作系统向上提供的文件功能1.5 文件应如何放在外存 2. 文件的逻辑结构2.1 无结构文件2.2 有结构文件2.2.1 顺序文件2.2.2 索引文件2.2.3 索引顺序文件2.2.4 多级索引顺序文件 3. 文件目录3.1 基本概…

【网络】用网线连接两台电脑实现远程桌面

目录 1. 准备工作1.1 硬件要求1.2 软件要求 2. 网络连接2.1 直接连接2.2 通过路由器连接 3. 配置IP地址3.1 设置IP地址3.2 检查连接 4. 启用远程桌面4.1 启用远程桌面4.2 添加用户4.3 防火墙设置 5. 远程连接5.1 使用远程桌面连接5.2 使用快捷方式 6. 常见问题解决7. 额外建议结…

1422. 分割字符串的最大得分【字符串】

文章目录 1422. 分割字符串的最大得分解题思路Go代码 1422. 分割字符串的最大得分 1422. 分割字符串的最大得分 给你一个由若干 0 和 1 组成的字符串 s ,请你计算并返回将该字符串分割成两个 非空 子字符串(即 左 子字符串和 右 子字符串)所…

使用3080ti运行blip2的

使用3080ti运行blip2的案例 注意!blip2很吃显存,需要大于80GB显存的卡。我最后安装的所有包的版本信息(python 3.9 )以供参考: 首先,我在运行blip2的demo的时候显存用了80G以上,所以大家卡的显存…

Vue 中引入 ECharts 的详细步骤与示例

在Vue项目中引入ECharts,可以让我们轻松地在前端页面中展示各种图表。ECharts 是一个基于 JavaScript 的开源可视化图表库,它提供了丰富的图表类型和强大的配置选项,使得在Vue项目中集成和使用变得非常方便。 一、准备工作 创建Vue项目&…

moectf-Web题解

1、弗拉格之地的入口 2、垫刀之路01: MoeCTF?启动! 3、ez_http 4、ProveYourLove 5、弗拉格之地的挑战 6、ImageCloud前置 7、垫刀之路02: 普通的文件上传 8、垫刀之路03: 这是一个图床 9、垫刀之路05: 登陆网站 10、垫刀之路06: pop base mini …

【工具】VSCODE下载,配置初次设置

打开 settings.json 文件,包含了 Visual Studio Code (VSCode) 中的各种用户配置。 {"files.associations": {"*.vue": "vue","*.wpy": "vue","*.wxml": "html","*.wxss": "…

软件架构设计中的微内核架构是什么

Visual Studio Code 是一个广受欢迎的代码编辑器。它同样采用微内核架构,核心是一个轻量级的编辑器引擎,提供了基本的文本编辑、代码高亮、语法检查等功能。 通过安装不同的扩展插件,用户可以添加对各种编程语言的支持、调试功能、版本控制集…

React生命周期案例详解

React 组件的生命周期是指组件从创建、渲染、更新到卸载的整个过程。在 React 16 及之前的版本中,生命周期方法被分为几个不同的阶段:挂载(Mounting)、更新(Updating)、卸载(Unmounting&#xf…

Java值传递、序列化详解

Java 值传递详解 说到参数,我们先来搞懂一下这两个概念 形参&实参 值传递&引用传递 形参&实参 方法的定义可能会用到 参数(有参的方法),参数在程序语言中分为: 实参(实际参数,…

QT实现Opencv图像处理

案例 基于QT的人脸识别 pro文件需要加以下代码 INCLUDEPATH E:/opencv/opencv3.4-qt-intall/install/include INCLUDEPATH E:/opencv/opencv3.4-qt-intall/install/include/opencv INCLUDEPATH E:/opencv/opencv3.4-qt-intall/install/include/opencv2 LIBS E:/opencv/o…

D34【python 接口自动化学习】- python基础之输入输出与文件操作

day34 文件关闭 学习日期:20241011 学习目标:输入输出与文件操作﹣-46 常见常新:文件的关闭 学习笔记: 文件关闭的内部工作过程 close()函数 with语句 常用的打开关闭文件 # 文件关闭 # 方式…

【Python】操作列表

Python是一种功能强大的编程语言,它提供了丰富的操作列表的方法。列表是一种有序、可变的数据类型,可以存储任意类型的元素。下面是一些常用的操作列表的方法: 1. 创建列表:可以使用方括号 [] 或者 list() 函数来创建一个列表。例…

kubernetes详解

一、kubernetes的定义 Kubernetes (希腊语"舵手" 或 "飞行员") 由Joe Beda,Brendan Burns和Craig McLuckie创立,并由其他谷歌工程师,包括Brian Grant和Tim Hockin进行加盟创作,并由谷歌在2014年首次对外宣布。…

值类型和引用类型的使用

using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks;namespace ConsoleApp1 {class Program{static void Main(string[] args){/****值类型****/bool test;//必须赋值,否则报错test true;Console.WriteLin…

微服务_3.微服务保护

文章目录 一、微服务雪崩及解决方法1.1、超时处理1.2、仓壁模式1.3、断路器1.4、限流 二、Sentinel2.1、流量控制2.1.1、普通限流2.1.2、热点参数限流 2.2、线程隔离2.3、熔断降级2.3.1、断路器状态机2.3.2、断路器熔断策略2.3.2.1、慢调用2.3.2.2、异常比例,异常数…