nginx自定義錯誤頁面的CSS不應用

新的nginx和我試圖建立一個自定義維護頁面使用503代碼。我可以讓頁面顯示，但我錯過了一些東西，而且CSS沒有被應用。當我把它看作傳統的網頁時，它就起作用了。我錯過了什麼？ CONFIGS如下：nginx自定義錯誤頁面的CSS不應用

nginx.conf

user nginx; 
worker_processes 4; 

error_log /var/log/nginx/error.log info; 
pid  /var/run/nginx.pid; 


events { 
    worker_connections 1024; 
} 


http { 
    server_names_hash_bucket_size 128; 

    # Set the max size for file uploads to 50Mb 
    client_max_body_size 50M; 

    include  /etc/nginx/mime.types; 
    default_type application/octet-stream; 

    log_format main '$remote_addr - $remote_user [$time_local] "$request" ' 
         '$status $body_bytes_sent "$http_referer" ' 
         '"$http_user_agent" "$http_x_forwarded_for"'; 

    access_log /var/log/nginx/access.log main; 

    #sendfile  on; 
    #tcp_nopush  on; 

    keepalive_timeout 65; 

    #gzip on; 
    underscores_in_headers on; 
    include /etc/nginx/conf.d/*.conf; 
}

blah.conf

server { 
     listen  80; 

     root /var/www/blah-maintenance; 
     error_page 503 /503.html; 

     location/{ 
       return 503; 
     } 

     location /503.html { 
       internal; 
     } 

}

503.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html;charset=utf-8"> 
    <link rel="stylesheet" type="text/css" href="/maint.css" /> 
</head> 
<body> 

     <div class="container"> 

       <h1>SYSTEM IS CURRENTLY UNDERGOING MAINTENANCE</h1> 

       <p class="blah">blah and blah-blah currently undergoing <b><u><font color="red">maintenance</font></u></b>. 

       <P class="blah">The system/s will be available as soon as possible. Please check back later. 

       <p class="blah">Thanks - 

     </div> 

</body>

maint.css

/* CSS Document*/ 
/*Define the body element's color*/ 

body { 
     background: white url(black-floor-blah-wallpaper.jpg) no-repeat; 
     background-postion: center center; 
} 

h1 { 
     text-align:center; 
     font-size: 32pt; 
     color: White; 
     font-family: Helvetica, Geneva, Arial, 
     SunSans-Regular, sans-serif 
} 

/*This section is for links*/ 

a:link { 
     font-weight:normal; 
     color:Red 
} 

a:visited { 
     font-weight:normal; 
     color:Silver; 
} 

a:hover { 
     font-weight:bold; 
     color: White; 
     font-variant:small-caps; 
} 

/*This section is for a paragraph section*/ 

div.container { 
       display: tabel-cell; 
       vertical-align: middle; 
       postion: absolute; 
       top: 50%; 
       width: 100%; 
} 

p.blah { 
     text-align:center; 
     font-style:italic; 
     font-size:18px; 
     color: White; 
} 

blue { 
     color:#0000FF; 
} 

/*This section is for the image's black border.*/ 

img { 
     border-color: #000000; 
     border:thick; 
     border-style:ridge;`enter code here` 
}

來源

2014-02-18 J. Caldwell

瀏覽器對maint.css的請求有可能被nginx攔截，並通過維護頁面進行響應。您可以通過拉起WebKit Inspector，Firebug或類似工具並檢查網絡選項卡上的流量來驗證此情況。 /maint.css的響應應該返回CSS內容。如果它被攔截，你會看到你的維護頁面。

我通常爲維護頁面內聯樣式和資產，或將整個請求重定向到不同的非維護區域以提供靜態資產。您也可以爲/maint.css編寫重定向規則，但這種規則可以很快擴散。（「等等，我們也需要這些圖像，哦，我們也需要這些腳本......」）

來源

2014-02-18 21:23:41 Palpatim

nginx自定義錯誤頁面的CSS不應用

回答

相關問題