routing conflict with assets in rails - only on production

Question

In my routes, I define a global category with some ID to load dynamic content:

get "/:global_category/:id" => "pages#index"

The route is placed on the bottom of routes.rb. All easy and no problem, at least on development. Now I also load some webfonts via CSS into my app and when I' on production, I get the following exception whenever my fonts are loaded:

undefined method `id' for nil:NilClass

The affected URL is: http://www.example.com/assets/Sansation_Bold-webfont.woff

I load fonts that are located in /assets/fonts in a sass file like this:

@font-face
  font-family: 'ApolloASM'
  src: url('ApolloASM-webfont.eot')
  src: url('ApolloASM-webfont.eot?#iefix') format('embedded-opentype'), url('ApolloASM-webfont.woff2') format('woff2'),url('ApolloASM-webfont.woff') format('woff'),url('ApolloASM-webfont.ttf') format('truetype'),url('ApolloASM-webfont.svg#apollo_asmregular') format('svg')
  font-weight: normal
  font-style: normal

There is obviously a conflict with my routes and the assets pipeline. Only on production (I deploy on heroku) I can reproduce this so I tried to modify my production.rb but after looking into the docu (http://guides.rubyonrails.org/asset_pipeline.html) I still don't really know what to do.

I also tried to precompile assets.

That does not seem to be the cause of the issue and also my Fonts are all loaded correctly! Any hints are appreciated.

Answer 1

I solved it by using the sass helper "font-url":

@font-face
  font-family: 'ApolloASM'
  src: font-url('ApolloASM-webfont.eot')
  src: font-url('ApolloASM-webfont.eot?#iefix') format('embedded-opentype'), font-url('ApolloASM-webfont.woff2') format('woff2'),font-url('ApolloASM-webfont.woff') format('woff'),font-url('ApolloASM-webfont.ttf') format('truetype'),font-url('ApolloASM-webfont.svg#apollo_asmregular') format('svg')
  font-weight: normal
  font-style: normal

no need to pre-compile or add anything in the production.rb or application.rb file

make sure that fonts are all stored in the /app/assets/fonts directory.

Answer 2

The problem with a route like this is that it will be matched by a load of other paths on your system. Eg, "/users/123" will be interpreted as pages#index params={:global_category => "users", :id => 123}, whereas you might have been expecting it to go to users#show params={:id => 123}.

Catchall routes like this need to go near the bottom of your routes.rb file, so that they don't "steal" the paths from the other routes: the routes are tested in the order in which the appear in the file.