Upload css files to a static site in the hero

Question

My config.ru as follows:

 use Rack::Static, :urls => ["/images"], :root => "public" run lambda { |env| [ 200, { 'Content-Type' => 'text/html', 'Cache-Control' => 'public, max-age=86400' }, File.open('public/index.html', File::RDONLY) ] } 

When I download it locally, the site looks fine, but when I run it on Heroku, I get the following error message in the browser console for CSS files:

 Resource interpreted as Stylesheet but transferred with MIME type text/html. 

Any idea why I am getting these errors?

Example site: http://salus8.heroku.com .

Answer 1

Your application is currently responding to requests in two different ways. Requests starting with /images are performed by searching the /public/images folder and returning any file matching the request. Any other request is served by running the lambda block, which returns your index.html file with the content type text/html .

This applies to any other request, so when your page refers to a css file and the browser tries to extract it, your application will return an index.html page with the HTML content type, therefore, it will warn about the MIME type.

One way to fix this would be to add /css to the list of urls:

 use Rack::Static, :urls => ["/images", "/css"], :root => "public" 

and put your css files in the public/css directory (as I write, it looks like you already did this).

This will solve your immediate problem, but you may have problems, for example, if you want to have more than one HTML page in the top directory.

Another solution for reaching a static site that serves index.html for any queries without a path, which is similar to what you are trying to do here, could be to use a rack-rewrite gem and a Rack::File application. Add gem 'rack-rewrite' to your Gemfile and then use config.ru as follows:

 require 'rack/rewrite' use Rack::Rewrite do rewrite "/", "/index.html" end run Rack::File.new("public") 

This will answer all requests with the corresponding file (if one exists), and any requests that arrive without a path will receive index.html . (Note that it will not serve index.html for requests for subdirectories in the main directory).

If you use Herocus Cedar stack, you can also study php application falsification in order to get "real" static hosting with Apache .

I do not know why this will work locally, but not on Heroku, unless you open the files directly in the browser. Are you using a local server (for example, using rackup ) or are you directly watching files?