nginx配置后访问出现白屏怎么办?

2024-06-12 22:28
文章标签 配置 访问 nginx 白屏

本文主要是介绍nginx配置后访问出现白屏怎么办?,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

问题

服务器上有两个web服务ab分别指向3000、3001两个端口,使用nginx进行反向代理,配置文件如下:

server {listen 80;server_name www.example.com;location /a/ {proxy_pass http://localhost:3000;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;}
}server {listen 80;server_name www.example.com;location /b/ {proxy_pass http://localhost:3001;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;}
}

配置好后,重载:sudo systemctl reload nginx
用浏览器访问:www.example.com/a/,浏览器是白屏,没有显示任何内容。

解决的思路:

1、查看日志:
`tail -n 10 /var/log/nginx/error.log`

显示内容如下:

[error] 1104804#1104804: *10 open()
“/usr/share/nginx/html/static/css/main.54631fc9.css” failed (2: No
such file or directory), client: 18.81.26.177, server:
www.example.com, request: “GET /static/css/main.54631fc9.css
HTTP/1.1”, host: “www.example.com”, referrer:
“http://www.example.com/a/”

2、分析

根据错误日志,Nginx正在尝试在/usr/share/nginx/html/static/css/目录下查找main.54631fc9.css文件,但是没有找到。这是因为我的web应用在/a路径下寻找静态文件,但是Nginx在默认的静态文件目录下查找。

3、查找
find / -name main.54631fc9.css

结果什么都没有找到

4、采用二级域名

配置文件调整如下:

server {listen 80;server_name a.example.com;location / {proxy_pass http://localhost:3000;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;}
}server {listen 80;server_name b.example.com;location / {proxy_pass http://localhost:3001;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;}
}

重载Nginx

在浏览器上b.example.com访问正常,但a.example.com显示Nginx的欢迎页面,并未访问到正确的web页面。

5、再查日志
`tail -n 10 /var/log/nginx/error.log`

显示内容如下:

[error] 1106994#1106994: *780 open()
“/usr/share/nginx/html/favicon.ico” failed (2: No such file or
directory), client: 18.81.26.177, server: example.com, request: “GET
/favicon.ico HTTP/1.1”, host: “a.example.com”, referrer:
“http://a.example.com/”

6、再分析

根据错误日志中的提示信息,可以看到请求的是/favicon.ico文件,但是在/usr/share/nginx/html/目录下找不到该文件。因此,与该错误相关的语句是代理到a.example.com的location块中的proxy_pass语句。这条语句将请求代理到localhost:3000,而不是/usr/share/nginx/html/目录下的文件。

7、再查找
find / -name favicon.ico

找到/favicon.ico文件在以下目录:

 /usr/local/src/a/web/berry/public/favicon.ico /usr/local/src/a/web/default/public/favicon.ico
8、添加多一个location
    location = /favicon.ico {alias /usr/local/src/a/web/berry/public/favicon.ico;}

a应用能正常访问了。

9、完整的配置文件
server {listen 80;server_name a.example.com;location = /favicon.ico {alias /usr/local/src/a/web/berry/public/favicon.ico;}location / {proxy_pass http://localhost:3000;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;}
}server {listen 80;server_name b.example.com;location / {proxy_pass http://localhost:3001;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;}
}
10、小结

nginx配置后遇到问题,查error.log是解决问题的关键,通过仔细分析里面的错误提示信息,不难找到解决的办法。
学习笔记,供后来者参考。

这篇关于nginx配置后访问出现白屏怎么办?的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1055511

相关文章

SpringCloud动态配置注解@RefreshScope与@Component的深度解析

《SpringCloud动态配置注解@RefreshScope与@Component的深度解析》在现代微服务架构中,动态配置管理是一个关键需求,本文将为大家介绍SpringCloud中相关的注解@Re... 目录引言1. @RefreshScope 的作用与原理1.1 什么是 @RefreshScope1.

SpringBoot日志配置SLF4J和Logback的方法实现

《SpringBoot日志配置SLF4J和Logback的方法实现》日志记录是不可或缺的一部分,本文主要介绍了SpringBoot日志配置SLF4J和Logback的方法实现,文中通过示例代码介绍的非... 目录一、前言二、案例一:初识日志三、案例二:使用Lombok输出日志四、案例三:配置Logback一

springboot security之前后端分离配置方式

《springbootsecurity之前后端分离配置方式》:本文主要介绍springbootsecurity之前后端分离配置方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的... 目录前言自定义配置认证失败自定义处理登录相关接口匿名访问前置文章总结前言spring boot secu

一文详解SpringBoot响应压缩功能的配置与优化

《一文详解SpringBoot响应压缩功能的配置与优化》SpringBoot的响应压缩功能基于智能协商机制,需同时满足很多条件,本文主要为大家详细介绍了SpringBoot响应压缩功能的配置与优化,需... 目录一、核心工作机制1.1 自动协商触发条件1.2 压缩处理流程二、配置方案详解2.1 基础YAML

springboot简单集成Security配置的教程

《springboot简单集成Security配置的教程》:本文主要介绍springboot简单集成Security配置的教程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,... 目录集成Security安全框架引入依赖编写配置类WebSecurityConfig(自定义资源权限规则

SpringBoot中封装Cors自动配置方式

《SpringBoot中封装Cors自动配置方式》:本文主要介绍SpringBoot中封装Cors自动配置方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录SpringBoot封装Cors自动配置背景实现步骤1. 创建 GlobalCorsProperties

Spring Boot结成MyBatis-Plus最全配置指南

《SpringBoot结成MyBatis-Plus最全配置指南》本文主要介绍了SpringBoot结成MyBatis-Plus最全配置指南,包括依赖引入、配置数据源、Mapper扫描、基本CRUD操... 目录前言详细操作一.创建项目并引入相关依赖二.配置数据源信息三.编写相关代码查zsRArly询数据库数

SpringBoot配置Ollama实现本地部署DeepSeek

《SpringBoot配置Ollama实现本地部署DeepSeek》本文主要介绍了在本地环境中使用Ollama配置DeepSeek模型,并在IntelliJIDEA中创建一个Sprin... 目录前言详细步骤一、本地配置DeepSeek二、SpringBoot项目调用本地DeepSeek前言随着人工智能技

如何自定义Nginx JSON日志格式配置

《如何自定义NginxJSON日志格式配置》Nginx作为最流行的Web服务器之一,其灵活的日志配置能力允许我们根据需求定制日志格式,本文将详细介绍如何配置Nginx以JSON格式记录访问日志,这种... 目录前言为什么选择jsON格式日志?配置步骤详解1. 安装Nginx服务2. 自定义JSON日志格式各

使用Python实现网络设备配置备份与恢复

《使用Python实现网络设备配置备份与恢复》网络设备配置备份与恢复在网络安全管理中起着至关重要的作用,本文为大家介绍了如何通过Python实现网络设备配置备份与恢复,需要的可以参考下... 目录一、网络设备配置备份与恢复的概念与重要性二、网络设备配置备份与恢复的分类三、python网络设备配置备份与恢复实