カスタム液体タグの実装


液体タグは素晴らしい悪魔です.投稿するには、いくつかのカスタム液タグを使用して記事を投稿すると、GIST、Gitthub Repos、Twitchストリームともっとたくさん.液体タグがどのように働くかについて理解するために.
GISTの液体タグを作ります.以下のようなURLで提供された場合、gistをレンダリングします
< div >
あなたは、ボイラープレート支店< br/>でこのプロジェクトのためにボイラープレートを得ることができます
<> P >
クラスをハイライト表示する
$ git clone https://github.com/Rafi993/custom-liquid-tags
$ cd custom-liquid-tags
$ git checkout boilerplate
$ bin/setup
< div >
<高橋潤子>p >

ヒア 液体テンプレート言語


液体はSusify(erbと同様)によって作成されたテンプレート言語です.ジェムファイルに液体を加え、バンドルインストール< br/>を実行することで、プロジェクトに液体 を含める予定です
<> P >
クラスをハイライト表示する
gem 'liquid', '~> 4.0', '>= 4.0.3'
< div >
< ulink >ユーザコンテンツの液タグを解析するには、プレビューアクション< br/>で次のことができます
<> P >
クラスをハイライト表示する
  def preview
    @template = Liquid::Template.parse(params[:text])
    @parsed_html = @template.render()
    render "preview"
  end
< div >
< tag >と液体タグは今では< tt/p >です
<堀田>
<堀田>
< tag >これらのデフォルトのタグを後で無効にします.

宝石 カスタムタグ


最初に我々はアプリ/リリディーズのタグを作成します/Liquidchen Tagchyベース.RB < br/>
すべての液体タグが継承するbr/>
<> P >
クラスをハイライト表示する
class LiquidTagBase < Liquid::Tag
  def self.script
    ""
  end

  def initialize(_tag_name, _content, parse_context)
    super
  end
end
< div >
< tag >すべての液体タグを共有する必要のある共通のコードがある場合は、ここに置きます.p >
それから、我々は我々のGIST Liquid Tagアプリ/LiquidLearnタグ/GistThangタグをつくります.rb私たちはこのコードについては前書きしました
<> P >
クラスをハイライト表示する
class GistTag < LiquidTagBase
  PARTIAL = "liquids/gist".freeze
  VALID_LINK_REGEXP =
    %r{\Ahttps://gist\.github\.com/([a-zA-Z0-9](-?[a-zA-Z0-9]){0,38})/([a-zA-Z0-9]){1,32}(/[a-zA-Z0-9]+)?\Z}
      .freeze

  def initialize(_tag_name, link, _parse_context)
    super

    raise StandardError, "Invalid Gist link: You must provide a Gist link" if link.blank?

    @uri = build_uri(link)
  end

  def render(_context)
    ApplicationController.render(
      partial: PARTIAL,
      locals: {
        uri: @uri,
      },
    )
  end

  private

  def build_uri(link)
    link = ActionController::Base.helpers.strip_tags(link)
    link, option = link.split(" ", 2)
    link = parse_link(link)

    uri = "#{link}.js"
    uri += build_options(option) unless option&.empty?

    uri
  end

  def parse_link(link)
    input_no_space = link.delete(" ").gsub(".js", "")
    if valid_link?(input_no_space)
      input_no_space
    else
      raise StandardError,
            "Invalid Gist link: #{link} Links must follow this format: https://gist.github.com/username/gist_id"
    end
  end

  def build_options(option)
    option_no_space = option.strip
    return "?#{option_no_space}" if valid_option?(option_no_space)

    raise StandardError, "Invalid Filename"
  end

  def valid_link?(link)
    (link =~ VALID_LINK_REGEXP)&.zero?
  end

  def valid_option?(option)
    (option =~ /\Afile=[^\\]*(\.(\w+))?\Z/)&.zero?
  end
end

Liquid::Template.register_tag("gist", GistTag)

< div >
上記コードは与えられたgist液体タグへの引数を解析し、適切なURIを生成します.また、液体タグに使用する部分を指定します.p >
< tag >このタグアプリケーション/ビュー/液体/アングルgistをレンダリングする方法を示す部分ファイルを作成します.HTML .ERB < br/>
<> P >
クラスをハイライト表示する
<div>
  <script id="gist-ltag" src="<%= uri %>"></script>
</div>
< div >
私たちが実際にGIST液体タグを使用しようとするならば、タグGISTが定義されていないと言うエラーを投げます

初期化タグ


<高橋潤子>カスタム液体タグを読み込みます
<> P >
クラスをハイライト表示する
Rails.application.config.to_prepare do

  # Custom Liquid tags are loaded here
  Dir.glob(Rails.root.join("app/liquid_tags/*.rb")).sort.each do |filename|
    require_dependency filename
  end
end
< div >
上記のコードは指定されたパスのLiquidCalタグを探し、それらをロードします.p >
GISTのタグを試してみると、< p/p >が動作します
<堀田>

デフォルトタグを無効にする


< tag >代入のようなデフォルトのタグを指定したくないかもしれません.config/initializers/液に次のコードを追加することで、それらを無効にすることができます.RB < br/>
<> P >
クラスをハイライト表示する
  # Tags to disable
  Dir.glob(Rails.root.join("lib/liquid/*.rb")).sort.each do |filename|
    require_dependency filename
  end
< div >
これらのタグをlib/液フォルダ< br/>内に定義する
<> P >
クラスをハイライト表示する
# lib/liquid/raw.rb
module Liquid
  class Raw < Block
    remove_const(:FullTokenPossiblyInvalid) if defined?(FullTokenPossiblyInvalid)
    FullTokenPossiblyInvalid = /\A(.*)#{TagStart}\s*(\w+)\s*#{TagEnd}\z/om.freeze # rubocop:disable Naming/ConstantName
  end

  Template.register_tag("raw", Raw)
end
< div >
クラスをハイライト表示する
# lib/liquid/variables.rb
module Liquid
  class Variable
    def initialize(_markup, _parse_context)
      raise StandardError, "Liquid variables are disabled"
    end
  end
end

< div >
現在のところ、割り当てのようなデフォルトのタグを使用できません.p >
プロジェクトのソースを見つけることができます
<ノート> < p/p >
< OL >
  • Formは、ユーザーがPundit Gem
  • を使用して液体タグにアクセスできるかどうかをチェックすることによって、もう少しをします
    < OL >
    Pexels

    からのVitaly Vlasovによるカバーイメージ