ActionView::Helpers::AssetUrlHelper

This module provides methods for generating asset paths and urls.

image_path("rails.png")
# => "/assets/rails.png"

image_url("rails.png")
# => "http://www.example.com/assets/rails.png"

Using asset hosts

By default, Rails links to these assets on the current host in the public folder, but you can direct Rails to link to assets from a dedicated asset server by setting ActionController::Base.asset_host in the application configuration, typically in config/environments/production.rb. For example, you'd define assets.example.com to be your asset host this way, inside the configure block of your environment-specific configuration files or config/application.rb:

config.action_controller.asset_host = "assets.example.com"

Helpers take that into account:

image_tag("rails.png")
# => <img alt="Rails" src="http://assets.example.com/assets/rails.png" />
stylesheet_link_tag("application")
# => <link href="http://assets.example.com/assets/application.css" media="screen" rel="stylesheet" />

Browsers open a limited number of simultaneous connections to a single host. The exact number varies by browser and version. This limit may cause some asset downloads to wait for previous assets to finish before they can begin. You can use the %d wildcard in the asset_host to distribute the requests over four hosts. For example, assets%d.example.com will spread the asset requests over “assets0.example.com”, …, “assets3.example.com”.

image_tag("rails.png")
# => <img alt="Rails" src="http://assets0.example.com/assets/rails.png" />
stylesheet_link_tag("application")
# => <link href="http://assets2.example.com/assets/application.css" media="screen" rel="stylesheet" />

This may improve the asset loading performance of your application. It is also possible the combination of additional connection overhead (DNS, SSL) and the overall browser connection limits may result in this solution being slower. You should be sure to measure your actual performance across targeted browsers both before and after this change.

To implement the corresponding hosts you can either setup four actual hosts or use wildcard DNS to CNAME the wildcard to a single asset host. You can read more about setting up your DNS CNAME records from your ISP.

Note: This is purely a browser performance optimization and is not meant for server load balancing. See www.die.net/musings/page_load_time/ for background and www.browserscope.org/?category=network for connection limit data.

Alternatively, you can exert more control over the asset host by setting asset_host to a proc like this:

ActionController::Base.asset_host = Proc.new { |source|
  "http://assets#{Digest::MD5.hexdigest(source).to_i(16) % 2 + 1}.example.com"
}
image_tag("rails.png")
# => <img alt="Rails" src="http://assets1.example.com/assets/rails.png" />
stylesheet_link_tag("application")
# => <link href="http://assets2.example.com/assets/application.css" media="screen" rel="stylesheet" />

The example above generates “assets1.example.com” and “assets2.example.com”. This option is useful for example if you need fewer/more than four hosts, custom host names, etc.

As you see the proc takes a source parameter. That's a string with the absolute path of the asset, for example “/assets/rails.png”.

 ActionController::Base.asset_host = Proc.new { |source|
   if source.ends_with?('.css')
     "http://stylesheets.example.com"
   else
     "http://assets.example.com"
   end
 }
image_tag("rails.png")
# => <img alt="Rails" src="http://assets.example.com/assets/rails.png" />
stylesheet_link_tag("application")
# => <link href="http://stylesheets.example.com/assets/application.css" media="screen" rel="stylesheet" />

Alternatively you may ask for a second parameter request. That one is particularly useful for serving assets from an SSL-protected page. The example proc below disables asset hosting for HTTPS connections, while still sending assets for plain HTTP requests from asset hosts. If you don't have SSL certificates for each of the asset hosts this technique allows you to avoid warnings in the client about mixed media. Note that the request parameter might not be supplied, e.g. when the assets are precompiled via a Rake task. Make sure to use a Proc instead of a lambda, since a Proc allows missing parameters and sets them to nil.

config.action_controller.asset_host = Proc.new { |source, request|
  if request && request.ssl?
    "#{request.protocol}#{request.host_with_port}"
  else
    "#{request.protocol}assets.example.com"
  end
}

You can also implement a custom asset host object that responds to call and takes either one or two parameters just like the proc.

config.action_controller.asset_host = AssetHostingWithMinimumSsl.new(
  "http://asset%d.example.com", "https://asset1.example.com"
)

Methods

A

asset_path,
asset_url,
audio_path,
audio_url

C

compute_asset_extname,
compute_asset_host,
compute_asset_path

F

font_path,
font_url

I

image_path,
image_url

J

javascript_path,
javascript_url

P

path_to_asset,
path_to_audio,
path_to_font,
path_to_image,
path_to_javascript,
path_to_stylesheet,
path_to_video,
public_compute_asset_path

S

stylesheet_path,
stylesheet_url

U

url_to_asset,
url_to_audio,
url_to_font,
url_to_image,
url_to_javascript,
url_to_stylesheet,
url_to_video

V

video_path,
video_url

Constants

URI_REGEXP	=	%r{^[-a-z]+://\|^(?:cid\|data):\|^//}i

ASSET_EXTENSIONS	=	{ javascript: ".js", stylesheet: ".css" }

ASSET_PUBLIC_DIRECTORIES	=	{ audio: "/audios", font: "/fonts", image: "/images", javascript: "/javascripts", stylesheet: "/stylesheets", video: "/videos" }
	Maps asset types to public directory.

Instance Public methods

asset_path(source, options = {}) Link

This is the entry point for all assets. When using the asset pipeline (i.e. sprockets and sprockets-rails), the behavior is “enhanced”. You can bypass the asset pipeline by passing in skip_pipeline: true to the options.

All other asset *_path helpers delegate through this method.

With the asset pipeline

All options passed to asset_path will be passed to compute_asset_path which is implemented by sprockets-rails.

asset_path("application.js") # => "/assets/application-60aa4fdc5cea14baf5400fba1abf4f2a46a5166bad4772b1effe341570f07de9.js"

Without the asset pipeline (`skip_pipeline: true`)

Accepts a type option that can specify the asset's extension. No error checking is done to verify the source passed into asset_path is valid and that the file exists on disk.

asset_path("application.js", skip_pipeline: true)                 # => "application.js"
asset_path("filedoesnotexist.png", skip_pipeline: true)           # => "filedoesnotexist.png"
asset_path("application", type: :javascript, skip_pipeline: true) # => "/javascripts/application.js"
asset_path("application", type: :stylesheet, skip_pipeline: true) # => "/stylesheets/application.css"

Options applying to all assets

Below lists scenarios that apply to asset_path whether or not you're using the asset pipeline.

All fully qualified urls are returned immediately. This bypasses the asset pipeline and all other behavior described.
```
asset_path("http://www.example.com/js/xmlhr.js") # => "http://www.example.com/js/xmlhr.js"
```
All assets that begin with a forward slash are assumed to be full urls and will not be expanded. This will bypass the asset pipeline.
```
asset_path("/foo.png") # => "/foo.png"
```
All blank strings will be returned immediately. This bypasses the asset pipeline and all other behavior described.
```
asset_path("") # => ""
```

If config.relative_url_root is specified, all assets will have that root prepended.

Rails.application.config.relative_url_root = "bar"
asset_path("foo.js", skip_pipeline: true) # => "bar/foo.js"

A different asset host can be specified via config.action_controller.asset_host this is commonly used in conjunction with a CDN.

Rails.application.config.action_controller.asset_host = "assets.example.com"
asset_path("foo.js", skip_pipeline: true) # => "http://assets.example.com/foo.js"

An extension name can be specified manually with extname.

asset_path("foo", skip_pipeline: true, extname: ".js")     # => "/foo.js"
asset_path("foo.css", skip_pipeline: true, extname: ".js") # => "/foo.css.js"

Also aliased as: path_to_asset

Module ActionView::Helpers::AssetUrlHelper

Using asset hosts

With the asset pipeline

Without the asset pipeline (skip_pipeline: true)

Options applying to all assets

Without the asset pipeline (`skip_pipeline: true`)