I have a small ember application using the starter kit provided by Ember-App-Kit(EAK). I have uploaded the dist dir after building for production to AWS EC2 instance.

Issues that I am facing as of now::

1. When I hit the root url, I can see the index page, while going to any other route from links that are present in the index page it works fine and lets me go to that page. The issue issue occurs when I try to hit refresh on the that page itself.

First I thought it is due to permissions error, but it is only single html file and js and css are loading properly. Then thought might be htaccess issue so tried to insert one , but no effects after that also. The striped down version of the application source code resides in Source Code

.htaccess file used for redirection::

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !index
RewriteRule ^(.*)$ /index.html [L]

I have a small ember application using the starter kit provided by Ember-App-Kit(EAK). I have uploaded the dist dir after building for production to AWS EC2 instance.

Issues that I am facing as of now::

1. When I hit the root url, I can see the index page, while going to any other route from links that are present in the index page it works fine and lets me go to that page. The issue issue occurs when I try to hit refresh on the that page itself.

First I thought it is due to permissions error, but it is only single html file and js and css are loading properly. Then thought might be htaccess issue so tried to insert one , but no effects after that also. The striped down version of the application source code resides in Source Code

.htaccess file used for redirection::

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !index
RewriteRule ^(.*)$ /index.html [L]

• javascript
• apache
• .htaccess
• ember.js
• http-status-code-404

• I would love to see an answer that doesn't involve nginx. – sheriffderek Commented May 2, 2015 at 22:29

4 Answers 4

I actually couldn't fig out how to do it with Apache server, so I installed nginx and it worked with the rewrite rule that I provided inside the config file.

server {
        root /var/www/{Your App Directory Path Here};
        index index.html index.htm;
        server_name {Your website URL or IP address here};

        location / {
                try_files $uri $uri/ /index.html?/$request_uri;
        }
}

More discussion you can find here: Ember-App-Kit Git Repo Issue 486

As mentioned in this post using FallbackRessource is the easiest way to get this done:

FallbackResource /index.html

It could be used in .htaccess but since .htaccess is parsed on every request I would suggest to put it in httpd.conf or virtual host.

you need to set locationType: 'hash' in environment.js before build.

You need to ensure that your web server serves up your "index" page no matter what URL is accessed.

With Apache you will typically use rewrite rules, there is some discussion of setting this up for Ember here http://discuss.emberjs./t/apache-rewrite-rule-for-html5-browser-history-url-bookmarkability/1013