nginx port forwarding to port 80 from a running meteor app at port 3001

Question

I'm running an meteor app at port 3001 on my VPS, and would like to forward it to port 80. This is my vhost config:

server
    {
            listen 80;
            server_name meteor.myDomain.com;
            root  /home/wwwroot/meteor.myDomain.com/leaderboard;
            include typecho.conf;
            location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
                    {
                            expires      30d;
                    }

            location ~ .*\.(js|css)?$
                    {
                            expires      12h;
                    }

            location /example {
               proxy_pass http://127.0.0.1:3001;
               proxy_set_header Host $host:80;
               proxy_set_header X-Real-IP $remote_addr;
               proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
               proxy_set_header X-NginX-Proxy true;
           }
            access_log off;
    }

When i type "meteor.myDomain.com/example" in the browser i get this:

It looks like my port forwarding is successful, but i want to know why i get 404 with the request to the css and js files? And this two files reside in /example/programs/client.

When i type "meteor.myDomain.com/example:3001", everything works fine, so i think there must be something run with my config. Can anyone help? Thanks in advance.

Answer 1

Configuring nginx for meteor can be tricky because the root paths are different depending on the request URL (favicon vs bundled asset vs packaged asset).

Your root directive says something like:

/style.css can be found here: /home/wwwroot/meteor.myDomain.com/leaderboard/style.css

Which clearly isn't right (it's actually under bundle/programs/client). I recommend having a close look at my question and answer as well as the example gist. If you have any questions after that, I'll be happy to answer them.