Spec-Zone.ru › Ruby on Rails 7.0

модуль ActionView::Helpers::AssetTagHelper

Включенные модули:
ActionView::Helpers::AssetUrlHelper, ActionView::Helpers::TagHelper

Этот модуль предоставляет методы для генерации HTML-ссылок, связывающих представления с ресурсами, такими как изображения, JavaScript, таблицы стилей и ленты новостей. Эти методы не проверяют существование ресурсов перед созданием ссылок:

image_tag("rails.png")
# => <img src="/assets/rails.png" />
stylesheet_link_tag("application")
# => <link href="/assets/application.css?body=1" rel="stylesheet" />

Константы

MAX_HEADER_SIZE

Открытые методы экземпляров

audio_tag(*sources) Показать исходный код
# File actionview/lib/action_view/helpers/asset_tag_helper.rb, line 485
def audio_tag(*sources)
  multiple_sources_tag_builder("audio", sources)
end

Возвращает HTML-тег audio для sources. Если sources является строкой, возвращается один тег audio. Если sources является массивом, возвращается тег audio с вложенными тегами source для каждого источника. sources может быть полными путями или файлами, существующими в вашем каталоге public audios.

Если последний параметр является хешем, вы можете добавить атрибуты HTML с помощью этого параметра.

audio_tag("sound")
# => <audio src="/audios/sound"></audio>
audio_tag("sound.wav")
# => <audio src="/audios/sound.wav"></audio>
audio_tag("sound.wav", autoplay: true, controls: true)
# => <audio autoplay="autoplay" controls="controls" src="/audios/sound.wav"></audio>
audio_tag("sound.wav", "sound.mid")
# => <audio><source src="/audios/sound.wav" /><source src="/audios/sound.mid" /></audio>
auto_discovery_link_tag(type = :rss, url_options = {}, tag_options = {}) Показать исходный код
# File actionview/lib/action_view/helpers/asset_tag_helper.rb, line 235
def auto_discovery_link_tag(type = :rss, url_options = {}, tag_options = {})
  if !(type == :rss || type == :atom || type == :json) && tag_options[:type].blank?
    raise ArgumentError.new("You should pass :type tag_option key explicitly, because you have passed #{type} type other than :rss, :atom, or :json.")
  end

  tag(
    "link",
    "rel"   => tag_options[:rel] || "alternate",
    "type"  => tag_options[:type] || Template::Types[type].to_s,
    "title" => tag_options[:title] || type.to_s.upcase,
    "href"  => url_options.is_a?(Hash) ? url_for(url_options.merge(only_path: false)) : url_options
  )
end

Возвращает тег ссылки, который браузеры и читатели лент новостей могут использовать для автоматического определения RSS, Atom или JSON ленты. type может быть :rss (по умолчанию), :atom, или :json. Управление параметрами ссылки в формате url_for с помощью url_options. Вы можете изменить сам тег LINK в tag_options.

Параметры

  • :rel — Укажите отношение этой ссылки, по умолчанию «alternate»

  • :type — Переопределите автоматически сгенерированный тип MIME

  • :title — Укажите заголовок ссылки, по умолчанию type

Примеры

auto_discovery_link_tag
# => <link rel="alternate" type="application/rss+xml" title="RSS" href="http://www.currenthost.com/controller/action" />
auto_discovery_link_tag(:atom)
# => <link rel="alternate" type="application/atom+xml" title="ATOM" href="http://www.currenthost.com/controller/action" />
auto_discovery_link_tag(:json)
# => <link rel="alternate" type="application/json" title="JSON" href="http://www.currenthost.com/controller/action" />
auto_discovery_link_tag(:rss, {action: "feed"})
# => <link rel="alternate" type="application/rss+xml" title="RSS" href="http://www.currenthost.com/controller/feed" />
auto_discovery_link_tag(:rss, {action: "feed"}, {title: "My RSS"})
# => <link rel="alternate" type="application/rss+xml" title="My RSS" href="http://www.currenthost.com/controller/feed" />
auto_discovery_link_tag(:rss, {controller: "news", action: "feed"})
# => <link rel="alternate" type="application/rss+xml" title="RSS" href="http://www.currenthost.com/news/feed" />
auto_discovery_link_tag(:rss, "http://www.example.com/feed.rss", {title: "Example RSS"})
# => <link rel="alternate" type="application/rss+xml" title="Example RSS" href="http://www.example.com/feed.rss" />
favicon_link_tag(source = "favicon.ico", options = {}) Показать исходный код
# File actionview/lib/action_view/helpers/asset_tag_helper.rb, line 276
def favicon_link_tag(source = "favicon.ico", options = {})
  tag("link", {
    rel: "icon",
    type: "image/x-icon",
    href: path_to_image(source, skip_pipeline: options.delete(:skip_pipeline))
  }.merge!(options.symbolize_keys))
end

Возвращает тег ссылки для значка favicon, управляемого конвейером ресурсов.

Если на странице нет ссылки, сгенерированной этим помощником, браузеры автоматически запрашивают /favicon.ico, и кэшируют файл, если запрос успешен. Обновление значка favicon сложно, если он изменяется.

Для лучшего управления приложения могут позволить конвейеру ресурсов управлять своим значком favicon, сохраняя файл в app/assets/images, и используя этот помощник для генерации соответствующего тега ссылки.

Помощник получает имя файла значка favicon в качестве первого аргумента, по умолчанию «favicon.ico», а также поддерживает :rel и :type параметры для переопределения их значений по умолчанию, «icon» и «image/x-icon» соответственно:

favicon_link_tag
# => <link href="/assets/favicon.ico" rel="icon" type="image/x-icon" />

favicon_link_tag 'myicon.ico'
# => <link href="/assets/myicon.ico" rel="icon" type="image/x-icon" />

Mobile Safari ищет другой тег ссылки, указывающий на изображение, которое будет использоваться, если вы добавите страницу в домашний экран устройства iOS. Следующий вызов сгенерирует такой тег:

favicon_link_tag 'mb-icon.png', rel: 'apple-touch-icon', type: 'image/png'
# => <link href="/assets/mb-icon.png" rel="apple-touch-icon" type="image/png" />
image_tag(source, options = {}) Показать исходный код
# File actionview/lib/action_view/helpers/asset_tag_helper.rb, line 393
def image_tag(source, options = {})
  options = options.symbolize_keys
  check_for_image_tag_errors(options)
  skip_pipeline = options.delete(:skip_pipeline)

  options[:src] = resolve_image_source(source, skip_pipeline)

  if options[:srcset] && !options[:srcset].is_a?(String)
    options[:srcset] = options[:srcset].map do |src_path, size|
      src_path = path_to_image(src_path, skip_pipeline: skip_pipeline)
      "#{src_path} #{size}"
    end.join(", ")
  end

  options[:width], options[:height] = extract_dimensions(options.delete(:size)) if options[:size]

  options[:loading] ||= image_loading if image_loading
  options[:decoding] ||= image_decoding if image_decoding

  tag("img", options)
end

Возвращает HTML-тег изображения для source. source может быть полным путем, файлом или прикреплением Active Storage.

Параметры

Вы можете добавить атрибуты HTML с помощью options. options поддерживает дополнительные ключи для удобства и соответствия:

  • :size — Предоставляется в виде «{Ширина}x{Высота}» или «{Число}», поэтому «30x45» становится width=«30» и height=«45», а «50» становится width=«50» и height=«50». :size будет проигнорировано, если значение не в правильном формате.

  • :srcset — Если передаётся в виде хеша или массива пар [source, descriptor] пар, каждый путь к изображению будет расширен перед форматированием списка в строку.

Примеры

Ресурсы (изображения, являющиеся частью вашего приложения):

image_tag("icon")
# => <img src="/assets/icon" />
image_tag("icon.png")
# => <img src="/assets/icon.png" />
image_tag("icon.png", size: "16x10", alt: "Edit Entry")
# => <img src="/assets/icon.png" width="16" height="10" alt="Edit Entry" />
image_tag("/icons/icon.gif", size: "16")
# => <img src="/icons/icon.gif" width="16" height="16" />
image_tag("/icons/icon.gif", height: '32', width: '32')
# => <img height="32" src="/icons/icon.gif" width="32" />
image_tag("/icons/icon.gif", class: "menu_icon")
# => <img class="menu_icon" src="/icons/icon.gif" />
image_tag("/icons/icon.gif", data: { title: 'Rails Application' })
# => <img data-title="Rails Application" src="/icons/icon.gif" />
image_tag("icon.png", srcset: { "icon_2x.png" => "2x", "icon_4x.png" => "4x" })
# => <img src="/assets/icon.png" srcset="/assets/icon_2x.png 2x, /assets/icon_4x.png 4x">
image_tag("pic.jpg", srcset: [["pic_1024.jpg", "1024w"], ["pic_1980.jpg", "1980w"]], sizes: "100vw")
# => <img src="/assets/pic.jpg" srcset="/assets/pic_1024.jpg 1024w, /assets/pic_1980.jpg 1980w" sizes="100vw">

Объекты Active Storage (изображения, загруженные пользователями вашего приложения):

image_tag(user.avatar)
# => <img src="/rails/active_storage/blobs/.../tiger.jpg" />
image_tag(user.avatar.variant(resize_to_limit: [100, 100]))
# => <img src="/rails/active_storage/representations/.../tiger.jpg" />
image_tag(user.avatar.variant(resize_to_limit: [100, 100]), size: '100')
# => <img width="100" height="100" src="/rails/active_storage/representations/.../tiger.jpg" />
javascript_include_tag(*sources) Показать исходный код
# File actionview/lib/action_view/helpers/asset_tag_helper.rb, line 89
def javascript_include_tag(*sources)
  options = sources.extract_options!.stringify_keys
  path_options = options.extract!("protocol", "extname", "host", "skip_pipeline").symbolize_keys
  preload_links = []
  nopush = options["nopush"].nil? ? true : options.delete("nopush")
  crossorigin = options.delete("crossorigin")
  crossorigin = "anonymous" if crossorigin == true
  integrity = options["integrity"]
  rel = options["type"] == "module" ? "modulepreload" : "preload"

  sources_tags = sources.uniq.map { |source|
    href = path_to_javascript(source, path_options)
    if preload_links_header && !options["defer"] && href.present? && !href.start_with?("data:")
      preload_link = "<#{href}>; rel=#{rel}; as=script"
      preload_link += "; crossorigin=#{crossorigin}" unless crossorigin.nil?
      preload_link += "; integrity=#{integrity}" unless integrity.nil?
      preload_link += "; nopush" if nopush
      preload_links << preload_link
    end
    tag_options = {
      "src" => href,
      "crossorigin" => crossorigin
    }.merge!(options)
    if tag_options["nonce"] == true
      tag_options["nonce"] = content_security_policy_nonce
    end
    content_tag("script", "", tag_options)
  }.join("\n").html_safe

  if preload_links_header
    send_preload_links_header(preload_links)
  end

  sources_tags
end

Возвращает HTML-тег script для каждого из указанных sources.

Источники могут быть путями к JavaScript-файлам. Относительные пути предполагаются относительными к assets/javascripts, полные пути предполагаются относительными к корню документа. Относительные пути являются стандартными, используйте абсолютные пути только при необходимости.

При передаче путей расширение «.js» необязательно. Если вы не хотите добавлять «.js» к пути, extname: false может быть задано в параметрах.

Вы можете изменить атрибуты HTML тега script, передав хеш в качестве последнего аргумента.

При включенном конвейере ресурсов вы можете передать имя вашего манифеста в качестве источника и включить другие JavaScript или CoffeeScript-файлы в манифесте.

Если сервер поддерживает заголовки Early Hints, ссылки на эти ресурсы будут автоматически проталкиваться.

Параметры

Если последний параметр является хешем, вы можете добавить атрибуты HTML с помощью этого параметра. Поддерживаются следующие параметры:

  • :extname — Добавить расширение к сгенерированному URL, если расширение ещё не существует. Это относится только к относительным URL.

  • :protocol — Устанавливает протокол сгенерированного URL. Этот параметр применим только в случае относительного URL и host параметров.

  • :host — При использовании относительного URL хост добавляется к этому пути.

  • :skip_pipeline — Этот параметр используется для обхода конвейера ресурсов, когда он установлен в значение true.

  • :nonce — При установке в значение true добавляет автоматическое значение nonce, если у вас включен Content Security Policy.

Примеры

javascript_include_tag "xmlhr"
# => <script src="/assets/xmlhr.debug-1284139606.js"></script>

javascript_include_tag "xmlhr", host: "localhost", protocol: "https"
# => <script src="https://localhost/assets/xmlhr.debug-1284139606.js"></script>

javascript_include_tag "template.jst", extname: false
# => <script src="/assets/template.debug-1284139606.jst"></script>

javascript_include_tag "xmlhr.js"
# => <script src="/assets/xmlhr.debug-1284139606.js"></script>

javascript_include_tag "common.javascript", "/elsewhere/cools"
# => <script src="/assets/common.javascript.debug-1284139606.js"></script>
#    <script src="/elsewhere/cools.debug-1284139606.js"></script>

javascript_include_tag "http://www.example.com/xmlhr"
# => <script src="http://www.example.com/xmlhr"></script>

javascript_include_tag "http://www.example.com/xmlhr.js"
# => <script src="http://www.example.com/xmlhr.js"></script>

javascript_include_tag "http://www.example.com/xmlhr.js", nonce: true
# => <script src="http://www.example.com/xmlhr.js" nonce="..."></script>
preload_link_tag(source, options = {}) Показать исходный код
# File actionview/lib/action_view/helpers/asset_tag_helper.rb, line 319
def preload_link_tag(source, options = {})
  href = path_to_asset(source, skip_pipeline: options.delete(:skip_pipeline))
  extname = File.extname(source).downcase.delete(".")
  mime_type = options.delete(:type) || Template::Types[extname]&.to_s
  as_type = options.delete(:as) || resolve_link_as(extname, mime_type)
  crossorigin = options.delete(:crossorigin)
  crossorigin = "anonymous" if crossorigin == true || (crossorigin.blank? && as_type == "font")
  integrity = options[:integrity]
  nopush = options.delete(:nopush) || false

  link_tag = tag.link(**{
    rel: "preload",
    href: href,
    as: as_type,
    type: mime_type,
    crossorigin: crossorigin
  }.merge!(options.symbolize_keys))

  preload_link = "<#{href}>; rel=preload; as=#{as_type}"
  preload_link += "; type=#{mime_type}" if mime_type
  preload_link += "; crossorigin=#{crossorigin}" if crossorigin
  preload_link += "; integrity=#{integrity}" if integrity
  preload_link += "; nopush" if nopush

  send_preload_links_header([preload_link])

  link_tag
end

Возвращает тег ссылки, который браузеры могут использовать для предварительной загрузки source. source может быть путём к ресурсу, управляемому конвейером ресурсов, полным путём или URI.

Параметры

  • :type — Переопределите автоматически сгенерированный тип MIME, по умолчанию тип MIME для source расширения.

  • :as — Переопределите автоматически сгенерированное значение для атрибута, рассчитанного с помощью source расширения и типа MIME.

  • :crossorigin — Укажите атрибут crossorigin, необходимый для загрузки ресурсов из других доменов.

  • :nopush — Укажите, не требуется ли использование серверного ускорения для ресурса. По умолчанию false.

  • :integrity — Укажите атрибут integrity.

Примеры

preload_link_tag("custom_theme.css")
# => <link rel="preload" href="/assets/custom_theme.css" as="style" type="text/css" />

preload_link_tag("/videos/video.webm")
# => <link rel="preload" href="/videos/video.mp4" as="video" type="video/webm" />

preload_link_tag(post_path(format: :json), as: "fetch")
# => <link rel="preload" href="/posts.json" as="fetch" type="application/json" />

preload_link_tag("worker.js", as: "worker")
# => <link rel="preload" href="/assets/worker.js" as="worker" type="text/javascript" />

preload_link_tag("//example.com/font.woff2")
# => <link rel="preload" href="//example.com/font.woff2" as="font" type="font/woff2" crossorigin="anonymous"/>

preload_link_tag("//example.com/font.woff2", crossorigin: "use-credentials")
# => <link rel="preload" href="//example.com/font.woff2" as="font" type="font/woff2" crossorigin="use-credentials" />

preload_link_tag("/media/audio.ogg", nopush: true)
# => <link rel="preload" href="/media/audio.ogg" as="audio" type="audio/ogg" />
stylesheet_link_tag(*sources) Показать исходный код
# File actionview/lib/action_view/helpers/asset_tag_helper.rb, line 170
def stylesheet_link_tag(*sources)
  options = sources.extract_options!.stringify_keys
  path_options = options.extract!("protocol", "extname", "host", "skip_pipeline").symbolize_keys
  preload_links = []
  crossorigin = options.delete("crossorigin")
  crossorigin = "anonymous" if crossorigin == true
  nopush = options["nopush"].nil? ? true : options.delete("nopush")
  integrity = options["integrity"]

  sources_tags = sources.uniq.map { |source|
    href = path_to_stylesheet(source, path_options)
    if preload_links_header && href.present? && !href.start_with?("data:")
      preload_link = "<#{href}>; rel=preload; as=style"
      preload_link += "; crossorigin=#{crossorigin}" unless crossorigin.nil?
      preload_link += "; integrity=#{integrity}" unless integrity.nil?
      preload_link += "; nopush" if nopush
      preload_links << preload_link
    end
    tag_options = {
      "rel" => "stylesheet",
      "crossorigin" => crossorigin,
      "href" => href
    }.merge!(options)

    if apply_stylesheet_media_default && tag_options["media"].blank?
      tag_options["media"] = "screen"
    end

    tag(:link, tag_options)
  }.join("\n").html_safe

  if preload_links_header
    send_preload_links_header(preload_links)
  end

  sources_tags
end

Возвращает тег ссылки на таблицу стилей для указанных источников.

При передаче путей расширение .css необязательно. Если вы не указываете расширение, .css будет автоматически добавлен. Если вы не хотите добавлять .css, установите extname: false в параметрах. Вы можете изменить атрибуты ссылки, передав хеш в качестве последнего аргумента.

Если сервер поддерживает заголовки Early Hints, ссылки на эти ресурсы будут автоматически проталкиваться.

Параметры

  • :extname — Добавить расширение к сгенерированному URL, если расширение ещё не существует. Это относится только к относительным URL.

  • :protocol — Устанавливает протокол сгенерированного URL. Этот параметр применим только в случае относительного URL и host параметров.

  • :host — При использовании относительного URL хост добавляется к этому пути.

  • :skip_pipeline — Этот параметр используется для обхода конвейера ресурсов, когда он установлен в значение true.

Примеры

stylesheet_link_tag "style"
# => <link href="/assets/style.css" rel="stylesheet" />

stylesheet_link_tag "style.css"
# => <link href="/assets/style.css" rel="stylesheet" />

stylesheet_link_tag "http://www.example.com/style.css"
# => <link href="http://www.example.com/style.css" rel="stylesheet" />

stylesheet_link_tag "style.less", extname: false, skip_pipeline: true, rel: "stylesheet/less"
# => <link href="/stylesheets/style.less" rel="stylesheet/less">

stylesheet_link_tag "style", media: "all"
# => <link href="/assets/style.css" media="all" rel="stylesheet" />

stylesheet_link_tag "style", media: "print"
# => <link href="/assets/style.css" media="print" rel="stylesheet" />

stylesheet_link_tag "random.styles", "/css/stylish"
# => <link href="/assets/random.styles" rel="stylesheet" />
#    <link href="/css/stylish.css" rel="stylesheet" />
video_tag(*sources) Показать исходный код
# File actionview/lib/action_view/helpers/asset_tag_helper.rb, line 458
def video_tag(*sources)
  options = sources.extract_options!.symbolize_keys
  public_poster_folder = options.delete(:poster_skip_pipeline)
  sources << options
  multiple_sources_tag_builder("video", sources) do |tag_options|
    tag_options[:poster] = path_to_image(tag_options[:poster], skip_pipeline: public_poster_folder) if tag_options[:poster]
    tag_options[:width], tag_options[:height] = extract_dimensions(tag_options.delete(:size)) if tag_options[:size]
  end
end

Возвращает HTML тег видео для sources. Если sources является строкой, будет возвращён один тег видео. Если sources является массивом, будет возвращён тег видео с вложенными тегами source для каждого источника. sources могут быть полными путями или файлами, существующими в вашем общедоступном каталоге видео.

Параметры

Когда последним параметром является хэш, вы можете добавить атрибуты HTML, используя этот параметр. Поддерживаются следующие параметры:

  • :poster — Установить изображение (например, скриншот), которое будет отображаться перед загрузкой видео. Путь вычисляется как src для image_tag.

  • :size — Указывается в формате «{Ширина}x{Высота}» или «{Число}», например «30x45» становится width="30" и height="45", а «50» — width="50" и height="50". :size будет проигнорирован, если значение не соответствует правильному формату.

  • :poster_skip_pipeline обойдёт пайплайн активов, используя опцию :poster вместо использования актива из папки public.

Примеры

video_tag("trailer")
# => <video src="/videos/trailer"></video>
video_tag("trailer.ogg")
# => <video src="/videos/trailer.ogg"></video>
video_tag("trailer.ogg", controls: true, preload: 'none')
# => <video preload="none" controls="controls" src="/videos/trailer.ogg"></video>
video_tag("trailer.m4v", size: "16x10", poster: "screenshot.png")
# => <video src="/videos/trailer.m4v" width="16" height="10" poster="/assets/screenshot.png"></video>
video_tag("trailer.m4v", size: "16x10", poster: "screenshot.png", poster_skip_pipeline: true)
# => <video src="/videos/trailer.m4v" width="16" height="10" poster="screenshot.png"></video>
video_tag("/trailers/hd.avi", size: "16x16")
# => <video src="/trailers/hd.avi" width="16" height="16"></video>
video_tag("/trailers/hd.avi", size: "16")
# => <video height="16" src="/trailers/hd.avi" width="16"></video>
video_tag("/trailers/hd.avi", height: '32', width: '32')
# => <video height="32" src="/trailers/hd.avi" width="32"></video>
video_tag("trailer.ogg", "trailer.flv")
# => <video><source src="/videos/trailer.ogg" /><source src="/videos/trailer.flv" /></video>
video_tag(["trailer.ogg", "trailer.flv"])
# => <video><source src="/videos/trailer.ogg" /><source src="/videos/trailer.flv" /></video>
video_tag(["trailer.ogg", "trailer.flv"], size: "160x120")
# => <video height="120" width="160"><source src="/videos/trailer.ogg" /><source src="/videos/trailer.flv" /></video>

© 2004–2021 David Heinemeier Hansson
Licensed under the MIT License.

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API