Nginx 反向代理（解决跨域）
文章目录
- 前言
- 一、同源策略
- 二、跨域是什么？
- 三、Nginx解决跨域
- 1.前端示例代码
- 2.说明
- 四、nginx反向代理配置
- 五、启动nginx
- 六、最终效果
- 总结
前言
Nginx反向代理解决跨域
一、同源策略
- 定义：同源策略（Same-Origin Policy）是指浏览器限制一个源（origin）的文档或脚本如何与另一个源的资源进行交互的安全策略。源是由协议（如HTTP HTTPS）、域名（如example.com）和端口号（如80、443）组成的唯一标识。
- 原理：根据同源策略，如果两个资源的协议、域名和端口号完全相同，则它们被认为是同源的，可以相互访问和交互。否则，它们被认为是不同源的，浏览器会限制它们之间的交互，以防止恶意网站通过跨域请求获取用户的敏感信息或进行其他恶意操作。
二、跨域是什么？
跨域（Cross-Origin）是指在浏览器中，当前正在访问的页面的域名与请求的资源域名不一致的情况。 例如，在A网站上通过AJAX请求B网站的数据时，就会产生跨域问题。跨域问题通常发生在前后端分离的应用中，当前端和后端部署在不同的域或端口上时，浏览器出于安全考虑会阻止跨域请求。跨域是由浏览器的同源策略造成的。
三、Nginx解决跨域
nginx通过反向代理解决跨域问题，本文是直接在nginx目录html操作的,完成这步你需要下载nginx ：https://nginx.org/自行去官网下载
1.前端示例代码
代码如下（示例）：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1"><title></title></head><body><button id="btn">点击获取</button><script>btn.onclick = () => {let xhr = new XMLHttpRequest()console.log(222);// 注意：这里我们地址不要写后端完整地址：我们给前面加一个/api就行，把// 端口哪里删去xhr.open('GET', '/api/user/all')xhr.onreadystatechange = () => {if (xhr.readyState == 4 && xhr.status == 200) {console.log(JSON.parse(xhr.responseText))}}xhr.send()}</script></body></html>
2.说明
这是我后端服务器上的接口地址：端口号是在5000，而我前端页面是80端口，所以就会导致跨域问题
四、nginx反向代理配置
配置反向代理，这里的/api/一定要与前端请求接口地址一致。
location /api/ {proxy_pass http://127.0.0.1:5000/;
}
五、启动nginx
双击点击nginx.exe启动即可
六、最终效果
发现我们后端请求就成功了。
总结
综上所述，Nginx解决跨域问题的方法有很多，比如修改响应头、使用CORS模块。但你可以根据实际需求选择最适合的方法来解决跨域问题。
相关文章：
Nginx 反向代理（解决跨域）
文章目录 前言一、同源策略二、跨域是什么？三、Nginx解决跨域1.前端示例代码2.说明 四、nginx反向代理配置五、启动nginx六、最终效果总结 前言 Nginx反向代理解决跨域 一、同源策略 定义：同源策略（Same-Origin Policy）是指浏览…...
gRPC-4种通信模式
4种通信模式 1、简单模式（Simple RPC） 简单模式：也称简单 RPC，即客户端发起一次请求，服务端响应处理后返回一个结果给客户端。 在 proto 文件中可如下定义： rpc SayHello(HelloRequest) returns (Hello…...
第五项修炼—系统思考
感谢合作伙伴的推荐，圆满结束为期两天的马上消费《第五项修炼—系统思考》项目！这不仅是一次培训，更是未来实践的起点。 两天的系统思考学习让我们看到，在技术管理的每个决策背后，都蕴含着深刻的系统关联。希望各位技…...
PYNQ 框架 - VDMA驱动 - 帧缓存
目录 1. 简介 2. 代码分析 2.1 _FrameCache 类定义 2.1.1 xlnk.cma_array() 2.1.2 pointerNone 2.1.3 PynqBuffer 2.2 _FrameCache 例化与调用 2.3 _FrameCache 测试 2.4 _FrameList 类定义 2.5 _FrameList 例化与调用 2.6 _FrameList 测试 3. 帧的使用 3.1 读取帧…...
Java导出Word文档的几种方法
文章目录 1. 使用 Apache POI2. 使用 Docx4j3. 使用 JODConverter4. 使用 FreeMarker 模板 在 Java 中导出 Word 文档可以通过多种库和方法实现。以下是几种常用的方法： 1. 使用 Apache POI Apache POI 是一个强大的库，可以用来读写 Microsoft Office 格…...
OceanBase V4.3.3，首个面向实时分析场景的GA版本发布
在10月23日举办的 OceanBase年度发布会 上，我们怀着激动之情，正式向大家宣布了 OceanBase 4.3.3 GA 版的正式发布，这也是OceanBase 为实时分析（AP）场景打造的首个GA版本。 2024 年初，我们推出了 4.3.0 版本…...
Maven随笔
文章目录 1、什么是MAVEN2、Maven模型3、Maven仓库4、项目集成1_Idea集成Maven设置2_创建Maven项目3_POM配置详解4_maven 坐标详情5_Maven工程类型6_导入Maven项目 5、依赖管理1_依赖配置2_依赖传递3_可选依赖4_排除依赖4_可选依赖和排除依赖的区别5_依赖范围6_继承与聚合7_版本…...
牛客题目解析
一.最长回文子串 1.题目：给定一个仅包含小写字母的字符串，求它的最长回文子串的长度。 最长回文子串__牛客网 2.算法原理： <1>动态规划算法:O(n^2),O(n^2) 具有通性，凡涉及回文子串的问题都可利用此法解决 知识储备&am…...
AG32的3个ADC可以并联使用吗
AG32的3个ADC可以并联使用吗？ Customer: 需求： 在t1时间段，用5M的速度ch1通道采样得到结果1. 在t2时间段，用5M的速度ch2通道采样得到结果2. 在t3时间段，用5M的速度ch3通道采样得到结果3. 然后如此循环 。 考虑用3…...
什么是 OpenTelemetry？
OpenTelemetry 定义 OpenTelemetry (OTel) 是一个开源可观测性框架，允许开发团队以单一、统一的格式生成、处理和传输遥测数据（telemetry data）。它由云原生计算基金会 (CNCF) 开发，旨在提供标准化协议和工具，用于收集…...
[vulnhub]DC:7
https://www.vulnhub.com/entry/dc-7,356/ 端口扫描主机发现 探测存活主机，178是靶机 nmap -sP 192.168.75.0/24 Starting Nmap 7.94SVN ( https://nmap.org ) at 2024-11-03 13:30 CST Nmap scan report for 192.168.75.1 Host is up (0.00037s l…...
个性化十足的贵族服务器，惠普ML310e Gen8，服务器中的 “潘多拉魔盒”
个性化十足的贵族服务器，惠普ML310e Gen8，服务器中的 “潘多拉魔盒” 小伙伴们大家好呀，这里是勤奋的凯尔森同学，今天给大家分享一款好玩的服务器，惠普ML310e Gen8 V2，相比大家都很熟悉HP ProLiant MicroS…...
百度社招内推
百度社招内推 「百度内推」快来投递你心仪的职位吧（ 网申链接地址：https://dwz.cn/ah4OUcca），填入内推码，完成投递，get内推绿色通道~我的内推码：IZ9PVH 内推有什么好处： 简历直达…...
本地部署开源在线即时通讯软件Fiora打造个人私密聊天室
文章目录 前言1.关于Fiora2.安装Docker3.本地部署Fiora4.使用Fiora5.cpolar内网穿透工具安装6.创建远程连接公网地址7.固定Uptime Kuma公网地址 前言 相信大家在聊天时候总是很没安全感，比如在和小姐妹背着男朋友聊一些不能说的坏话，或者背着女朋友和兄…...
TS（类 接口 泛型）
文章目录 类复习相关知识属性修饰符public 修饰符属性的简写形式 protected修饰符private修饰符readonly修饰符 抽象类 接口（interface）定义类结构定义对象结构定义函数结构接口之间的继承接口自动合并 （可重复定义）一些相似的概念…...
docker 启动 neo4j
docker 启动 neo4j 1. 启动2. 导入数据 1. 启动 运行下面命令启动 neo4j， docker run \-d \--restartalways \--publish7474:7474 --publish7687:7687 \--volume$HOME/neo4j-4.4.38/data:/data \--name neo4j-apoc-4.4.38 \-e NEO4J_dbms_allow__upgradetrue \-e …...
OPENAI官方prompt文档解析
官方文档地址:https://platform.openai.com/docs/guides/gpt-best-practices 文档中文版来源:OpenAI 官方提示工程指南 [译] | 宝玉的分享 (baoyu.io) 1.写清楚说明 如果prompt给的范围十分模糊或是过于宽泛,那么GPT就会开始猜测您想要的内容,从而导致生成的结果偏离预期. …...
【GESP】C++一级练习BCQM3092，双面打印
GESP一级知识点if分支语句和取余、整除操作练习。比较简单。 题目题解详见：https://www.coderli.com/gesp-1-bcqm3092/ 【GESP】C一级练习BCQM3092，双面打印 | OneCoderGESP一级知识点if分支语句和取余、整除操作练习。比较简单。https://www.coderli.…...
mysql--多表查询
一、联合查询 作用：合并结果集就是把两个select语句的查询结果合并到一起！ 合并结果集有两种方式： UNION：合并并去除重复记录，例如：SELECT * FROM t1 UNION SELECT * FROM t2； UNION ALL&a…...
RHCE-Web-nginx http实验和nginx https实验
一、web服务器简介 （1）什么是www www 是 world wide web 的缩写，也就是全球信息广播的意思。通常说的上网就是使用 www 来查询用户 所需要的信息。 www 可以结合文字、图形、影像以及声音等多媒体，并通过可以让鼠标单击超链接的…...
调用支付宝接口响应40004 SYSTEM_ERROR问题排查
在对接支付宝API的时候，遇到了一些问题，记录一下排查过程。 Body:{"datadigital_fincloud_generalsaas_face_certify_initialize_response":{"msg":"Business Failed","code":"40004","sub_msg…...
Unity3D中Gfx.WaitForPresent优化方案
前言 在Unity中，Gfx.WaitForPresent占用CPU过高通常表示主线程在等待GPU完成渲染（即CPU被阻塞），这表明存在GPU瓶颈或垂直同步/帧率设置问题。以下是系统的优化方案： 对惹，这里有一个游戏开发交流小组&…...
DockerHub与私有镜像仓库在容器化中的应用与管理
哈喽，大家好，我是左手python！ Docker Hub的应用与管理 Docker Hub的基本概念与使用方法 Docker Hub是Docker官方提供的一个公共镜像仓库，用户可以在其中找到各种操作系统、软件和应用的镜像。开发者可以通过Docker Hub轻松获取所…...
css的定位（position）详解：相对定位 绝对定位 固定定位
在 CSS 中，元素的定位通过 position 属性控制，共有 5 种定位模式：static（静态定位）、relative（相对定位）、absolute（绝对定位）、fixed（固定定位）和…...
令牌桶 滑动窗口-＞限流 分布式信号量-＞限并发的原理 lua脚本分析介绍
文章目录 前言限流限制并发的实际理解限流令牌桶代码实现结果分析令牌桶lua的模拟实现原理总结： 滑动窗口代码实现结果分析lua脚本原理解析 限并发分布式信号量代码实现结果分析lua脚本实现原理 双注解去实现限流 并发结果分析： 实际业务去理解体会统一注…...
智能仓储的未来：自动化、AI与数据分析如何重塑物流中心
当仓库学会“思考”，物流的终极形态正在诞生 想象这样的场景： 凌晨3点，某物流中心灯火通明却空无一人。AGV机器人集群根据实时订单动态规划路径；AI视觉系统在0.1秒内扫描包裹信息；数字孪生平台正模拟次日峰值流量压力…...
Swagger和OpenApi的前世今生
Swagger与OpenAPI的关系演进是API标准化进程中的重要篇章，二者共同塑造了现代RESTful API的开发范式。 本期就扒一扒其技术演进的关键节点与核心逻辑： 🔄 一、起源与初创期：Swagger的诞生（2010-2014） 核心…...
使用 SymPy 进行向量和矩阵的高级操作
在科学计算和工程领域，向量和矩阵操作是解决问题的核心技能之一。Python 的 SymPy 库提供了强大的符号计算功能，能够高效地处理向量和矩阵的各种操作。本文将深入探讨如何使用 SymPy 进行向量和矩阵的创建、合并以及维度拓展等操作，并通过具体…...
微软PowerBI考试 PL300-在 Power BI 中清理、转换和加载数据
微软PowerBI考试 PL300-在 Power BI 中清理、转换和加载数据 Power Query 具有大量专门帮助您清理和准备数据以供分析的功能。 您将了解如何简化复杂模型、更改数据类型、重命名对象和透视数据。 您还将了解如何分析列，以便知晓哪些列包含有价值的数据，…...
mac 安装homebrew (nvm 及git)
mac 安装nvm 及git 万恶之源 mac 安装这些东西离不开Xcode。及homebrew 一、先说安装git步骤 通用： 方法一：使用 Homebrew 安装 Git（推荐） 步骤如下：打开终端（Terminal.app） 1.安装 Homebrew…...