【Linux】Nginx解决跨域问题
文章目录
- 一、跨域问题
- 二、解决跨域问题
- 三、结尾
一、跨域问题
在前后端分离的项目中,前端通常运行在一个域名或端口上,而后端运行在另一个域名或端口上。当浏览器发起跨域请求时,即前端页面向后端发送请求的域名、端口或协议与当前页面的域名、端口或协议不一致时,就会发生跨域问题。
跨域问题是由浏览器的同源策略引起的安全机制。同源策略要求网页只能访问与其来源相同的资源,即协议、域名和端口必须一致,而跨域请求则突破了这个限制。
当以下任一条件不满足时,就会发生跨域问题:
不同的协议:例如,一个页面通过 HTTP 协议加载了 JavaScript,然后尝试向使用 HTTPS 协议的服务器发送请求。
不同的域名:例如,一个页面从 www.example.com 加载了 JavaScript,然后尝试向 api.example.com 发送请求。
不同的端口:例如,一个页面从 www.example.com:8080 加载了 JavaScript,然后尝试向 www.example.com:3000 发送请求。
二、解决跨域问题
为了解决跨域问题,可以借助Nginx来进行反向代理。以下是使用Nginx解决跨域问题的步骤:
- 在前端服务器上安装和配置Nginx,安装教程可以看我上一篇文章:《【Linux】Linux中安装Nginx》。
- 在Nginx配置文件中使用反向代理实现跨域。
示例
前端调试页面的地址是:http://www.example.com:8080/dist/index.html
后端请求的接口地址是:http://api.example.com:8181/api/
Nginx默认配置文件地址 /usr/local/nginx/conf
,如果安装的时候指定了路径,就在你指定的目录下,修改配置文件nginx.conf
:
server{listen 80;server_name www.example.com; # 前端域名或ip# 默认配置,无需修改location / {root html;index index.html index.htm;}# 后端接口配置location /api {proxy_pass http://api.example.com:8181;}# 前端页面配置location /dist {proxy_pass http://www.example.com:8080/dist;}}
PS:前端访问后端API的域名或ip需要设置为
server_name
的值,端口号为监听的端口号,然后根据/api
匹配的路径转发到后端接口配置的地址上,举例:后端实际查询用户列表的接口地址为http://api.example.com:8181/api/user/list
,那么前端页面访问接口时路径应该为http://www.example.com/api/user/list
(我这里端口是80,所以可以省略)。
如果前端不修改,会出现报错
Access to XMLHttpRequest at 'http://api.example.com:8181/api/user/list' from origin 'http://www.example.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
,就算配置了add_header 'Access-Control-Allow-Origin' '*' always
也无效。
- 重新加载Nginx配置:在终端中执行命令以重新加载Nginx配置文件:
$ ./nginx -s reload
在重新加载Nginx配置文件之前,可以先使用 ./nginx -t
验证nginx配置文件是否正确。
4.页面访问:http://www.example.com/dist/index.html
。
三、结尾
以上就是全部了,为了解决这个问题我头都大了,不管怎么改配置都无效,最后还是前端改了下马上就可以了,所以记录一下。
相关文章:
【Linux】Nginx解决跨域问题
文章目录 一、跨域问题二、解决跨域问题三、结尾 一、跨域问题 在前后端分离的项目中,前端通常运行在一个域名或端口上,而后端运行在另一个域名或端口上。当浏览器发起跨域请求时,即前端页面向后端发送请求的域名、端口或协议与当前页面的域…...
无涯教程-PHP - preg_split()函数
preg_split() - 语法 array preg_split (string pattern, string string [, int limit [, int flags]]); preg_split()函数的操作与split()完全相同,只不过正则表达式被接受为pattern的输入参数。 如果指定了可选的输入参数limit,则仅返回子字符串的限…...
B. Spreadsheets
Problem - B - Codeforces 问题描述:excel有两种情况, Rr_nCc_n:R行数C列数ZZZ(列数)行数。 对这两个进行相互转换。 细节: 准确判断这两种情况 string str; cin>>str; auto posR str.find("R"), posC st…...
matlab面向对象
一、面向对象编程 1.1 面向过程与面向对象 区别: 面向过程的核心是一系列函数,执行过程是依次使用每个函数面向对象的核心是对象(类)及其属性、方法,每个对象根据需求执行自己的方法以解决问题 对象:单个…...
01、Cannot resolve MVC View ‘xxxxx前端页面‘
Cannot resolve MVC View ‘xxxxx前端页面’ 没有找到对应的mvc的前端页面。 代码:前端这里引入了 thymeleaf 模板 解决: 需要添加 thymeleaf 的依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>s…...
时空智友企业流程化管控系统文件上传漏洞复现
0x01 产品简介 时空智友企业流程化管控系统是一个功能丰富、灵活可定制的企业管理工具。通过该系统,企业能够实现流程的自动化、协同的提升、数据的洞察和决策的优化,从而提高工作效率、管理水平和企业竞争力。 0x02 漏洞概述 时空智友企业流程化管控系…...
【已解决】Authenticator:无法添加账户请验证激活代码是否正确以及您的设备是否已为此应用启用推送通知
问题: 小米手机的Authenticator添加微软账户扫描QR码提示:无法添加账户请验证激活代码是否正确以及您的设备是否已为此应用启用推送通知 解决办法: 1、在通知管理中允许Authenticator所有通知。 2、在手机设置-账户与同步里找到谷歌基础服…...
聊聊springboot tomcat的maxHttpFormPostSize
序 本文主要研究一下spring boot tomcat的maxHttpFormPostSize参数 parseParameters tomcat-embed-core-9.0.37-sources.jar!/org/apache/catalina/connector/Request.java /*** Parse request parameters.*/protected void parseParameters() {parametersParsed true;Para…...
java并发:synchronized锁详解
背景: 在java多线程当中,我们总有遇到过多个线程操作一个共享数据时,而这个最后的代码执行结果并没有按照我们的预期一样得到正确的结果。此时我们就需要让代码执行在操作共享变量时,要等一个线程操作完毕时,另一个线程…...
Unity 之NavMeshAgent 组件(导航和路径寻找的组件)
文章目录 **作用**:**属性和方法**:**用途**:**注意事项**: NavMeshAgent 是Unity引擎中用于导航和路径寻找的组件。它可以使游戏对象在场景中自动找到可行走的路径,并在避免障碍物的情况下移动到目标位置。 以下是关于…...
装箱和拆箱
1. 概念 装箱 将值类型转换成等价的引用类型 装箱的步骤 拆箱 将一个已装箱的引用类型转换为值类型,拆箱操作需要声明拆箱后转换的类型 拆箱的步骤 1)获取已装箱的对象的地址 2)将值从堆上的对象中复制到堆栈上的值变量中 2. 总结 装箱和拆箱…...
等保测评--安全通信网络--测评方法
安全子类--安全架构 a)应保证网络设备的业务处理能力满足业务高峰期需要; 一、测评对象 路由器、交换机、无线接入设备和防火墙等提供网络通信功能的设备或相关组件 二、测评实施 1) 应核查业务高峰时期一段时间内主要网络设备(一般包括核心交换机、汇聚交换机、边界路…...
统计学补充概念11-tsne
概念 t-SNE(t-distributed Stochastic Neighbor Embedding)是一种非线性降维技术,用于可视化高维数据在低维空间中的分布。与主成分分析(PCA)等线性降维方法不同,t-SNE专注于保留数据点之间的局部相似性关…...
Linux_11_系统启动和内核管理
目录 1 C entOS 6 的启动管理1.1 Linux 组成1.2 内核设计流派1.3 CentOS 6启动流程1.3.1 CentOs 6 启动流程1.3.1 硬件启动POST1.3.2 bootloader 启动/引导加载器1.3.2.1 grub 功能和组成1.3.2.2 CentOS 6 grub 安装1.3.2.3 grub legacy 管理 1.3.3 加载 kernel1.3.4 init 初始…...
【从零学习python 】65. Python正则表达式修饰符及其应用详解
文章目录 正则表达式修饰符进阶案例 正则表达式修饰符 修饰符描述re.I使匹配对大小写不敏感re.M多行匹配,影响 ^ 和 $re.S使 . 匹配包括换行在内的所有字符 示例代码如下: import reprint(re.search(rL, hello)) # None# 不区分大小写,可…...
QA2
1. import shutil 是什么意思? 在 Python 中,import shutil 是导入标准库 shutil 的语句。shutil 提供了一些用于复制文件和文件夹、移动文件和文件夹、以及执行其他文件操作的函数。 通过导入 shutil,你可以使用其中的函数来处理文件和文件…...
centos7卸载docker
要在CentOS 7上干净地卸载Docker,可以执行以下步骤: 停止Docker服务: sudo systemctl stop docker移除所有Docker容器和镜像。这将删除所有相关数据,包括容器、镜像以及存储卷等。请注意,这将不可逆转地删除数据。 …...
【计算机视觉】递归神经网络在图像超分的应用Deep Recursive Residual Network for Image Super Resolution
DRCN: Deeply-Recursive Convolutional Network for Image Super-Resolution 总结 这篇文章是第一次将之前已有的递归神经网络(Recursive Neural Network)结构应用在图像超分辨率上。为了增加网络的感受野,提高网络性能,引入了深度递归神经网络&#x…...
Centos 7 安装系列(8):openGauss 3.0.0
安装依赖包: yum -y install libaio-devel flex bison ncurses-devel glibc-devel patch redhat-lsb-core readline-devel openssl-devel sqlite-devel libnsl 安装插件: yum install -y bzip2 net-tools为什么要安装这两个? 安装bzip2 是…...
NOIP真题讲解 传球游戏 接水问题
传球游戏 说明 上体育课的时候,小蛮的老师经常带着同学们一起做游戏。这次,老师带着同学们一起做传球游戏。 游戏规则是这样的:n个同学站成一个圆圈,其中的一个同学手里拿着一个球,当老师吹哨子时开始传球,…...
《论文阅读18》 SSD: Single Shot MultiBox Detector
一、论文 研究领域: 2D目标检测论文:SSD: Single Shot MultiBox Detector ECCV 2016 数据集 论文链接论文github 二、论文概要 SSD网络是作者Wei Liu在ECCV 2016上发表的论文。对于输入尺寸300x300的网络 使用Nvidia Titan X在VOC 2007测试集上达到74…...
NOIP2016普及组第四题 魔法阵
魔法阵 题目描述 六十年一次的魔法战争就要开始了,大魔法师准备从附近的魔法场中汲取魔法能量。 大魔法师有m个魔法物品,编号分别为1,2,…,m。每个物品具有一个魔法值,我们用Xi表示编号为i的物品的魔法值。每个魔法值Xi是不超过n的正整数&…...
uniapp-滑块验证组件wo-slider
wo-slider是一款支持高度自定义的滑块验证组件,采用uniapp-vue2编写 采用touchstart、touchmove、touchend事件实现的滑块组件,支持H5、微信小程序(其他小程序未试过,可自行尝试) 可到插件市场下载尝试: https://ext.…...
NPM 管理组织成员
目录 1、向组织添加成员 1.1 邀请成员加入您的组织 1.2 撤销组织邀请 2、接收或拒接组织邀请 2.1 接收组织邀请 2.2 拒绝组织邀请 3、组织角色和权限 4、管理组织权限 5、从组织中删除成员 1、向组织添加成员 作为组织所有者,您可以将其他npm用户添加到…...
设计模式(3)抽象工厂模式
一、概述: 1、提供一个创建一系列相关或相互依赖对象的接口,而无须指定它们具体的类。 2、结构图: 3、举例代码: (1) 实体: public interface IUser {public void insert(User user);public…...
【C++】早绑定、析构与多态 | 一道关于多态的选择题记录
今天在和群友聊天的时候看到了一道很坑的题目,分享给大家 1.看题! 先来看看题目 struct Dad { public:Dad(){ echo();}~Dad(){ echo();}virtual void echo() {cout << "DAD ";} };struct Son:Dad { public:void echo() const override…...
mac下安装tomcat
1. 官网下载Apache Tomcat - Apache Tomcat 9 Software Downloads 2. 授权bin目录下所有.sh文件权限sudo chmod 755 *.sh 3. 启动程序(后台运行) sudo sh ./startup.sh 4. 在当前窗口启动程序,随时看到日志sudo sh ./catalina.sh run 5. 关闭程序 sudo sh ./shu…...
【小梦C嘎嘎——启航篇】string常用接口的模拟实现
【小梦C嘎嘎——启航篇】string常用接口的模拟实现😎 前言🙌string 模拟实现1、iterator 迭代器相关使用函数实现2、构造函数接口实现3、 传统写法——拷贝构造函数接口实现4、 现代写法——拷贝构造函数接口实现5、析构函数接口实现6、传统写法—— 赋…...
【Jenkins】持续集成部署学习
【Jenkins】持续集成部署学习 【一】安装部署【1】Jenkins所处位置【2】Docker安装Gitlab(1)首先准备一台空的虚拟机服务器(2)安装服务器所需的依赖(3)Docker的安装(4)阿里云镜像加速…...
Redis数据结构之List
Redis 中列表(List)类型是用来存储多个有序的字符串,列表中的每个字符串成为元素 Eelement),一个列表最多可以存储 2^32-1 个元素。 在 Redis 中,可以对列表两端插入(push)和弹出&am…...
SpringCloud Alibaba实战和源码(7)Skywalking
什么是SkyWalking Skywalking是由国内开源爱好者吴晟开源并提交到Apache孵化器的产品,它同时吸收了Zipkin /Pinpoint /CAT 的设计思路。特点是:支持多种插件,UI功能较强,支持非侵入式埋点。目前使用厂商最多,版本更新较…...
MySQL索引可能失效之or、is null、is not null、不等于(!=,<>)、联合索引
1、如果 A,B 两列都有索引,那么 select * from Table where Aa or Bb; 会走索引吗? 答案:会,因为 A,B都有索引; 2、如果 A,B有索引,但是C没有索引; select * from Table where Aa or Bb …...
无人机电力巡检:探索电力设施维护的新模式
电力巡检一直是电力行业中关键的环节,它的目的是确保电力设施的正常运行和安全稳定,对提高电力设施的可靠性、确保电力供应的稳定性和提高电力企业的管理水平具有重要的意义。传统的电力巡检方式通常采用人工的方式进行,这种方式存在很多的问…...
ethers.js1:ethers的安装和使用
ethers官方文档:Documentation 1、ethers简介: ethers.js是一个完整而紧凑的开源库,用于与以太坊区块链及其生态系统进行交互。如果你要写Dapp的前端,你就需要用到ethers.js。 与更早出现的web3.js相比,它有以下优点…...
小程序中的页面配置和网络数据请求
页面配置文件和常用的配置项 1.在msg.json中配置window中的颜色和背景色 "navigationBarBackgroundColor": "#efefef","navigationBarTextStyle": "black" 2.可以看到home中的没有发生变化但是msg的发生变化了,这个和前面的…...
使用ImageMagick实现多张图片拼接为gif(多线程版)
官网: https://imagemagick.org/ 直接上代码 ExecutorService es Executors.newFixedThreadPool(10); List<File> images getImageFiles(sceneDir); CountDownLatch cdl new CountDownLatch(images.size()); // 拷贝图片 for (File file : images) {System.out.prin…...
解释 RESTful API,以及如何使用它构建 web 应用程序。
RESTful API是一种利用HTTP协议进行通信的Web API设计风格,它采用了一组统一且可缓存的操作,包括GET、POST、PUT、DELETE等,通过URL来定位资源,以及使用JSON、XML等格式来传输数据,以实现系统之间的数据交互和资源共享…...
远程端口转发 实践 如何将物理机某一端口的服务转发到vps上,使得外网能访问到
以本机1470端口(我的sqli-labs)与vps的9023端口为例。 SSH基本的连接命令是: ssh usernamehostname这里牵扯到了两台主机,一是执行命令、运行SSH客户端的主机,我们称为本地主机A【Host A】;二是接收连接请…...
【uniapp 监听键盘弹起与收回】
在uniapp中,可以通过使用小程序提供的API来监听键盘弹起与收回。 首先,在页面的onLoad函数中注册监听事件: onLoad() {uni.onKeyboardHeightChange(this.onKeyboardHeightChange); },然后,在页面的onUnload函数中取消注册监听事…...
【Unity】如何制作小地图
我们为什么要制作小地图呢? 原因很简单: 导航和定位:小地图可以显示玩家当前位置以及周围环境的概览。这使得玩家能够更好地导航和定位自己在游戏中的位置,找到目标或避开障碍物。场景了解:通过小地图,玩…...
基于IMX6ULLmini的linux裸机开发系列八:按键处理实验
目录 GIC相关寄存器 GPIO中断相关寄存器 中断服务函数表 中断向量表偏移位置 make有报错 解决方法:error: for loop initial declarations are only allowed in C99 mode_‘for’ loop initial declarations are only allowed i_Young_2717的博客-CSDN博客 GIC…...
数据结构好题总结
Cut Inequality Down 题解 https://blog.csdn.net/lzh_naive/article/details/103340568 概括:st表倍增类st表 考虑如果没有UL限制的话,相当于是前缀和 我们发现,如果某次到了U/L(相当于是一次碰壁)那么这个值已知…...
Java串口开发
网上搜索了关于java串口开发的资料,发现都不是特别的全,故写下一些心得以帮助其他人能快速上手java串口开发,如有错漏之处,敬请指正 串口开发会用到一个javax.comm和RXTXcomm库,,javax.comm库不支持64位操作系统。该库仅适用于32位操作系统,所以接下来主…...
Python nohup 启动python脚本,后台没有日志
一、情况 1.linux上运行python脚本,前台运行打印日志,后台使用nohup不打印日志。 前台运行 ./xxx.py 后台运行 nohup python ./xxx.py > xxx.log 2>&1 &二、排查思路 2.1 脚本是否有问题 首先看自己写的python脚本是否存在问题。因为…...
完美解决微信小程序使用复选框van-checkbox无法选中
由于小程序使用了vant-ui框架,导致checkbox点击无法选中问题 <van-checkbox value"{{ checked }}" shape"square"><view class"check-content"><view class"checktext">我已阅读并同意>《用户协议》…...
IDEA报错:类文件具有错误的版本 61.0,应为52.0
springboot项目启动报错: 类文件具有错误的版本 61.0,应为52.0 请删除该文件或确保该文件位于正确的类路径子目录中 查阅了网上的很多资料,普遍原因说是springboot版本过高,高于3.0 需要在pom文件中降低版本 也有说是idea的maven配置java版…...
Linux 挂载局域网内共享目录
Linux 挂载局域网内共享目录 1、安装samba服务端2、samba服务端配置3、添加samba服务访问账户4、防火墙5、重启服务6、windows访问7、linux访问 1、安装samba服务端 sudo apt-get install -y samba yum install -y samba2、samba服务端配置 vim /etc/samba/smb.conf在文档尾部…...
FFmpeg解码32k大分辨率出现如下错误:Picture size 32768x32768 is invalid
最近找到一张32k的jpeg图片,尝试用ffmpeg来进行解码,命令如下: ffmpeg -i enflame_32768-32768-420.jpg 32.yuv结果出现Picture size 32768x32768 is invalid的错误: 找到报错的代码文件imgutils.c,以及函数&#x…...
EasyExcel+POI制作带有有效性校验及下拉联动的Excel模板
文章目录 1.背景2.实现功能的Excel特性2.1.特性介绍2.2.下拉框联动2.3.单元格自动匹配Id2.4.错误提示 3.代码实现3.1.基础流程代码3.2.名称管理器配置3.3.有效性配置3.4.函数填充3.5.其他补充 4.总结 1.背景 最近在做一个CRM系统的人员销售目标导入的相关需求,需要…...
Unity怎么制作魔法火焰特效?Unity制作魔法火焰特效方法
Unity制作魔法火焰特效方法: 在第一次玩Supergiant Games的RPG游戏《Hades》时,游戏的美术和视觉效果让人非常吃惊。受此启发,希望能够尝试制作类似风格的作品。 工作流程 整个工作从制作简单的火焰贴图开始。首先,我使用PhotoS…...