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

news2024/11/17 6:32:25

一、为什么有跨域

跨域问题本质上是由于浏览器的同源策略(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.coloradmin.cn/o/2242002.html

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

相关文章

Python_爬虫3_Requests库网络爬虫实战(5个实例)

目录 实例1:京东商品页面的爬取 实例2:亚马逊商品页面的爬取 实例3:百度360搜索关键词提交 实例4:网络图片的爬取和存储 实例5:IP地址归地的自动查询 实例1:京东商品页面的爬取 import requests url …

StructuredStreaming (一)

一、sparkStreaming的不足 1.基于微批,延迟高不能做到真正的实时 2.DStream基于RDD,不直接支持SQL 3.流批处理的API应用层不统一,(流用的DStream-底层是RDD,批用的DF/DS/RDD) 4.不支持EventTime事件时间(一般流处理都会有两个时间:事件发生的事件&am…

计算机网络HTTP——针对实习面试

目录 计算机网络HTTP什么是HTTP?HTTP和HTTPS有什么区别?分别说明HTTP/1.0、HTTP/2.0、HTTP/3.0请说明访问网页的全过程请说明HTTP常见的状态码Cookie和Session有什么区别?HTTP请求方式有哪些?请解释GET和POST的区别?HT…

转轮数组(C语言实现)

题目介绍 方法一我们可以先把数字1 2 3 4逆转一下&#xff0c;第二步我们可以逆转一下5 6 7&#xff0c; 最后整体逆置一下就会变成上面的数字。 void reverse(int* nums, int begin, int end) {while (begin < end){int tmp nums[begin];nums[begin] nums[end];nums[en…

Ubuntu 的 ROS 操作系统 turtlebot3 gazebo仿真

引言 TurtleBot3 Gazebo仿真环境是一个非常强大的工具&#xff0c;能够帮助开发者在虚拟环境中测试和验证机器人算法。 Gazebo是一个开源的3D机器人仿真平台&#xff0c;它能支持物理引擎&#xff0c;允许机器人在虚拟环境中模拟和测试。结合ROS&#xff0c;它能提供一个完整的…

uniapp vuex的使用

实现组件全局&#xff08;数据&#xff09;管理的一种机制&#xff0c;可以方便的实现组件之间共享数据&#xff0c;不同于上述三种传递值的方式。 可以把vuex当成一个store仓库&#xff0c;可以集中管理共享的数据&#xff0c;并且存储在vuex中的数据都是响应式的&#xff0c…

uniapp适配暗黑模式配置plus.nativeUI.setUIStyle适配DarkMode配置

uniapp适配暗黑模式配置 目录 uniapp适配暗黑模式配置setUIStyleDarkMode 适配app-plus manifest.json配置theme.json配置pages.json配置页面切换代码实现同步手机暗黑配置额外适配 参考官方文档&#xff1a;https://uniapp.dcloud.net.cn/tutorial/darkmode.html 主要用到api…

element ui table进行相同数据合并单元格

示例如图 //要合并的项&#xff08;自定义&#xff09; const columnArr ["dq","sj","xj","zj","zjj","zjfzr","nhxm","nhsjh","nhsfzh","","",""…

uniapp 实现 ble蓝牙同时连接多台蓝牙设备,支持app、苹果(ios)和安卓手机,以及ios连接蓝牙后的一些坑

首先对 uniapp BLE蓝牙API进行封装 这里我封装了一个类&#xff1a;bluetoothService.js 代码&#xff1a; import { throttle } from lodash export default class Bluetooth {constructor() {this.device {};this.connected false;// 使用箭头函数绑定类实例的上下文&am…

51单片机应用开发(进阶)---模块化编程

实现目标 1、掌握.h 文件的格式、extern 的用法&#xff1b; 2、握模块化编程方法步骤&#xff1b; 3、具体实现&#xff1a;&#xff08;1&#xff09;提供一个C文件&#xff0c;将其按照功能模块进行模块化。 一、为什么要进行模块化编程&#xff1f; 传统的编程方式&…

arkUI:水果选择与管理:基于 ArkUI 的长按编辑功能实现

水果选择与管理&#xff1a;基于 ArkUI 的长按编辑功能实现 1 主要内容说明2 相关内容2.1 相关内容2.1.1 源码1内容的相关说明2.1.1.1 数据结构与状态管理2.1.1.2 添加水果功能2.1.1.3 水果列表展示2.1.1.4 长按进入编辑模式2.1.1.5 复选框的多选功能2.1.1.6 删除水果功能2.1.1…

小程序20-样式:自适应尺寸单位 rpx

手机设备的宽度逐渐多元化&#xff0c;也就需要开发者开发过程中&#xff0c;去适配不同屏幕宽度的手机&#xff0c;为了解决屏幕适配问题&#xff0c;微信小程序推出了 rpx 单位 rpx&#xff1a;小程序新增的自适应单位&#xff0c;可以根据不同设备的屏幕宽度进行自适应缩放 …

unity3d————Resources异步加载

知识点一&#xff1a;Resources异步加载是什么&#xff1f; 在Unity中&#xff0c;资源加载可以分为同步加载和异步加载两种方式。同步加载会在主线程中直接进行&#xff0c;如果加载的资源过大&#xff0c;可能会导致程序卡顿&#xff0c;因为从硬盘读取数据到内存并进行处理…

C#/WinForm拖拽文件上传

一、首先创建一个上传文件的类&#xff0c;继承Control类&#xff0c;如下&#xff1a; public class UploadControl : Control{private Image _image;public UploadControl(){this.SetStyle(ControlStyles.UserPaint | //控件自行绘制&#xff0c;而不使用操作系统的绘制Cont…

2024 同一个网段,反弹shell四种方法【linux版本】bash、python、nc、villian反弹shell图解步骤

实验环境准备&#xff08;同一个网段下&#xff0c;我是桥接的虚拟机&#xff09; 一、bash反弹shell 二、python反弹shell 三、nc反弹shell 四、villain反弹shell 实验环境准备&#xff08;同一个网段下&#xff0c;我是桥接的虚拟机&#xff09; 一台kali的linux(攻击者)…

FPGA使用Verilog实现CAN通信

FPGA实现CAN通信&#xff08;Verilog&#xff09; 1.作者使用的方法是通过FPGA芯片&#xff08;如Xilinx公司的型号为XC7K325TFFG676-2&#xff09;控制SJA1000T芯片&#xff08;CAN控制器芯片&#xff09;实现CAN通信&#xff0c;如下图所示&#xff1a; 2.熟悉连接方式之后&…

已解决:spark代码中sqlContext.createDataframe空指针异常

这段代码是使用local模式运行spark代码。但是在获取了spark.sqlContext之后&#xff0c;用sqlContext将rdd算子转换为Dataframe的时候报错空指针异常 Exception in thread "main" org.apache.spark.sql.AnalysisException: java.lang.RuntimeException: java.lang.Nu…

jenkins用户在执行scp的时候如何做免密登录

一、背景 在jenkins job中执行scp的shell命令&#xff0c;当然不希望每次输入密码&#xff0c;另外处于出于安全考虑&#xff0c;也不建议在scp命令中指定。 所以&#xff0c;我们需要对远程机器进行免密登录。 本文遇到的问题是&#xff0c;在jenkins机器上执行scp已做到了…

HarmonyOS ArkUI(基于ArkTS) 开发布局 (中)

HarmonyOS ArkUI(基于ArkTS) 开发布局 &#xff08;上&#xff09; 四 层叠布局 (Stack) 层叠布局&#xff08;StackLayout&#xff09;用于在屏幕上预留一块区域来显示组件中的元素&#xff0c;提供元素可以重叠的布局。层叠布局通过Stack容器组件实现位置的固定定位与层叠&…

无线网络信号 6G、5G和2.4G 的一些小科普

无线网络信号划分为6G、5G和2.4G这几类信号&#xff0c;它们各自有不同的用途和区别&#xff1a; 1、 2.4G无线技术 - 用途&#xff1a;2.4G无线技术广泛应用于智能家居、物联网、WLAN和蓝牙设备等。它是一个全球性的工作频段&#xff0c;适用于低速率的应用&#xff0c;如普通…