Nginx - 使用error_page实现带有图片的自定义错误页面

文章目录

  • 概述
  • 官网文档
  • 需求
  • 实现

在这里插入图片描述


概述

在Nginx中,您可以使用error_page指令来指定当请求遇到特定错误时应当显示的自定义错误页面。为了实现带有图片的自定义错误页面,可以按照以下步骤操作:

  1. 创建错误页面
    首先,需要创建一个HTML文件作为错误页面。在这个文件中,可以定义需要的图片、样式和任何其他内容。例如,如果您想要在404错误页面显示一张图片,可以创建一个名为404.html的文件,并在其中使用<img>标签来引用图片。
  2. 配置Nginx
    在Nginx配置文件中(通常是nginx.conf或一个包含特定站点配置的文件),您需要添加一个server块来定义错误处理。例如:
    server {listen 80;server_name example.com;location / {# 其他正常的处理逻辑}# 错误处理error_page 404 /404.html;error_page 500 /500.html;
    }
    
    在这个例子中,当服务器收到404(未找到)或500(服务器内部错误)状态码的请求时,它会显示对应的错误页面。
  3. 确保图片可访问
    确保在错误页面中引用的图片是可访问的,并且位于正确的路径。如果图片存储在某个特定的目录下,需要确保在Nginx配置中正确地设置静态资源的路径。
  4. 测试错误页面
    在配置完成后,可以测试一下错误页面是否按预期工作。您可以通过访问一个不存在的URL(例如http://example.com/asdf)来触发404错误,并检查是否显示了自定义的404页面。

官网文档

https://nginx.org/en/docs/http/ngx_http_core_module.html#error_page

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

看看重点哈

Syntax:	error_page code ... [=[response]] uri;
Default:Context:	http, server, location, if in location
  1. 理解error_page指令:

    • error_page指令用于定义在出现特定HTTP错误时要显示的页面或重定向到的URL。它允许您自定义错误处理行为。
  2. 基本语法:

    • 简洁语法如下:
      error_page code [reason] uri;
      
    • 其中,code是HTTP错误代码,uri是要显示或重定向到的页面或URL。
    • Context: http, server, location, if in location
  3. 示例配置:

    • 简单示例,将404错误重定向到自定义404页面:
      error_page 404 /404.html;
      
    • 如果要指定外部URL,可以这样写:
      error_page 500 http://example.com/error500.html;
      
  4. 多个错误处理:

    • 可以为多个错误代码指定相同的处理方式,例如:
      error_page 404 /404.html;
      error_page 500 502 503 504 /5xx.html;
      
  5. 全局错误处理:

    • http块中定义的error_page指令可用于处理所有虚拟主机的错误。

需求

实现一个自定义错误页面,页面中有个图片展示

实现

大致结构如下

server {listen 80;server_name your_domain.com;error_page 404 /error/custom_404.html;location = /custom_404.html {alias  /path/to/your/site; }# 其他配置...
}

真实案例如下 :

开启自定义页面

在这里插入图片描述


同时配置 /errorlocation

转发到 /error/xxxx , 故下面需要配置个location

在这里插入图片描述

注意alias


将图片资源和静态HTML置于 Nginx的 html目录下

在这里插入图片描述

静态页面 (demo)

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><div align="center"><img src="error/404.png"></div></body>
</html>

注意 error/404.png

在这里插入图片描述


效果如下

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/231608.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何选择最适合的采购付款 (P2P) 解决方案?

无论企业的业务流程执行得如何&#xff0c;流程中始终存在改进空间。更好的管理系统是获得更好结果的关键&#xff0c;尤其是当企业处于增长阶段时。强大的采购到付款&#xff08;P2P&#xff09;系统是加快采购流程&#xff0c;同时保持采购支出可见性的最有效方法之一。 什么…

python实现给定两个列表,“求同存异”

目录 问题描述&#xff1a; 代码实现&#xff1a; 问题描述&#xff1a; 给定两个列表&#xff0c;list1和list2。 python实现求list1和list中重复的元素&#xff0c;以及在list1中&#xff0c;不在list2的元素。 代码实现&#xff1a; def common_unique(pred_list, gold_l…

【信息论与编码】习题-单选题

目录 单选题1.下列说法正确的是&#xff08;B&#xff09;2.在信息论中&#xff0c;若用对数底2为&#xff0c;则信息量的单位为&#xff08;C&#xff09;3.率失真函数的下限为&#xff08;A&#xff09;4.给定xi条件下随机事件yj所包含的不确定度和条件自信息量p(yj /xi)。&a…

启动 Mac 时显示闪烁的问号

启动 Mac 时显示闪烁的问号 如果启动时在 Mac 屏幕上看到闪烁的问号&#xff0c;这意味着你的 Mac 无法找到自身的系统软件。 如果 Mac 启动时出现闪烁的问号且无法继续启动&#xff0c;请尝试以下步骤。 1.通过按住其电源按钮几秒钟来关闭 Mac。 2.按一下电源按钮&#xf…

爬虫与反爬-localStorage指纹(某易某盾滑块指纹检测)(Hook案例)

概述&#xff1a;本文将用于了解爬虫中localStorage的检测原理以及讲述一个用于检测localStorage的反爬虫案例&#xff0c;最后对该参数进行Hook断点定位 目录&#xff1a; 一、LocalStorage 二、爬虫中localStorage的案例&#xff08;以某盾滑块为例&#xff09; 三、如何…

Linux ssh 实现远程免密登录

一、背景 我搭建了一个 zookeeper 集群&#xff0c;写了一个 shell 脚本来控制集群的启动和关闭&#xff0c;但是我发现每次我执行 shell 脚本的时候&#xff0c;都需要我输入各个服务器的密码才可以运行&#xff0c;感觉很麻烦。shell 脚本里面连接其他服务器用的就是 ssh 的方…

RocketMQ MQClientInstance、生产者实例启动源码分析

&#x1f52d; 嗨&#xff0c;您好 &#x1f44b; 我是 vnjohn&#xff0c;在互联网企业担任 Java 开发&#xff0c;CSDN 优质创作者 &#x1f4d6; 推荐专栏&#xff1a;Spring、MySQL、Nacos、Java&#xff0c;后续其他专栏会持续优化更新迭代 &#x1f332;文章所在专栏&…

JVM篇:直接内存

直接内存 直接内存并不是JVM的内存结构&#xff0c;直接内存是操作系统的内存&#xff0c;Java本身并不能对操作系统的内存进行操作&#xff0c;而是通过调用本地方法。直接内存常用于NIO作为缓冲区存在&#xff0c;分配成本较高但是读写性能好&#xff0c;并且不受JVM内存回收…

有网友希望我推荐几个创建产品手册工具,这不就来了!

上次我有说到&#xff0c;企业应该充分认识到产品手册的重要性&#xff0c;并采取有效的策略和措施来制作和传播高质量的产品手册&#xff0c;以提升品牌知名度和市场份额。后台有网友问我除了设计排版的那种产品手册工具&#xff0c;还有什么方式可以去做产品手册。今天就介绍…

Verifiable Credentials可验证证书 2023 终极指南

1. 引言 Dock公司为去中心化数字身份领域的先驱者&#xff0c;其自2017年以来&#xff0c;已知专注于构建前沿的可验证证书&#xff08;Verifiable Credentials&#xff09;技术。本文将阐述何为电子证书、电子证书工作原理、以及其对组合和个人的重要性。 伪造实物证书和数字…

​结构体数组

1. 结构体的声明 1.1 结构体的基础知识 结构是一些值的集合&#xff0c;这些值被称为成员变量。结构的每个成员可以是不同类型的变量。 1.2 结构的声明 struct tag {member - list; }variable-list; 例&#xff1a;描述一个人的信息&#xff1a;名字电话性别身高 //声明的…

05、Kafka ------ CMAK 各个功能的作用解释(主题和分区 详解,用命令行和图形界面创建主题和查看主题)

目录 CMAK 各个功能的作用解释&#xff08;主题&#xff09;★ 主题★ 分区★ 创建主题&#xff1a;★ 列出和查看主题 CMAK 各个功能的作用解释&#xff08;主题&#xff09; ★ 主题 Kafka 主题虽然也叫 topic&#xff0c;但它和 Pub-Sub 消息模型中 topic 主题及 AMQP 的 t…

基于多反应堆的高并发服务器【C/C++/Reactor】(中)创建一个TcpConnection实例 以及 接收客户端数据

#CSDN 年度征文&#xff5c;回顾 2023&#xff0c;赢专属铭牌等定制奖品# 一、主线程反应堆模型的事件添加和处理详解 >>服务器和客户端建立连接和通信流程&#xff1a; 基于多反应堆模型的服务器结构图&#xff0c;这主要是一个TcpServer&#xff0c;关于HttpServer,…

4个原创技术文档,从Excel到MySQL到Python

2023马上就要结束了&#xff0c;回首这一年的工作和努力&#xff0c;我感到非常欣慰和自豪。在这段时间里&#xff0c;我专注于撰写原创技术文档&#xff0c;致力于为大家提供有价值的内容。 这四篇原创技术文档是我精心编写的&#xff0c;每一篇都经过了深入研究和详尽的实践…

HTML5大作业-精致版个人博客空间模板源码

文章目录 1.设计来源1.1 博客主页界面1.2 博主信息界面1.3 我的文章界面1.4 我的相册界面1.5 我的工具界面1.6 我的源码界面1.7 我的日记界面1.8 我的留言板界面1.9 联系博主界面 2.演示效果和结构及源码2.1 效果演示2.2 目录结构2.3 源代码 源码下载 作者&#xff1a;xcLeigh …

普中STM32-PZ6806L开发板(HAL库函数实现-按键扫描)

简介 实现按键扫描, 实现四个按键按下控制灯的亮灭 电路原理图 按键电路原理图 按键与主芯片引脚原理图 其他知识 原理图分析 Key_UP按下会有高电平输入, 所以电路设置应该是默认低电平, 初始化为下拉输入 Key_Left/Right/Down按下会有低电平&#xff0c; 初始化为下拉输…

相机同步遇到的小问题

出现问题 在进行两个相机显示的时候&#xff0c;出现了相机显示不同步的情况&#xff0c;具体情况如下视频所示&#xff1a; 华睿/大华相机左右相机显示不同步 可以见到视频之中&#xff0c;右相机是比左相机更快一点的&#xff0c;但是有的时候就是同步的。我调用的代码是现成…

最新GPT4.0使用教程,AI绘画,ChatFile文档对话总结+GPT语音对话使用,DALL-E3文生图

一、前言 ChatGPT3.5、GPT4.0、GPT语音对话、Midjourney绘画&#xff0c;文档对话总结DALL-E3文生图&#xff0c;相信对大家应该不感到陌生吧&#xff1f;简单来说&#xff0c;GPT-4技术比之前的GPT-3.5相对来说更加智能&#xff0c;会根据用户的要求生成多种内容甚至也可以和…

亚信安慧AntDB数据库:企业核心业务系统数据库升级改造的可靠之选

在近期召开的“2023年国有企业应用场景发布会”上&#xff0c;亚信安慧公司的核心数据库产品AntDB闪耀登场&#xff0c;技术总监北陌先生针对企业核心业务系统数据库升级改造的关键议题发表了深度分享。他从研发、工程实施和运维管理三个维度细致剖析了当前企业在进行数据库升级…

Linux系统安装MySQL

Linux系统安装MySQL 第一步&#xff1a;下载YUM wget http://dev.mysql.com/get/mysql57-community-release-el7-11.noarch.rpm第二步&#xff1a;安装MySQL的YUM 仓库 rpm -ivh mysql57-community-release-el7-11.noarch.rpm第三步&#xff1a;查看MySQL版本 yum repolist …