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

最新推荐文章于 2024-06-19 08:11:10 发布
最新推荐文章于 2024-06-19 08:11:10 发布
阅读量1k 收藏 1
点赞数 1
文章标签： 运维 后端 前端 ViewUI
原文链接：https://my.oschina.net/scoder/blog/635555
版权

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

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

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

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

proxy_set_header Host $http_host;

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

其实还是一知半解

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

weixin_34185320
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
通过dockerfile将nginx、前端和后端封装成一个镜像文章所需要的nginx压缩包
05-29
通过dockerfile将nginx、前端和后端封装成一个镜像文章所需要的nginx压缩包
使用nginx部署前端项目（超详细教程）.pdf
04-29
【使用Nginx部署前端项目】的教程是一个详尽的指南，主要面向初学者，旨在教会读者如何利用Nginx高效地部署前端应用。Nginx是一个高性能的Web服务器和反向代理，因其高并发处理能力和低内存占用而受到广泛青睐。 ...
nginx部署前端项目，把前端URL当成后台请求了
最新发布
城南蝈蝈
06-19 22
即3个规则，先从 $uri 查找，再从 $uri/ 目录中查找，最后查找 /index.html。id=3这个地址，nginx如果没有特别配置的话，nginx会将这个地址当作一个后台的get地址进行请求，而不会当成一个前台的url进行访问。用vue或者angular写了一个前端项目，本地正常运行，因为vue和angular都有自己的路由系统，我们访问页面时通过配置来确定是否使用’#’来表示前台路由信息。id=3 这个地址，nginx默认不进行解析，这时访问就正常。
nginx，wss 请求后端https 接口,使用 nginx 进行代理后端接口，如何配置不需要手动在浏览器输入后端接口
一天不写代码难受的博客
05-20 1450
2 将 yourdomain.com 替换为您的域名，将 /path/to/ssl/certificate 和 /path/to/ssl/private/key 替换为您的 SSL 证书和私钥的路径，将 https://yourbackendserver.com 替换为您的后端服务器的地址。通过上述配置，当您访问 https://yourdomain.com 时，Nginx 会将请求代理到您的后端服务器，并自动缓存 SSL 证书，无需手动在浏览器中输入后端接口。
关于nginx部署vue前端包访问后台同时出现前后端IP和端口的问题
ShadyCB的博客
10-28 2847
如题,在把vue打的包部署到nginx上后,出现了一个特别奇怪的问题, 没有任何报错,但是一点击index页面的登录按钮调用后台接口时,我看了下浏览器检查里面的请求地址,是访问前端的IP+端口/后端的Ip+端口,不知道如何解决,请各位大佬帮帮我!!! ...
经过nginx做数据转发源地址发生改变
weixin_39997897的博客
04-14 9054
我在做某项目的时候，需将18网段的各种网络设备syslog日志经过一个18网段的中转机发送给17网段的三台日志服务器，那台中转机我是利用nginx负载均衡的功能实现数据转发的，但是到达日志服务器的时候数据来源地址均变成了转发机的地址了，直接在nginx配置文件中加载一行配置就行了，做个透明代理，具体配置如下：       upstream syslog_1514 { serv...
nginx地址重写
hahaxixi131的博客
09-01 2241
文章目录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反向代理实现支持长连接详解
01-20
Nginx与前端的连接默认为长连接，一个用户跟Nginx建立连接之后，通过这个长连接发送多个请求。如果Nginx只是作为reverse proxy的话，可能一个用户连接就需要多个向后端的短连接。如果后端的服务器（源站或是缓存...
web服务器nginx+部署前端vue项目
03-22
1. 什么是 nginx 和可以做什么事情 Nginx 是高性能的 HTTP 和反向代理的web服务器，处理高并发能力是十分强大的，能经受高负 载的考验,有报告表明能支持高达 50,000 个并发连接数。 其特点是占有内存少，并发能力强...
nginx发布前端静态文件配置
02-17
在大多数Linux发行版中，可以通过包管理器来安装Nginx，例如在Ubuntu上使用`sudo apt-get install nginx`，在CentOS/RHEL上使用`sudo yum install nginx`。 2. **配置文件夹**： 静态文件通常存储在`/usr/share/...
【Nginx】使用Nginx将vue请求地址反向代理到后台服务真实地址
小朋友的博客
04-06 4084
使用Nginx将vue请求地址反向代理到后台服务真实地址
nginx处理前后端分离跨域问题
weixin_38846160的博客
07-23 5274
在微服务中，通常会使用前后端分离的方式进行开发和部署。由于前后端分开部署，属于不同的“资源”，因此前端调用后端API时可能会出现跨域问题，。这里，我们使用前后端分离的架构，使用nginx分别代理前端和后端微服务，分析和解决跨域问题。...
Nginx解决端口问题
风の记忆
02-01 2158
1.什么是Nginx? Nginx可以作为web服务器，更多的时候是作为网关，它具备： 反向代理 负载均衡 动态路由 请求过滤 2. Nginx于Zuul都可以作为网关有什么不同？(面试) Nginx是一个高性能的HTTP的反向代理服务器，也是IMAP/POP3/SMIP服务器。 Zuul是netfilx开源的API GateWay服务器，本质上是一个Web Servlet应用，它在云平台提...
Nginx反向代理解决Vue跨域问题
StoNENee的博客
04-04 7500
Nginx反向代理解决Vue跨域问题
nginx 页面刷新404 端口号变化
weixin_43899446的博客
10-14 723
在使用nginx时 页面都能正常访问 但刷新之后就404 查找原因是端口号变化 之前是正确的刷新之后就变成了 我监听的80端口 。修改方法如下 if (!-e $request_filename) { rewrite ^/(.*) /index.html last; break; } ...
通过配置nginx的反向代理，配置统一的后台访问链接
Cartel的专栏
04-22 1594
起因 前端应用程序通过axios，调用后端的服务。在vite中，通常会通过配置proxy来绑定服务的IP和端口号。同时，也可以修改它的相对地址。 举个例子说明一下： 在vite.config.js中，设置了如下的代码： server: { port: 7071, host: "0.0.0.0", open: true, proxy: { '/dev-api': { target: 'http://localhost:7070', changeOrigin: t
Nginx完美解决前后端分离端口号不同导致的跨域问题
qq_42702331的博客
07-20 5450
nginx跨域问题，前端请求后端接口状态码为0
nginx 代理后端的访问地址
蠢蠢欲动的猫
07-27 4923
nginx 代理后端的访问地址
vue项目与后端接口部署到同一域名
新一的博客
08-01 2755
Nginx配置两个地方就行： 先是配置好自己项目的服务,确保自己的项目能运行： location / { root /web/xiangmu/public; // 本地项目的路径 index index.html index.php; } 再是配置接口请求后端： location /api/ { proxy_pass http://192.168.1.1:8000;（后端接口
nginx 从前端把数据传到后端
06-06
一般情况下，Nginx 作为反向代理服务器，可以将前端请求转发给后端服务器进行处理，然后将处理结果返回给前端。在这个过程中，Nginx 可以使用 HTTP 协议或者其他协议与后端服务器进行通信。 具体地说，可以通过在 Nginx 配置文件中配置 upstream 服务器组，将多个后端服务器添加到这个组中。然后，可以在 location 配置项中使用 proxy_pass 指令将前端请求转发给这个服务器组。例如： ``` upstream backend { server backend1.example.com; server backend2.example.com; } location /api/ { proxy_pass http://backend; } ``` 这样，当前端请求 `/api/` 路径时，Nginx 将会将请求转发给 `backend` 服务器组中的某一个后端服务器进行处理，并将处理结果返回给前端。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值