NGINX做前端，页面上的连接却变成后端地址

最新推荐文章于 2024-06-24 21:17:57 发布
转载 最新推荐文章于 2024-06-24 21:17:57 发布 · 1.1k 阅读 · 1 ·
CC 4.0 BY-SA版权
原文链接：https://my.oschina.net/scoder/blog/635555
文章标签：

#运维 #后端 #前端 #ViewUI

本文详细解析了Nginx配置中常见的一个问题：当配置好Nginx后，首页能够正常打开，但点击二级页面时，地址变为后端地址的原因及解决办法。主要介绍了如何正确设置向后端发起请求的主机头，确保反向代理正常工作。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

为什么80%的码农都做不了架构师？>>>   hot3.png

配置好Nginx之后，首页打开正常

再点击二级页面时，里边的地址变成了后端的地址

原因：没有设置向后端发起请求的主机

proxy_set_header Host $http_host;

Host的含义是表明请求的主机名，因为nginx作为反向代理使用，而如果后端真是的服务器设置有类似防盗链或者根据http请求头中的host字段来进行路由或判断功能的话，如果反向代理层的nginx不重写请求头中的host字段，将会导致请求失败。

其实还是一知半解

转载于:https://my.oschina.net/scoder/blog/635555

后端面试话术集锦第 七 篇：nginx面试话术
念兮为美
08-29 1004
后端面试话术集锦第7篇：nginx面试话术。介绍下nginx；nginx如何处理http请求；nginx常用命令；什么是动静分离，为什么要动静分离；如何保证nginx高可用；正向代理和反向代理的区别是什么；Nginx的master和worker是如何工作的；nginx中500、502、503、504有什么区别；Nginx压缩了解吗，如何开启压缩；Nginx和Apache、Tomcat之间的不同点； Nginx有哪些负载均衡策略；ngx_http_upstream_module模块了解；Nginx限流了解吗
作为一个后端开发你需要了解多少Nginx的知识？
标梵互动
01-28 626
（一）概述 最近做的一个项目在迁移公网环境的时候出了一个问题，明明服务都起来了，但是怎样都访问不进来。后来才发现是Nginx的配置出了问题。无奈自己关于Nginx的学习在大学毕业后就差不多遗忘了，当时又紧急找不到运维人员，差点就只能以失败结束迁移。 因此觉得就算是干后端开发，对于基本的nginx配置依旧需要有所了解，于是写了这篇后端人员应该懂的nginx文章，希望对大家有所帮助。 （二）Nginx入门 nginx是一个高性能的WEB服务器，Nginx可以实现正向代理、反向代理、负载均衡等功能。比如我现在正在
nginx部署前端项目，把前端URL当成后台请求了
城南蝈蝈
06-19 237
即3个规则，先从 $uri 查找，再从 $uri/ 目录中查找，最后查找 /index.html。id=3这个地址，nginx如果没有特别配置的话，nginx会将这个地址当作一个后台的get地址进行请求，而不会当成一个前台的url进行访问。用vue或者angular写了一个前端项目，本地正常运行，因为vue和angular都有自己的路由系统，我们访问页面时通过配置来确定是否使用’#’来表示前台路由信息。id=3 这个地址，nginx默认不进行解析，这时访问就正常。
关于nginx部署vue前端包访问后台同时出现前后端IP和端口的问题
ShadyCB的博客
10-28 2940
如题,在把vue打的包部署到nginx上后,出现了一个特别奇怪的问题, 没有任何报错,但是一点击index页面的登录按钮调用后台接口时,我看了下浏览器检查里面的请求地址,是访问前端的IP+端口/后端的Ip+端口,不知道如何解决,请各位大佬帮帮我!!! ...
nginx，wss 请求后端https 接口,使用 nginx 进行代理后端接口，如何配置不需要手动在浏览器输入后端接口
一天不写代码难受的博客
05-20 1680
2 将 yourdomain.com 替换为您的域名，将 /path/to/ssl/certificate 和 /path/to/ssl/private/key 替换为您的 SSL 证书和私钥的路径，将 https://yourbackendserver.com 替换为您的后端服务器的地址。通过上述配置，当您访问 https://yourdomain.com 时，Nginx 会将请求代理到您的后端服务器，并自动缓存 SSL 证书，无需手动在浏览器中输入后端接口。
Nginx做代理时X-Forwarded-For信息头的处理
weixin_30443813的博客
10-27 981
如今利用nginx做负载均衡的实例已经很多了，针对不同的应用场合，还有很多需要注意的地方，本文要说的就是在通过CDN 后到达nginx做负载均衡时请求头中的X-Forwarded-For项到底发生了什么变化。下图为简单的web架构图： 先来看一下X-Forwarded-For的定义：X-Forwarded-For:简称XFF头，它代表客户端，也就是HTT...
经过nginx做数据转发源地址发生改变
weixin_39997897的博客
04-14 9334
我在做某项目的时候，需将18网段的各种网络设备syslog日志经过一个18网段的中转机发送给17网段的三台日志服务器，那台中转机我是利用nginx负载均衡的功能实现数据转发的，但是到达日志服务器的时候数据来源地址均变成了转发机的地址了，直接在nginx配置文件中加载一行配置就行了，做个透明代理，具体配置如下：       upstream syslog_1514 { serv...
【后端】Nginx+lua+OpenResty高性能实践
qq_26127905的博客
06-24 968
证书可以明确的记录证书颁发机构的信息，证书使用者的相。关信息，从而接受者接收到证书，对证书信息通过公钥进行。可以对身份进行验证，密钥对存在漏洞，黑客可以伪装。第三方证书，证书通过加密算法对内容进行加密，并且。为发送者，生成密钥对，发送给接受者。验证，能够识别真实的发布者身份。指定加密后的文件的存放位置。自动插入一个随机数到文件中。指定要加密的文件的路径。# 根据生成对应公钥。
yum安装nginx，并部署前端vue项目到虚拟机上运行
weixin_44728473的博客
07-06 1566
yum安装nginx，并部署前端vue项目到虚拟机上运行 1.搜索一下有没有nginx，命令如下 yum search nginx2.查询nginx要安装的版本，命令如下 whereis nginx3.安装nginx，命令如下 yum install nginx.x86_644.移除nginx，命令如下 yum remove nginx5.打开目录，命令如下 cd /usr/sbin 6.启动，命令如下 ./nginx7.查看nginx进程，命令如下 ps -aux |grep nginx .......
Nginx 转发匹配规则，后端程序员必备知识点
Java_zhujia的博客
11-14 1035
后端开发是一个最接近全栈的一个职业，前端不够用后端顶上写页面JS，没有运维不要紧后端来维护服务器，总之一个好的后端就是能面面俱到。
nginx地址重写
hahaxixi131的博客
09-01 2515
文章目录nginx地址重写要求实现方案：实现步骤：1.修改配置文件（访问a.html重定向到b.html）第二种跳转(地址栏发生变化)2.修改配置文件（访问192.168.19.100的请求重定向到www.tmooc.cn）3.访问192.168.19.100/的请求重定向到www.tmooc.cn/下相同的页面4.实现浏览器与curl访问相同的页面文件，看到不同的内容总结： nginx地址重写 地址重写（地址栏被重写） 例： www.360buy.com(京东之前的域名)-------->www.j
nginx作为代理 后端服务器ip问题
企鹅漫步
05-13 3724
由于采用nginx+nginx的方式，导致后端
【Nginx】使用Nginx将vue请求地址反向代理到后台服务真实地址
小朋友的博客
04-06 4898
使用Nginx将vue请求地址反向代理到后台服务真实地址
nginx处理前后端分离跨域问题
weixin_38846160的博客
07-23 5703
在微服务中，通常会使用前后端分离的方式进行开发和部署。由于前后端分开部署，属于不同的“资源”，因此前端调用后端API时可能会出现跨域问题，。这里，我们使用前后端分离的架构，使用nginx分别代理前端和后端微服务，分析和解决跨域问题。...
Nginx解决端口问题
风の记忆
02-01 2280
1.什么是Nginx? Nginx可以作为web服务器，更多的时候是作为网关，它具备： 反向代理 负载均衡 动态路由 请求过滤 2. Nginx于Zuul都可以作为网关有什么不同？(面试) Nginx是一个高性能的HTTP的反向代理服务器，也是IMAP/POP3/SMIP服务器。 Zuul是netfilx开源的API GateWay服务器，本质上是一个Web Servlet应用，它在云平台提...
使用nginx后如何在web应用中获取用户ip及原理解释
臻心依旧
08-28 2512
http://gong1208.iteye.com/blog/1559835   使用nginx后如何在web应用中获取用户ip及原理解释                                                                                                  -------gongyong   问题背景： 在实际
nginx代理的域名对应的ip更换后还解析到之前的ip
东方神龙马的博客
11-04 5434
问题 使用nginx做反向代理，将请求发送到一个域名(例如: proxy_pass http://www.test.com 该域名对应的IP是A) ，刚开始运行一切正常，但是当运行了一段时间以后，域名对应的IP变了(例如http://www.test.com对应的IP由A变为B)，nginx的转发仍然还在向原先的IP发送请求，导致业务中断，此时reload nginx后才会重新恢复正常，且日志显示数据转发到新的IP B了，请问如何让nginx自动去重新解析域名，而不用每次出现问题了人工去reload？
Nginx反向代理解决Vue跨域问题
StoNENee的博客
04-04 7805
Nginx反向代理解决Vue跨域问题
nginx 页面刷新404 端口号变化
weixin_43899446的博客
10-14 848
在使用nginx时 页面都能正常访问 但刷新之后就404 查找原因是端口号变化 之前是正确的刷新之后就变成了 我监听的80端口 。修改方法如下 if (!-e $request_filename) { rewrite ^/(.*) /index.html last; break; } ...
有jar包，数据库、数据库连接地址：192.168.191.128:3306/io、前台页面，怎么实现容器化部署
最新发布
07-04
这样，前端页面由Nginx服务提供，而后端API请求被代理到app服务。 根据实际需求选择方案。 由于问题中没有明确前端的部署方式，我们假设前端已经包含在Java应用中（即JAR包中包含了静态资源），因此不需要额外...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值