Ryan
Ryan

Reputation: 5682

Ember CLI in production having issues talking to Sails.js API on Apache Server

Problem: Internal Server error when trying to proxy API calls from built ember app to production Node API, with .htaccess on CentOS with Apache.

Using Ember CLI 1.1.15

Enviroments.js file:

var ENV = {
modulePrefix: 'va-loans-frontend',
environment: environment,
baseURL: '/',
locationType: 'auto',
host: 'http://localhost:1337/api',
...

if (environment === 'production') {
    ENV.host = "http://example.com:80/api";
}

.htaccess located in home/example/public_html

Options FollowSymLinks
RewriteEngine on

#redirect all page requests to main index
#RewriteCond %{REQUEST_URI} !^(index\.html|robots\.txt|img|font|js|css|scripts|action/.*) [NC]
RewriteRule ^api/ http://example.com:8080/ [P, L]
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^([^?]*)$ /index.html [NC,L,QSA]
#ProxyPassReverse /api http://example.com:8080/

(RewriteCond and ProxyPassReverse being commented out is me just trying to simplify and rule out specific lines)

I've also tried using a virtual host with proxypass rules and rewrite inside with no dice.

If I comment out the first RewriteRule ^api/* then apache serves my ember app and even does page redirects correctly but none of my api calls work then as they all get redirected to index.html.

My sails.js server is set to listen on port 8080 and is running in production mode with pm2. My built ember-cli project sits in my /public_html folder and looks like so:

assets/, crossdomain.xml, .htaccess, index.html, robots.txt.

Summery: Have apache serve index.html (my built ember-cli app) and redirect any url requests that don't contain /api/ to index.html so that ember can handle the routing. Any requests that do contain /api/ should be proxied to port 8080 where my sails.js node API lives and be handled there where it will eventually pass JSON back to my ember application.

Upvotes: 1

Views: 181

Answers (1)

Ryan
Ryan

Reputation: 5682

I finally found a way around this. The way around it was to cut Apache out as the middle man.

I dropped the .htaccess file completely and used iptables to do the redirect from port 80 to port 8080 where my sails application resided.

I then moved my built ember application to the assets folder inside of sails and added the following route to the bottom of my routing file in sails/config.

 '/*': {
      controller: 'App',
      action: 'serve', 
      skipAssets: true, 
      skipRegex: /^\/api\/.*$/
  },

And my sails/api/controllers/AppController.js file looks like this:

module.exports = {
    serve: function(req, res){
        res.sendfile( directory_path_to_my_project + '/assets/index.html');
    }
};

And of course all my routes are pre-pended with /api and this seems to have been working perfectly so far.

I came to this solution after reading: here, here, here, here, and here and well many many other places.

Upvotes: 1

Related Questions