首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

CDN 如何实现自定义错误页面?

CDN(Content Delivery Network)是一种全球性的分布式缓存系统,可以缓存用户请求的内容,并通过在全球范围内的多个网络节点,将数据快速地传输到客户端。在处理错误页面时,CDN 可以自定义错误页面,以展示更加友好、易于理解的提示信息,改善用户体验。

实现自定义错误页面主要通过下面几种方法:

  1. 自定义静态 HTML 页面

CDN 可以缓存静态 HTML 页面,并返回给客户端。当发生错误时,CDN 会返回自定义的错误页面,如:

代码语言:html
复制
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
   <title>Error</title>
   <style>
        body 

        h1 

        p 
    </style>
</head>
<body>
    <h1>Sorry, an error occurred.</h1>
    <p>Sorry, an error occurred.</p>
</body>
</html>
  1. 自定义 JavaScript 代码

CDN 也可以通过 JavaScript 代码来处理定制错误页面的逻辑。例如,在 PHP 应用程序中,可以使用 JavaScript 检测错误并提供自定义错误页面。具体实现方法如下:

代码语言:txt
复制
<!DOCTYPE html>
<html>
<head>
	<title>Error Page</title>
</head>
<body>
	<h1>Error Page</h1>
	<p id="errmsg"></p>
	<script>
        if (document.getElementById("errmsg") == null) 
	</script>
</body>
</html>

上面示例中,通过判断一个 ID 是 "errmsg" 的段落标签是否存在,实现自定义错误页面的逻辑。当错误发生时,系统会自动生成一个包含错误信息的字符串,将其转换为 HTML 代码并写入页面。当刷新页面时,会再次执行上面的代码,确保每次错误页面中的信息都是全新的。

  1. 配置 HTTP 错误代码

在 CDN 响应头中可以配置 HTTP 错误代码,如 404 Not Found,当返回该状态码时,CDN 可以自定义错误页面,以提供更好的用户体验。具体配置方法如下:

代码语言:txt
复制
<!DOCTYPE html>
<html>
<head>
	<title>Error Page</title>
</head>
<body>
	<h1>Error Page</h1>
	<p>对不起,找不到您所请求的资源。</p>
</body>
</html>

HTTP/1.1 404 Not Found

以上代码中,使用 HTTP 错误代码 404 Not Found 返回了一个自定义的错误页面。

在CDN 中实现自定义错误页面,需要结合 CDN 的配置、自定义静态 HTML 页面、定制 JavaScript 代码以及配置 HTTP 错误代码等方法来完成。在实际应用中,需要考虑不同场景下,如何设计和实现更符合逻辑、用户体验更好、更合理的自定义错误页面。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • 改善用户体验的404页面最佳实践

    无论一个网站设计得多好,时不时地,它可能会出现错误、漏洞和故障。此外,用户可能会输入错误的URL,或访问一个破碎的网站链接或页面,从而产生错误。当这种情况发生时,网站访问者会突然面对标准的 "404 "错误信息。404-错误信息表明,网站上的一个页面未能返回结果,不再存在。在搜索结果失败后遇到404错误网站信息的用户通常会被重定向到其他的网站页面。一个经过深思熟虑设计的定制404错误网站信息,其创意和轻松的细节可以区分出沮丧或有趣的用户。自定义404错误网站信息的原创和俏皮的设计细节会影响网站访问者的整体用户体验(UX)。自定义404错误信息的独特风格和信息传递也可能影响用户在未来返回您的网站的意愿。

    02

    改善用户体验的404页面最佳实践

    无论一个网站设计得多好,时不时地,它可能会出现错误、漏洞和故障。此外,用户可能会输入错误的URL,或访问一个破碎的网站链接或页面,从而产生错误。当这种情况发生时,网站访问者会突然面对标准的 "404 "错误信息。404-错误信息表明,网站上的一个页面未能返回结果,不再存在。在搜索结果失败后遇到404错误网站信息的用户通常会被重定向到其他的网站页面。一个经过深思熟虑设计的定制404错误网站信息,其创意和轻松的细节可以区分出沮丧或有趣的用户。自定义404错误网站信息的原创和俏皮的设计细节会影响网站访问者的整体用户体验(UX)。自定义404错误信息的独特风格和信息传递也可能影响用户在未来返回您的网站的意愿。

    02

    loadrunner 运行脚本-Run-time Settings-ContentCheck简单设置

    ContentCheck的设置可用来让VuGen检测存在错误的站点页面。如果被测的Web应用没有使用自定义的错误页面,那么这里不用添加规则,因为LR在回放时候,可以默认的捕捉到浏览返回的标准错误(如:404,500等等......),当遇到这些错误时LR将会出现错误提示;如果被测的Web应用使用了自定义的错误页面,那么这里需要定义,因为在实际中程序员经常会自定义一些错误信息在框架中(如:弹出错误提示"未知错误"等),这种错误信息LR是无法自动捕捉的,添加规则以便让VuGen在运行过程中检测,服务器返回的页面是否包含预定义的字符串,进而判断该页面是否为错误页面,。如果是,VuGen就停止运行,指示运行失败。

    01

    处理死链一「建议收藏」

    这也是许多网站使用自定义404错误页面的原因。通过良好的自定义404 页面,可以包含对网站的相应介绍、用户可能感兴趣的内容链接或者网站内容导航链接、内容搜索功能等,能够有效地帮助访问者找到其欲寻找的内容或相似的内容,提高用户在网站内浏览更多信息的机会。   正确定义404错误页面:   1. 对于已经存在的信息由于路径改变而导致访问不了时,应该在IIS 中定义404错误指向一个动态页面,在页面里面使用301 跳转到新的地址,此时服务器返回301状态码。   2. 当访问一个错误的链接时,将调用404页面,但由于在IIS 里面设置的不同将导致返回不同的状态码:   1. 404指向的是一个htm 文件,此时页面返回的404状态码,这是正确的。   2. 404指向的是一个URL,例如 /error.asp,如果不在页面里面进行设置,仅仅是返回提示的HTML 代码,将导致页面返回200 状态码,此时的危害在于,当很多页面找不到时,都返回和访问正常页面时返回一样的200状态码,将使搜索引擎认为该链接存在,并以错误页面的内容进行收录,当这样的链接很多时,将导致大量页面重复,使网站排名降低。处理方法:在显示完提示内容后,增加语句: Response.Status=”404 Not Found” ,这样就保证页面返回404状态码。   3. 避免在调用404 页面的时候返回302状态码,容易被搜索引擎认为是重定向作弊。   4. 检测方法,使用HttpWatch 查看返回代码。

    03

    ASP.NET web.config中<customErrors>节点说明

    customErrors>节点用于定义一些自定义错误信息的信息。此节点有Mode和defaultRedirect两个属性,其中defaultRedirect属性是一个可选属性,表示应用程序发生错误时重定向到的默认URL,如果没有指定该属性则显示一般性错误。Mode属性是一个必选属性,它有三个可能值,它们所代表的意义分别如下: Mode 说明 On 表示在本地和远程用户都会看到自定义错误页面。 Off 禁用自定义错误信息,本地和远程用户都会看到详细的错误信息。(默认) RemoteOnly 表示本地用户将看到详细错误信息,而远程用户将会看到自定义错误页面。 这里有必要说明一下本地用户和远程用户的概念。当我们访问asp.net应用程时所使用的机器和发布asp.net应用程序所使用的机器为同一台机器时成为本地用户,反之则称之为远程用户。在开发调试阶段为了便于查找错误Mode属性建议设置为Off,而在部署阶段应将Mode属性设置为On或者RemoteOnly,以避免这些详细的错误信息暴露了程序代码细节从而引来黑客的入侵。

    01
    领券