CODEWITHSUNDEEP
javascriptapache.htaccessember.jshttp-status-code-404
Pranaya Behera
Pranaya Behera

Reputation: 555

Emberjs application refresh on route other than index gives 404 error

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]

Upvotes: 6

Views: 2493

Answers (4)

Mohamed Ibrahim Ansari
Mohamed Ibrahim Ansari

Reputation: 11

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

Upvotes: 1

jelhan
jelhan

Reputation: 6338

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.

Upvotes: 1

Pranaya Behera
Pranaya Behera

Reputation: 555

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

Upvotes: 3

Kevin Ansfield
Kevin Ansfield

Reputation: 2343

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.com/t/apache-rewrite-rule-for-html5-browser-history-url-bookmarkability/1013

Upvotes: 0

Related Questions