1

I need to redirect my page to a maintenance page when I get errors 50x. It does redirect, except it won't load css, js or images. The error log is clean and the access log doesn't show any problem.

The following code was added to my nginx.conf.default file but I saw no changes:

location ~ \.css {
    add_header  Content-Type    text/css;
}

location ~ \.js {
    add_header  Content-Type    application/x-javascript;
}

My html file is in /home/user/Documents and my css/js/png files are in /home/user/Documents/maintenance_files folder. If I open the html file in a browser, it correctly fetches those files.

My mime types are in /opt/nginx/mime.types. Here is my nginx.conf file:

#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;
error_log   logs/error.log debug;

events {
    worker_connections  1024;
}

http {
    proxy_temp_path /home/user/work/nginx_files/proxy_tmpFiles 1 2;
    proxy_redirect off; # Tells the server we aren’t redirecting content. We actually do that later with proxy_pass.


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


    ##
    # Basic Settings
    ##

    sendfile on;
    keepalive_timeout 65;


    ##
    # Logging Settings
    ##

    #access_log /home/user/nginx_files/logs/access.log;

    ##
    # Gzip Settings
    ##

    gzip on;

    ##
    # Virtual Host Configs
    ##

    #include /etc/nginx/conf.d/*.conf;
    #include /etc/nginx/sites-enabled/*;

    include  /opt/nginx/mime.types;

    server {
        listen 80;
        server_name localhost; 

        #location ~ \.css {
        #    add_header  Content-Type    text/css;
        #}

        #location ~ \.js {
        #    add_header  Content-Type    application/x-javascript;
        #}

        error_page 500 502 503 504 /maintenance.html;
        location = /maintenance.html {
            #include  /opt/nginx/mime.types;

            root /home/user/Documents;
            #index maintenance.html;
            #internal; -> no changes
        }

        location / { 
            #include  /opt/nginx/mime.types;

            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;

            proxy_pass http://somelink; 
            #root /home/user/Documents;
            #index maintenance.html;
        }


    }
}

My problem is during the redirection when I get errors 50x, in this code. The html page is loaded but nginx won't load the images or css.

error_page 500 502 503 504 /maintenance.html;
location = /maintenance.html {
    #include  /opt/nginx/mime.types;

    root /home/user/Documents;
    #index maintenance.html;
    #internal; -> no changes
}

Thank you for your help.

  • 2
    what does the access log show? – Thiago Figueiro Feb 4 '16 at 11:35
  • Hi, it shows a lot of GET requests of css/js/images, no errors though – user3641702 Feb 4 '16 at 11:45
  • What's are the status code(s) returned for those requests? – gf_ Feb 4 '16 at 16:26
  • This morning I was getting code 200, now after some modifications (but with the same results) I'm getting code 502. – user3641702 Feb 4 '16 at 17:29
2

Your problem is that you are serving your static content off the backend app server. So when the backend app server can't respond because it's busy, Nginx prepares a 502 response. Your configuration directs Nginx to serve a particular HTML in that case, which in turns loads more static content from Nginx. Those requests are then proxied to the app server and 502s are also returned for them as well.

It's good idea to serve static content directly off of Nginx anyway, to simplify the backend server's job of focusing on serving the app.

Structure your Nginx configuration like this to have Nginx serve the static files:

  location / {
      try_files $uri $uri/ @backend;
    }

    location @backend {
      proxy_pass http://example.com;
    }
  • Like I said in a previous comment, I'm getting code 502 when fetching my files. I also noticed that the png files are being handled as text/html. What should I do now? – user3641702 Feb 4 '16 at 17:30
  • See updated answer. – Mark Stosberg Feb 4 '16 at 18:50
  • The point is that my location / code works fine. If I try to redirect directly to the html file inside location /, it works fine. The problem is when I try to catch the 50x errors.The maintenance page (ie the html file) is delivered but with no css or images, it's just a bland html page with no formatting or images. – user3641702 Feb 5 '16 at 10:24
  • My problem is still unsolved, could you please take a look at it again? – user3641702 Feb 23 '16 at 15:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.