プログラミングマガジン

プログラミングを中心にIT技術をできるだけわかりやすくまとめます。

  • ホーム
  • Ruby on Rails
  • 【Ruby on Rails】ビューヘルパー(エスケープ関連、タグ関連など)
 
 
     
  • サーバー言語  
    • Python
    • Ruby
    • PHP
    • SQL
  •  
  • インフラ  
       
    • AWS
    •  
    • 基本
    • Git
  • Web
       
    • Web開発
    • JavaScript
    • Vue.js
    • React
  •  
  • 設計  
       
    • 実装設計
    • DB設計
  • 問い合わせ
  

【Ruby on Rails】ビューヘルパー(エスケープ関連、タグ関連など)

09.16

  • miyabisan2
  • コメントを書く

この記事は3分で読めます

ビューヘルパーとは?

ビューのテンプレートファイル(ERB)を記述する際に役立つメソッドの総称です。フォーム要素生成を初め様々なビューヘルパーがあります。なお、ビューヘルパーは自作することも可能なのでもしこういう機能が欲しいということを思いついたら自作してみましょう。

文字列数値関連のビューヘルパー

pluralizeメソッド

文字列を複数形に変換します。

truncateメソッド

指定した桁数で切り捨てます。

excerptメソッド

文字列から特定の文字列のみ抜粋する。

cycleメソッド

テーブルリストの背景色をn行おきに変更する。

highlightメソッド

特定キーワードをハイライト表示する。

concatメソッド

スクリプトブロック(<% 〜 %>)の中に出力コードを埋め込む)

simple_formatメソッド

デフォルトで文字列をpタグで囲い、改行を置換してくれます。

sanitizeオプション

テキストに含まれる一部危険なHTMLタグを取り除いてくれます。ただ、一部のタグしか安全な形にできないので全てのタグを安全にしたい場合はfalseにしてhメソッドで実装すると良いでしょう。

wrapper_tagオプション

デフォルトで囲まれるタグはpタグですが、div等囲むタグを他のタグに置換することができます。

sprintfメソッド

文字列を指定したフォーマットに整形する。

number_xxxxメソッド

数値を様々な形式に加工する。(円やドルやKB等)

strftimeメソッド

日付データを整形する。

リンク関連のビューヘルパー

link_toメソッド

テキストリンクを生成するビューヘルパーです。普通にaタグを使って書くこともできますがこちらの方がモデルやルートと連携できる等Railsの機能との親和性が高いので優先的に使いましょう。

url_forメソッド

ルート定義から動的にURLを生成する。

link_to_if/link_to_unlessメソッド

条件に応じてリンクを生成する。

link_to_unless_currentメソッド

現在のページの場合はリンクを無効化する。

mail_toメソッド

メールアドレスへのリンクを生成する。

外部リソース指定のためのビューヘルパー(Assetヘルパー)

image_tagメソッド

画像を表示する。

audio_tag/video_tagメソッド

音声や動画をブラウザで再生する。

auto_discovery_link_tagメソッド

ブラウザのフィード検出機能を有効にする。(RSSフィードやAtomフィード等)

favicon_link_tagメソッド

サイトのファビコンを定義する。

stylesheet_link_tagメソッド

読み込ませるCSSファイルを定義する。

javascript_include_tagメソッド

読み込ませるJavaScriptファイルを定義する。WebpackでビルドしたJavaScriptをインクルードすることが可能です。

xxx_pathメソッド

外部リソースのパスを取得する。

その他のビューヘルパー

debugメソッド

構造化データ(テンプレートに渡された配列やオブジェクト)をダンプ出力(YAML形式)する。

captureメソッド

断片的なテンプレートの出力結果を変数に格納する。

tagメソッド

Rails5.1で追加されたタグを生成することができるビューヘルパーです。従来からあるcontent_tagメソッドに比べてシンプルに記述可能です。デフォルトでHTML5もサポートしています。

構文

1
tag.タグ名

例

1
tag.span class: 'test'

上記の記述では下記のようなタグが生成されます。

1
<span class="test"></span>

content_tagメソッド

タグを生成できるビューヘルパーです。レガシーな記法であるとされているのでできるたけtagメソッドを使うようにした方が良いでしょう。

1
content_tag :span, nil, class: 'test'

上記の記述では下記のようなタグが生成されます。

1
<span class="test"></span>

エスケープする

<%= 文字 %>

erbのデフォルトでエスケープします。

h

html_escapeと同じです。

XSS(クロスサイトスクリプティング)の対策をすることができます。例えば「<」であれば「&lt;」に置換してくれます。

sanitizeメソッド

与えられた文字列からHTMLの属性を除去する。(サニタイズする。)

html_escape

hのエイリアスメソッドで同じです。

safe_join(配列,改行)

配列に含まれる文字をエスケープして結合して、<br>を加えることが可能です。

エスケープしない

html_safe

nilにはhtml_safeがないので例外が発生してしまいます。

raw

nilでも使えるので「html_safe」よりも良いらしいです。

<%== 文字 %>

rawよりも良いし、nilでもエラーが起きないのでrawよりも良いらしい。

simple_format

pタグや改行コードをbrに置換してくれます。hオプションを併用すればエスケープすることができます。

スポンサーリンク
  • 2020 09.16
  • miyabisan2
  • コメントを書く
  • Ruby on Rails
  • Tweets Twitter
  • このエントリーをはてなブックマークに追加
  • LINEで送る

関連記事

  1. 2019 11.30

    【Ruby on Rails】マイグレーション、マイグレーションファイルの書き方

  2. 2020 07.18

    【Ruby on Rails】「ActionText」のリッチテキストを使う

  3. 2018 06.17

    【Ruby on Rails】概要(他言語への影響、環境別構成例、テストフレームワーク)

  4. 2019 12.08

    【Ruby on Rails】モデルを共通化する。

  5. 2020 07.18

    【Ruby on Rails】環境変数に関する知識、direnv

  6. 2019 11.23

    【Ruby on Rails】Bundler、Gemfileについて

  • コメント ( 0 )
  • トラックバック ( 0 )
  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

返信をキャンセルする。

【セキュリティ】「マルウェア」の種類(ウイルス、ワーム…

【データベース】「分散データベース」、「2相コミットメ…

RETURN TOP

著者プロフィール

エンジニア歴10年で過去に業務系、Webデザイン、インフラ系なども経験あります。現在はWeb系でフロントエンド開発中心です。

詳細なプロフィールはこちら

スポンサーリンク

カテゴリー

  • Android
  • AngularJS
  • API
  • AWS
  • C++
  • CSS
  • cursor
  • C言語
  • DDD
  • DevOps
  • Django
  • Docker
  • Figma
  • Git
  • GitLab
  • GraphQL
  • gRPC
  • Hasura
  • Java
  • JavaScript
  • Kubernetes
  • Laravel
  • linux
  • MySQL
  • Next.js
  • nginx
  • Node.js
  • NoSQL
  • Nuxt.js
  • Oracle
  • PHP
  • Python
  • React
  • Redux
  • Rspec
  • Ruby
  • Ruby on Rails
  • Sass
  • Spring Framework
  • SQL
  • TypeScript
  • Unity
  • Vue.js
  • Webサービス開発
  • Webデザイン
  • Web技術
  • インフラ
  • オブジェクト指向
  • システム開発
  • セキュリティ
  • その他
  • データベース
  • デザインパターン
  • テスト
  • ネットワーク
  • プログラミング全般
  • マイクロサービス
  • マイクロソフト系技術
  • マルチメディア
  • リファクタリング
  • 副業
  • 未分類
  • 業務知識
  • 生成AI
  • 設計
  • 関数型言語
RETURN TOP

Copyright ©  プログラミングマガジン | プライバシーポリシー