ICS 414

How to set up HTTPS

If you have built a web site that allows users to login with a password, or stores any kind of confidential information, then it is very important to encrypt the information that flows between the server and the browser. The standard way to accomplish this is to use the HTTPS protocol rather than HTTP.

In this page, you will see how to use Meteor Up to set up HTTPS communication between your server at Digital Ocean and the browsers that connect to it.

This procedure requires that your site have a domain name, so you must have completed How to set up a custom domain name.

1. Modify mup.js to refer to your domain name

When you set up your mup.js file in How to deploy a Meteor application to Digital Ocean, you specified the server using it’s IP address. For example, “http://167.172.222.158”.

The first step is to edit your mup.js file in two places to refer to your domain name:

module.exports = {
  servers: {
    one: {
      host: 'meteor-application-template-react.xyz',
      username: 'root',
      password: 'change me'
    }
  },

  app: {
    name: 'meteor-application-template-react',
    path: '../',

    servers: {
      one: {},
    },

    buildOptions: {
      serverOnly: true,
    },

    env: {
      ROOT_URL: 'http://meteor-application-template-react.xyz',
      MONGO_URL: 'mongodb://mongodb/meteor',
      MONGO_OPLOG_URL: 'mongodb://mongodb/local',
    },

    docker: {
      image: 'abernix/meteord:node-12-base',
    },

    enableUploadProgressBar: true
  },

  mongo: {
    version: '3.4.1',
    servers: {
      one: {}
    }
  },
};

2. Run mup setup and mup deploy with the custom domain

Now run “mup setup” (or “mup.cmd setup” on Windows) to install these changes:

$ mup setup

Started TaskList: Setup Docker
[meteor-application-template-react.xyz] - Setup Docker
[meteor-application-template-react.xyz] - Setup Docker: SUCCESS

Started TaskList: Setup Meteor
[meteor-application-template-react.xyz] - Setup Environment
[meteor-application-template-react.xyz] - Setup Environment: SUCCESS

Started TaskList: Setup Mongo
[meteor-application-template-react.xyz] - Setup Environment
[meteor-application-template-react.xyz] - Setup Environment: SUCCESS
[meteor-application-template-react.xyz] - Copying Mongo Config
[meteor-application-template-react.xyz] - Copying Mongo Config: SUCCESS

Started TaskList: Start Mongo
[meteor-application-template-react.xyz] - Start Mongo
[meteor-application-template-react.xyz] - Start Mongo: SUCCESS

Next, you should run:
    mup deploy
$

Now run “mup deploy” (or “mup.cmd deploy” on Windows) to deploy these changes:

mup deploy
Building App Bundle Locally

Started TaskList: Pushing Meteor App
[meteor-application-template-react.xyz] - Pushing Meteor App Bundle to the Server
[meteor-application-template-react.xyz] - Pushing Meteor App Bundle to the Server: SUCCESS
[meteor-application-template-react.xyz] - Prepare Bundle
[meteor-application-template-react.xyz] - Prepare Bundle: SUCCESS

Started TaskList: Configuring App
[meteor-application-template-react.xyz] - Pushing the Startup Script
[meteor-application-template-react.xyz] - Pushing the Startup Script: SUCCESS
[meteor-application-template-react.xyz] - Sending Environment Variables
[meteor-application-template-react.xyz] - Sending Environment Variables: SUCCESS

Started TaskList: Start Meteor
[meteor-application-template-react.xyz] - Start Meteor
[meteor-application-template-react.xyz] - Start Meteor: SUCCESS
[meteor-application-template-react.xyz] - Verifying Deployment
[meteor-application-template-react.xyz] - Verifying Deployment: SUCCESS
$

To verify that the deployment succeeded, visit your site in a browser (for example, “http://meteor-application-template-react.xyz”).

3. Edit mup.js to setup HTTPS

To tell Meteor Up to obtain a Let’s Encrypt certificate and perform reverse proxy to implement HTTPS, you must modify your mup.js file in two ways. First, you need to add a “proxy” section to mup.js following the Meteor Up documentation on SSL. Second, you need to change the reference to “http” in the ROOT_URL environment variable to “https”. Here’s what it looks like:

module.exports = {
  servers: {
    one: {
      host: 'meteor-application-template-react.xyz',
      username: 'root',
      password: 'change me'
    }
  },

  app: {
    name: 'meteor-application-template-react',
    path: '../',

    servers: {
      one: {},
    },

    buildOptions: {
      serverOnly: true,
    },

    env: {
      ROOT_URL: 'https://meteor-application-template-react.xyz',
      MONGO_URL: 'mongodb://mongodb/meteor',
      MONGO_OPLOG_URL: 'mongodb://mongodb/local',
    },

    docker: {
      image: 'abernix/meteord:node-12-base',
    },

    enableUploadProgressBar: true
  },

  proxy: {
    domains: 'meteor-application-template-react.xyz',
    ssl: {
      letsEncryptEmail: 'johnson@hawaii.edu',
      forceSSL: true
    }
  },

  mongo: {
    version: '3.4.1',
    servers: {
      one: {}
    }
  },
};

4. Run mup setup, reconfig, (setup), and deploy

To install these changes at Digital Ocean, you must run several mup commands.

First run “mup setup” (or “mup.cmd setup” on Windows). This may result in an error setting up the proxy: that’s OK! The following example invocation shows this error.

$ mup setup

Started TaskList: Setup Docker
[meteor-application-template-react.xyz] - Setup Docker
[meteor-application-template-react.xyz] - Setup Docker: SUCCESS

Started TaskList: Setup Meteor
[meteor-application-template-react.xyz] - Setup Environment
[meteor-application-template-react.xyz] - Setup Environment: SUCCESS

Started TaskList: Setup Mongo
[meteor-application-template-react.xyz] - Setup Environment
[meteor-application-template-react.xyz] - Setup Environment: SUCCESS
[meteor-application-template-react.xyz] - Copying Mongo Config
[meteor-application-template-react.xyz] - Copying Mongo Config: SUCCESS

Started TaskList: Start Mongo
[meteor-application-template-react.xyz] - Start Mongo
[meteor-application-template-react.xyz] - Start Mongo: SUCCESS

Started TaskList: Setup proxy
[meteor-application-template-react.xyz] - Setup Environment
[meteor-application-template-react.xyz] - Setup Environment: SUCCESS
[meteor-application-template-react.xyz] - Pushing the Startup Script
[meteor-application-template-react.xyz] - Pushing the Startup Script: SUCCESS
[meteor-application-template-react.xyz] - Pushing Nginx Config Template
[meteor-application-template-react.xyz] - Pushing Nginx Config Template: SUCCESS
[meteor-application-template-react.xyz] - Pushing Nginx Config
[meteor-application-template-react.xyz] - Pushing Nginx Config: SUCCESS
[meteor-application-template-react.xyz] - Cleaning Up SSL Certificates
[meteor-application-template-react.xyz] - Cleaning Up SSL Certificates: SUCCESS
[meteor-application-template-react.xyz] - Configure Nginx Upstream
[meteor-application-template-react.xyz] - Configure Nginx Upstream: SUCCESS

Started TaskList: Start proxy
[meteor-application-template-react.xyz] - Start proxy
[meteor-application-template-react.xyz] x Start proxy: FAILED

	      ------------------------------------STDERR------------------------------------
	      Error response from daemon: endpoint mup-nginx-proxy not found
	Error response from daemon: network mup-proxy not found
	Error: No such container: mup-nginx-proxy-letsencrypt
             :
             :
$

Second, run “mup reconfig” (or “mup.cmd reconfig” on Windows):

$ mup reconfig

Started TaskList: Configuring App
[meteor-application-template-react.xyz] - Pushing the Startup Script
[meteor-application-template-react.xyz] - Pushing the Startup Script: SUCCESS
[meteor-application-template-react.xyz] - Sending Environment Variables
[meteor-application-template-react.xyz] - Sending Environment Variables: SUCCESS

Started TaskList: Start Meteor
[meteor-application-template-react.xyz] - Start Meteor
[meteor-application-template-react.xyz] - Start Meteor: SUCCESS
[meteor-application-template-react.xyz] - Verifying Deployment
[meteor-application-template-react.xyz] - Verifying Deployment: SUCCESS
$

Third, if the setup command failed above, then you should run it again now:

$ mup setup

Started TaskList: Setup Docker
[meteor-application-template-react.xyz] - Setup Docker
[meteor-application-template-react.xyz] - Setup Docker: SUCCESS

Started TaskList: Setup Meteor
[meteor-application-template-react.xyz] - Setup Environment
[meteor-application-template-react.xyz] - Setup Environment: SUCCESS

Started TaskList: Setup Mongo
[meteor-application-template-react.xyz] - Setup Environment
[meteor-application-template-react.xyz] - Setup Environment: SUCCESS
[meteor-application-template-react.xyz] - Copying Mongo Config
[meteor-application-template-react.xyz] - Copying Mongo Config: SUCCESS

Started TaskList: Start Mongo
[meteor-application-template-react.xyz] - Start Mongo
[meteor-application-template-react.xyz] - Start Mongo: SUCCESS

Started TaskList: Setup proxy
[meteor-application-template-react.xyz] - Setup Environment
[meteor-application-template-react.xyz] - Setup Environment: SUCCESS
[meteor-application-template-react.xyz] - Pushing the Startup Script
[meteor-application-template-react.xyz] - Pushing the Startup Script: SUCCESS
[meteor-application-template-react.xyz] - Pushing Nginx Config Template
[meteor-application-template-react.xyz] - Pushing Nginx Config Template: SUCCESS
[meteor-application-template-react.xyz] - Pushing Nginx Config
[meteor-application-template-react.xyz] - Pushing Nginx Config: SUCCESS
[meteor-application-template-react.xyz] - Cleaning Up SSL Certificates
[meteor-application-template-react.xyz] - Cleaning Up SSL Certificates: SUCCESS
[meteor-application-template-react.xyz] - Configure Nginx Upstream
[meteor-application-template-react.xyz] - Configure Nginx Upstream: SUCCESS

Started TaskList: Start proxy
[meteor-application-template-react.xyz] - Start proxy
[meteor-application-template-react.xyz] - Start proxy: SUCCESS

Next, you should run:
    mup deploy
$

Fourth, run “mup deploy” (or “mup.cmd deploy” on Windows):

$ mup deploy
Building App Bundle Locally

Started TaskList: Pushing Meteor App
[meteor-application-template-react.xyz] - Pushing Meteor App Bundle to the Server
[meteor-application-template-react.xyz] - Pushing Meteor App Bundle to the Server: SUCCESS
[meteor-application-template-react.xyz] - Prepare Bundle
[meteor-application-template-react.xyz] - Prepare Bundle: SUCCESS

Started TaskList: Configuring App
[meteor-application-template-react.xyz] - Pushing the Startup Script
[meteor-application-template-react.xyz] - Pushing the Startup Script: SUCCESS
[meteor-application-template-react.xyz] - Sending Environment Variables
[meteor-application-template-react.xyz] - Sending Environment Variables: SUCCESS

Started TaskList: Start Meteor
[meteor-application-template-react.xyz] - Start Meteor
[meteor-application-template-react.xyz] - Start Meteor: SUCCESS
[meteor-application-template-react.xyz] - Verifying Deployment
[meteor-application-template-react.xyz] - Verifying Deployment: SUCCESS
$

5. Verify that your application uses HTTPS:

Now retrieve your application in a browser. It should use HTTPS. On the Chrome browser, this is shown via a lock icon in the address bar:

picture