title: nginx proxy for Javascript WebSocket client
body: <p>I have nginx running on localhost serving static html/css/js files.  It proxies to a remote server for the required RESTful db services.  I need to also setup nginx to proxy to a remote websocket server but failing miserably with all attempts.</p>
  
  <p>The Javascript client works if I hardcode the websocket server url like this:</p>
  
  <pre><code>socket = new WebSocket("ws://50.29.123.83:9030/something/socket");
  </code></pre>
  
  <p>Obviously, not a optimal solution and I should be able to use location.host and a proxy to get to the same location.   I configured nginx with the following:</p>
  
  <pre><code>http {
    ...
    upstream websocket {
      server 50.29.123.83:9030;
      }
  }
  
  sever {
    ...
    location /the_socket/ {
          proxy_pass http://websocket;
          proxy_http_version 1.1;
          proxy_set_header Upgrade $http_upgrade;
          proxy_set_header Connection "upgrade";
    }
  }
  </code></pre>
  
  <p>Then updated the client code to:</p>
  
  <pre><code>socket = new WebSocket("ws://" + location.host + "/the_socket/something/socket");
  </code></pre>
  
  <p>This fails with the following error:</p>
  
  <blockquote>
    <p>WebSocket connection to 'ws://localhost/the_socket/something/socket'
    failed: Error during WebSocket handshake: Unexpected response code:
    404</p>
  </blockquote>
  
  <p>What am I doing wrong?</p>
  
  <ul>
  <li>ip &amp; port numbers changed to protect the innocent</li>
  </ul>