Serving only font assets directly from app server - ruby-on-rails

In my rails app I am serving all my assets through a CDN. I'd like to serve only my fonts directly from my app server. font_url/font-url will always include the the cdn url. Is there any convenient way to generate the path to the font (with digest) without the CDN domain or the protocol (http[s]) included?
The only thing I can think of is writing my own method that replicates the functionality of asset_path -- hopefully there is a more elegant way to achieve this.
update -- backgroun
I want to serve fonts from my main domain only to IE users so they don't break when in "high security" mode.
How to serve fonts from different servers for IE users?
IE conditional comments with Sass and Bourbon

Update:
Copy the font files into a separate folder, say "ie-high-security" for example. This is to identify them in step #2.
Serve files in the folder ("ie-high-security" in the example) by configuring the asset_host in "config/application.rb":
ActionController::Base.asset_host = Proc.new { |source|
if source.include?('/ie-high-security/')
""
else
"http://assets.example.com"
end
}
Reference the fonts in the "ie-high-security" folder in a separate stylesheet intended only for IE9.
Serve the IE9 stylesheet with conditional comments as suggested in https://stackoverflow.com/a/25415002/368697:
<!--[if IE 9]>
stylesheet using internally served fonts
<![endif]-->
Old suggestion:
Use font_path instead of font_url. The first method generates an absolute path without the asset host prepended.
If the font is being included from a stylesheet that is served from your CDN, you'll need a full path back to the app server though.

Related

What can I serve from CDN for a Rails application?

I have a Ruby on Rails application where the views are contained in .html.erb files. If I introduce a CDN into the deployment pipeline, does that mean the CDN will only be able to serve up static assets such as JS, CSS and images? Will the html still be delivered from the Rails server? Serving the html from the Rails server seems like it will make page load times slower than if I could serve them from the CDN as well.
Thanks!

How do I know my whole app is Rails Asset Pipeline Compliant?

I am trying to figure out where my issue is for when I try to use aws cloudfront to render the rails assets. Not sure if there is a tool that will determine if my whole app is rails asset pipeline compliant (whether it meets its standards, etc). Any help would be appreciated, even helping me figure out how do I know for sure that my assets are coming from CloudFront and not from my app.
Here's a good tutorial to do that
https://ruby.awsblog.com/post/Tx3VS6Q2Q2K0LJR/Caching-the-Rails-Asset-Pipeline-with-Amazon-CloudFront
You can tell if serving your assets from cloudfront worked or not by viewing the page source of your production environment and see where are your css and js files served from, if it's working you'll find something like this
<link data-turbolinks-track="true" href="http://your-distribution-url.cloudfront.net/assets/application-bfe54945dee8eb9f51b20d52b93aa177.css" media="all" rel="stylesheet" />
Or if you configured a domain for your assets cdn.myapp.com for example you'll find that the assets are served from it
---------------- Update -----------------
Generally you want to organize your assets first before moving them on to a CDN, for the img tag it doesn't matter if you use image_tag or not what matters is the url of the image; if it's an asset image (that can be found in app/assets/images for example use the asset_url helper so that it is served through your asset pipeline (that doesn't apply to you application's images like user profile images).
Also in your CSS files when you use assets (background images for example) use the asset-url helper to get the image through asset pipeline.
Also it's a bad practice to add javascript into your views because you won't be able to server this javascript from your assets pipeline, try to have all your javascript in separate js or coffescript files and use the "Unobtrusive Javascript" practice (more about that in this answer What's the best way to embed a small chunk of javascript in Rails?).

Server is not serving files from assets/images

I just deployed the site using Mina. All the JS and CSS works, but there are some files in assets/images that are being used by colorbox that are not being served.
Failed to load resource: the server responded with a status of 404 (Not Found) http://pykture.com/assets/controls.png
I have changed this to true
config.serve_static_assets = true
but still no luck. How can I get these image files served?
You may want to use this - https://github.com/knapo/jquery-colorbox-rails - gem.
The problem is that the references to assets (like controls.png) in the CSS are not wrapped in an asset helper. If you need to write your own SCSS file, make sure you wrap references to these images in URL helpers. Like so:
image-url('colorbox/controls.png')
Then the CSS in production will not contains URLs like http://pykture.com/assets/controls.png, and instead will include URLs like http://pykture.com/assets/controls-8e899fb84b99ba6f03cb879824c7895d.png

Why can't I add a plain link tag in Rails4 App

Why is it so forbidden to add line like <link href="/assets/stylesheets/bootstrap/bootstrap.css" rel="stylesheet"> in my application.html.erb file. How else do I insert it?
It's not "forbidden" outright - it just skirts a lot of important Rails conventions which will likely create problems & inconsistencies down the line
There are several elements to what you're asking. Here they are:
Layout
Firstly, you need to use the correct helpers in your layout:
#app/views/layout/application.html.erb
<%= stylesheet_link_tag "bootstrap/bootsrap" %>
The reason for this is the same as using helpers in other parts of your Rails application - as paths change between environments & certain "backend" functionalities of the system evolve, you can't rely on using vanilla HTML to call "Rails-centric" methods
A pro tip is that if there is any reference to a path, or an asset, you need to use the helpers which Rails provides
Asset Pipeline
Further to this, you need to appreciate how the "asset pipeline" works.
One of the big benefits of the Rails framework is that it gives you the ability to organize your assets in the most effective way - by keeping them in the /assets folder.
Whilst great for development, your problem will arise when you go into a production environment - Rails prefers to serve static assets in production, which means that the assets will be pre-compiled & access in the public folder:
In the production environment Sprockets uses the fingerprinting scheme
outlined above. By default Rails assumes assets have been precompiled
and will be served as static assets by your web server.
To make sure this works properly, you need to use the path helpers to load the files dynamically; hence allowing Rails to access the files wherever they are on the system
--
Manifest
I would strongly recommend you look into the "manifest" feature of the asset pipeline:
#app/assets/stylesheets/application.css
/*
*= require bootstrap/bootstrap
*/

Rails 3 and asset_hosts in css?

I'm using rails 3 in production and development.
How do I use the asset_host path in css, for example with background-images?
I've tried:
.blerg{ background-image:url({asset_host}/images/blerg.gif); }
But it just comes out as that in the rendered document, is there anything special you have to do when including the css to get this to work?
If you are using Rails 3.1 Asset Pipline you can use the following in sass/scss
.blerg{ background-image: image-url(blerg.gif); }
The added advantage of this approach is that in production the css image will also contain the MD5 fingerprinting so you can setup a far future expires header on your background images and still have them expire if you make changes to them.
If you are serving css files from asset host all relative linked images in your css file are served from the same host.
If you just do /assets/blerg.gif it should work fine.

Resources