skip to Main Content

My localhost running on http://localhost:8080. Now, I have a requirement like this, whenever I type http://www.mywebsite.com, it should load my localhost and if I type https://www.mywebsite.com, it should load the live website.

To achieve this I tried the hosts(/etc/hosts) file and Nginx but it also stops loading the live website in my system.

Host file content:

127.0.0.1 www.mywebsite.com

nginx config

server {
  listen    80;
  server_name  www.mywebsite.com;
  location / {
    proxy_pass http://127.0.0.1:8080;
  }
}

6

Answers


  1. Completely agree with the other answers, mapping from nginx on a remote host to your localhost can be difficult unless you know the public IP address of your local machine, ideally it should be static.

    Alternatives

    I would encourage giving a try to some proxy tools that can be installed on your local machine, i.e. Charles Proxy and its Map Remote feature.

    Once installed, follow these steps:

    1. Install and trust the root certificate Help -> SSL Proxying -> Install Charles Root Certificate
    2. Enable Map Remote feature Tools -> Map Remote -> [x] Enable Map Remote
    3. Add a new rule, e.g. http://www.mywebsite.com -> http://localhost:8080

    Now you’re ready to test:

    1. Navigate to http://www.mywebsite.com (you should see results from your localhost, proxy took over)
    2. Navigate to https://www.mywebsite.com (you should see results from your remote server)
    Map Remote – Rule Map Remote – Result
    Map Remote - Rule Map Remote - Results
    Login or Signup to reply.
  2. You can do this by redirecting HTTP connections on your live site to localhost. First remove the record you have in your hosts file.
    Then add the following to your live site’s nginx.conf.

    server {
      listen    80;
      server_name  www.mywebsite.com;
      location / {
        # change this to your development machine's IP
        if ($remote_addr = 1.2.3.4) {
          rewrite ^ http://127.0.0.1:8080;
        }
      }
    }
    
    Login or Signup to reply.
  3. As somebody said above but in different words: I don’t really get why you want to access two different locations with basically the same address (different protocols). But dude, who are we to tell you not to do it? Don’t let anything or anyone stop you! 😉😁

    However, we some times need to think outside the box and come up with different ways to achieve the same result. Why don’t you go to your domain provider and set up something like this:

    1. Create a subdomain (check if you need to set an A record for your domain) so you can have something like https://local.example.com/.
    2. Forward the new subdomain to your local IP address (perhaps you need to open/forward ports on you router and install DDClient or a similar service to catch your dynamic local/public IP and send it to your domain provider).
    3. Leave your @/naked record pointing to your website as it is.

    Whenever you access: https://www.example.com or http://www.example.com, you’ll see your website.
    And if you access https://local.example.com or http://local.example.com, you’ll access whatever you have on your local computer.

    Hope it helps, or at least, gives you a different perspective for a solution.

    Login or Signup to reply.
  4. You have to create or it may be already there in your nginx config files, a section for listen 443 (https).

    // 443 is the default port for https
    server {
      listen    443;
      ....
    }
    
    Login or Signup to reply.
  5. Whatever solution you pick, it should only work exactly once for you. If you configure your live site correctly, it should do HSTS, and the next time you type "http://www.mywebsite.com" your browser will GET "https://www.mywebsite.com" and your nginx won’t even hear about the insecure http request.

    But if you really, really want this you can let your local nginx proxy the https site and strip the HSTS headers:

    server {
      listen    443;
      server_name  www.mywebsite.com;
      proxy_pass https://ip_of_live_server;
      proxy_set_header Host $host;
      [... strip 'Strict-Transport-Security' ...]
    }
    

    Of course you will need your local nginx to serve these TLS sessions with a certificate that your browser trusts. Either adding a self-signed Snake Oil one to your browser, or… since we are implementing bad ideas… add a copy of you live secret key material to your localhost… 😉

    Login or Signup to reply.
  6. You need several pieces to make this work. Thinking through the steps of how a request could be handled:

    1. DNS for www.mywebsite.com points to a single IP, there’s no way around that. So all requests for that host, no matter the protocol, will come in to the machine with that IP, the public server.

    2. So we need to route those requests, such that a) https requests are handled by nginx on that same machine (the public server), and b) http requests are forwarded to your local machine. nginx can do a) of course, that’s a normal config, and nginx can also do b), as a reverse proxy.

    3. Now the problem is how to route traffic from the public server to your local machine, which is probably at home behind a dynamic IP and a router doing NAT. There are services to do this but to use your own domain is usually a paid feature (eg check out ngrok, I guess Traefik probably handles this too, not sure). To do it yourself you can use a reverse SSH tunnel.

    To be clear, this routes any request for http://www.mywebsite.com/ to your local machine, not just your own requests. Everyone who visits the http version of that site will end up hitting your local machine, at least while the tunnel is up.

    For 1, you just need your DNS set up normally, with a single DNS record for www.mywebsite.com. You don’t need any /etc/hosts tricks, remove those (and maybe reboot, to make sure they’re not cached and complicating things).

    For 2, your nginx config on the public server would look something like this:

    # First the http server, which will route requests to your local machine
    server {
        listen 80;
        server_name www.mywebsite.com;
    
        location / {
            # Route all http requests to port 8080 on this same server (the
            # public server), which we will forward back to your localhost
            proxy_pass http://127.0.0.1:8080;
        }
    }
    
    # Now the https server, handled by this, public server
    server {
        listen 443 ssl;
        server_name www.mywebsite.com;
    
        # SSL config stuff ...
        # Normal nginx config ...
        root /var/www/html
        location / {
            # ... etc, your site config
        }
    }
    

    The nginx config on your local machine should just be a normal http server listening on port 8080 (the port you mentioned it is running on). No proxying, nothing special here.

    For 3), lastly, we need to open a tunnel from your local machine to the public server. If you are on Linux, or macOS, you can do that from the command line with something like this:

    ssh [email protected] -nNT -R :8080:localhost:8080 &
    

    If you’re on Windows you could use something like PuTTY or the built in SSH client on Win 10.

    The important parts of this are (copied from the SSH manpage):

    -N Do not execute a remote command.  This is useful for just forwarding ports.
    -R Specifies that connections to the given TCP port or Unix socket on the remote
       (server) host are to be forwarded to the local side.
    

    The -R part specifies that connections to remote port 8080 (where nginx is routing http requests) should be forwarded to localhost port 8080 (your local machine). The ports can be anything of course, eg if you wanted to use port 5050 on your public server and port 80 on your local machine, it would instead look like -R :5050:localhost:80.

    Of course the tunnel will fail if your public IP address (on your localhost side) changes, or if you reboot, or your local wifi goes down, etc etc …

    NOTE: you should also be aware that you really are opening your local machine up to the public internet, so will be subject to all the same security risks that any server on the public internet faces, like various scripts probing for vulnerabilities etc. Whenever I use reverse tunnels like this I tend to leave them up only while developing, and shut them down immediately when done (and of course the site will not work when the tunnel is down).

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search