CODEWITHSUNDEEP
javascriptnginxmeteor
Peter Nunn
Peter Nunn

Reputation: 2302

Meteor app deplayed with mup, behind nginx not displaying

I'm trying to get an app deployed to my own server with mup to work behind nginx so that I can direct port 80 with a route to be the app (other things running on there on the default page).

The app is running fine on http://hostname:3080 but when I try http://hostname/dashboard I get a blank page. The odd thing is that the page sources in both cases are exactly the same and look as though the page should load.

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" type="text/css" class="__meteor-css__" href="/8794b5f3e7ececaa1db27feee7ff3db2d00e9dcb.css?meteor_css_resource=true">


<script type="text/javascript">__meteor_runtime_config__ = JSON.parse(decodeURIComponent("%7B%22meteorRelease%22%3A%22METEOR%401.1.0.2%22%2C%22PUBLIC_SETTINGS%22%3A%7B%7D%2C%22ROOT_URL%22%3A%22http%3A%2F%2Fhostname%22%2C%22ROOT_URL_PATH_PREFIX%22%3A%22%22%2C%22accountsConfigCalled%22%3Atrue%2C%22autoupdateVersion%22%3A%224455357f08556a49e92dd81d31c4c19d9a2204f6%22%2C%22autoupdateVersionRefreshable%22%3A%22caae7981cd6ec189870ba445ac392be58af0b0ab%22%2C%22autoupdateVersionCordova%22%3A%22none%22%7D"));</script>

  <script type="text/javascript" src="/c97b1ea7dc444b12e68fdb14f80afc8a0374c861.js"></script>




</head>
<body>

</body>
</html>

My nginx config is as follows (I'm only testing the http part at the moment, but the https bit returned the self signed certs OK, and again had the same page source.

server_tokens off; # for security-by-obscurity: stop displaying nginx version

# this section is needed to proxy web-socket connections
map $http_upgrade $connection_upgrade {
    default upgrade;
    ''      close;
}

upstream dashboard {
        server 127.0.0.1:3080;
}

# HTTP
server {
    listen 80 default_server; # if this is not a default server, remove "default_server"
    listen [::]:80 default_server;

    root /usr/share/nginx/html; # root is irrelevant
    index index.php index.html index.htm; # this is also irrelevant

    server_name hostname; # the domain on which we want to host the application. Since we set "default_server" previously, nginx will answer all hosts anyway.
    access_log /var/log/nginx/dashboard.access;
    # redirect non-SSL to SSL
    location /dashboard/ {
        #proxy_pass http://127.0.0.1:3080;
        #proxy_pass http://hostname:3080;
        proxy_pass http://dashboard/;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection $connection_upgrade;
        proxy_set_header X-Forward-For $remote_addr;
        proxy_set_header Host $host;

        proxy_set_header X-Real-IP $remote_addr;
        #proxy_set_header X-Forward-For $proxy_add_x_forwarded_for;
        #proxy_set_header X-Forward-Proto http;
        #proxy_set_header X-Nginx-Proxy true;

        #proxy_redirect off;

        #rewrite     ^ https://$server_name$request_uri? permanent;
    }
}

# HTTPS server
server {
    listen 443 ssl spdy; # we enable SPDY here
    server_name hostname; # this domain must match Common Name (CN) in the SSL certificate

    #root html; # irrelevant
    #index index.html; # irrelevant

    ssl_certificate /etc/nginx/ssl/dashboard.crt;
    ssl_certificate_key /etc/nginx/ssl/dashboard.key;

    # performance enhancement for SSL
    ssl_stapling on;
    ssl_session_cache shared:SSL:10m;
    ssl_session_timeout 5m;

    # safety enhancement to SSL: make sure we actually use a safe cipher
    ssl_prefer_server_ciphers on;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers 'ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-AES256-GCM-SHA384:kEDH+AESGCM:ECDHE-RSA-AES128-SHA256:ECDHE-ECDSA-AES128-SHA256:ECDHE-RSA-AES128-SHA:ECDHE-ECDSA-AES128-SHA:ECDHE-RSA-AES256-SHA384:ECDHE-ECDSA-AES256-SHA384:ECDHE-RSA-AES256-SHA:ECDHE-ECDSA-AES256-SHA:DHE-RSA-AES128-SHA256:DHE-RSA-AES128-SHA:DHE-RSA-AES256-SHA256:DHE-DSS-AES256-SHA:AES128-GCM-SHA256:AES256-GCM-SHA384:ECDHE-RSA-RC4-SHA:ECDHE-ECDSA-RC4-SHA:RC4-SHA:HIGH:!aNULL:!eNULL:!EXPORT:!DES:!3DES:!MD5:!PSK';

    # config to enable HSTS(HTTP Strict Transport Security) https://developer.mozilla.org/en-US/docs/Security/HTTP_Strict_Transport_Security
    # to avoid ssl stripping https://en.wikipedia.org/wiki/SSL_stripping#SSL_stripping
    add_header Strict-Transport-Security "max-age=31536000;";

    # If your application is not compatible with IE <= 10, this will redirect visitors to a page advising a browser update
    # This works because IE 11 does not present itself as MSIE anymore
    if ($http_user_agent ~ "MSIE" ) {
        return 303 https://browser-update.org/update.html;
    }

    # pass all requests to Meteor
    location /dashboard/ {
        proxy_pass http://127.0.0.1:3080;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade; # allow websockets
        proxy_set_header Connection $connection_upgrade;
        proxy_set_header X-Forwarded-For $remote_addr; # preserve client IP

        # this setting allows the browser to cache the application in a way compatible with Meteor
        # on every applicaiton update the name of CSS and JS file is different, so they can be cache infinitely (here: 30 days)
        # the root path (/) MUST NOT be cached
        if ($uri != '/') {
            expires 30d;
        }
    }
}

Where hostname is replaced by my actual host name.

The access log files seem to say its getting the code OK, but there are some odd 404's in there that I'm not sure about.

150.xxx.xxx.xx - - [29/May/2015:14:24:14 +1000] "GET /8794b5f3e7ececaa1db27feee7ff3db2d00e9dcb.css?meteor_css_resource=true HTTP/1.1" 404 136 "http://hostname/dashboard/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.10; rv:38.0) Gecko/20100101 Firefox/38.0"
150.xxx.xxx.xx - - [29/May/2015:14:24:14 +1000] "GET /c97b1ea7dc444b12e68fdb14f80afc8a0374c861.js HTTP/1.1" 404 136 "http://hostname/dashboard/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10.10; rv:38.0) Gecko/20100101 Firefox/38.0"

Any ideas where to go from here?

Upvotes: 0

Views: 372

Answers (1)

ziggrat
ziggrat

Reputation: 116

Your nginx conf seems right except for one small thing, if you want the app to run on http://hostname/dashboard you should do something like this.

# HTTP
server {
    listen 80 default_server; # if this is not a default server, remove "default_server"
    listen [::]:80 default_server;

    root /usr/share/nginx/html; # root is irrelevant
    index index.php index.html index.htm; # this is also irrelevant

    server_name hostname; # the domain on which we want to host the application. Since we set "default_server" previously, nginx will answer all hosts anyway.
    access_log /var/log/nginx/dashboard.access;
    # redirect non-SSL to SSL
    location /dashboard {
        proxy_pass http://127.0.0.1:3080;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Host $host;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
    }

So there is no need for upstream, also make sure the ROOT_URL parameter that is passed to meteor when running it is http://hostname/dashboard and PORT is 3080 which I believe is already the case since you have meteor app working on //hostname:3080

Upvotes: 1

Related Questions