How do you serve ember-cli from https://localhost:4200 in development

Question

For our authentication to work with our ember app we need to serve the app from a secure url. We have a self signed ssl cert.

How do I setup the ember-cli to serve the index.html form a https domain.

Cheers

Answer 1

Also see https://stackoverflow.com/a/30574934/1392763.

If you will always use SSL you can set "ssl": true in the .ember-cli file for your project which will result in the ember serve command using SSL by default without having to pass the command line flag every time.

By default ember-cli will look in an ssl folder in the root of your project for server.key and server.crt files but you can customize that as well with the --ssl-key and --ssl-cert options to provide an alternate path.

If you don't already have a self signed SSL certificate for development you can follow these instructions to easily generate one: https://devcenter.heroku.com/articles/ssl-certificate-self

Example .ember-cli:

{
  "disableAnalytics": false,
  // Use SSL for development server by default
  "ssl": true,
  "ssl-key": "path/to/server.key",
  "ssl-cert": "path/to/server.crt"
}

Answer 2

EDIT

For googlers, this is no longer true. Use ember-cli --ssl

Thx to xdumaine Jul 12 at 10:08***

emphasized textYou can't directly from ember-cli without putting your hand in the code which I don't recommend :)

If you want to go this way look at: node_modules/ember-cli/lib/tasks/server/express-server.js and may be also into node_modules/ember-cli/lib/tasks/server/livereload-server.js

For those who still want to go through a web server :

However there are other cleaner solutions, for example use nginx as a (reverse) proxy :) or ever serving directly from nginx on the /dist folder :) Reverse basic example with nginx (didn't tried with ssl but should theoretically work :p) :

server {
   listen 443;
   server_name *.example.com;
   ssl on;
   ssl_certificate /path/to/your/certificate.crt;
   ssl_certificate_key /path/to/your/key.key;
   location / {
      proxy_pass http://localhost:4200;
   }
}

I said nginx but actually any webserver can do the trick right :)

NaB DO NOT USE ember serve IN PRODUCTION

Answer 3

I use the tunnels gem with pow port-proxying.

Update: more detail

Using a real web server (like the previous answer with nginx) is a great way to go, and is probably more like your production setup. However, I manage a lot of different projects, and am not that interested in managing an nginx configuration file for all of my projects. Pow makes it easy to make a lot of different projects available on port 80 on one development machine.

Pow has two main modes. The primary function is to be a simple server for Rack applications, accessed via a custom local domain such as http://my-application.dev/. This is done by symlinking ~/.pow/my-application to a directory that contains a rack application. However, pow can also proxy requests to a custom local domain to a specified port by creating a file that contains only the port number (such as echo 4200 > ~/.pow/my-application). This makes it easy to develop locally with an actual domain (also, as a side note, subdomains work too, which is really handy; for example, foobar.my-application.dev will also route to my-application).

Tunnels makes it easy to use pow with https.

Setup

# Install pow
curl get.pow.cx | sh

# Set up pow proxy for your ember app
echo 4200 > ~/.pow/my-application

# Start your ember server
ember serve # specify a port here if you used something else for pow proxy
# Check that http://my-application.dev correctly shows your ember app in the browser

# Install tunnels
gem install tunnels # possibly with sudo depending on your ruby setup

# Start tunnels
sudo tunnels

# Now https://my-application.dev should work