HASS + NGINX + LE = Error during WebSocket handshake: Unexpected response code: 301

Installation
1

I’ve installed HASS on a Raspberry Pi using the instructions for NGINX with subdomain on the instruction page.

My NGINX configuration is as follows:

server {
        listen 80;
        server_name sub.domain.tld;
        return 301 https://$server_name$request_uri;
        client_max_body_size 25M;
}


server {
        listen 443 ssl;
        server_name sub.domain.tld;

        ssl on;
        ssl_certificate /etc/letsencrypt/live/sub.domain.tld/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/sub.domain.tld/privkey.pem;
        ssl_session_cache shared:SSL:10m;
        ssl_protocols TLSv1.1 TLSv1.2;
        ssl_ciphers 'EECDH+AESGCM:EDH+AESGCM:AES256+EECDH:AES256+EDH';
        ssl_prefer_server_ciphers on;
        ssl_dhparam /etc/ssl/certs/dhparam.pem;
        # add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;

        proxy_buffering off;

        location / {
                proxy_pass http://127.0.0.1:8123;
                proxy_set_header X-Real-IP $210.54.37.134;
                proxy_set_header Host $host;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

                # WebSocket support (nginx 1.4)
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection "upgrade";
        }


        # location ^~/api/websocket/ {
        #     proxy_pass http://127.0.0.1:8123;
        # }
        
}

My HASS config is as follows:

homeassistant:
  # Name of the location where Home Assistant is running
  name: Home
  # Location required to calculate the time the sun rises and sets
  latitude: !secret lat
  longitude: !secret long
  # Impacts weather/sunrise data (altitude above sea level in meters)
  elevation: 0
  # metric for Metric, imperial for Imperial
  unit_system: metric
  # Pick yours from here: http://en.wikipedia.org/wiki/List_of_tz_database_time_zones
  time_zone: Pacific/Auckland

# Show links to resources in log and frontend
# introduction:

# Enables the frontend
frontend:

# Enables configuration UI
config:

http:
  # Uncomment this to add a password (recommended!)
  api_password: !secret api_pass
  # Uncomment this if you are using SSL/TLS, running in Docker container, etc.
  # base_url: sub.domain.tld

# Checks for available updates
# Note: This component will send some information about your system to
# the developers to assist with development of Home Assistant.
# For more information, please see:
# https://home-assistant.io/blog/2016/10/25/explaining-the-updater/
updater:
  # Optional, allows Home Assistant developers to focus on popular components.
  # include_used_components: true

# Discover some devices automatically
discovery:

# Allows you to issue voice commands from the frontend in enabled browsers
conversation:

# Enables support for tracking state changes over time
history:

# View all events in a logbook
logbook:

# Track the sun
sun:

# Weather prediction
sensor:
  - platform: yr

# Text to speech
tts:
  - platform: google

group: !include groups.yaml
automation: !include automations.yaml

Everything installed properly with no problem, however once I set up the certificate after the installation, I get the following error when logging in:

WebSocket connection to 'wss://sub.domain.tld/api/websocket' failed: Error during WebSocket handshake: Unexpected response code: 301

It’s been reported as an issue on reddit as well by others. I’ve tried Firefox, Chrome and Edge, all in incognito mode, both on my network, and on a separate network using a different machine (laptop). It’s definitely not a DNS or router issue as someone tried to suggest on reddit.

Any help would be greatly appreciated with this, or if I should open an issue on github let me know.

HASS Version: 0.50.2
Python version: 3.4.2
NGINX Version: 1.6.2