LoginSignup
51
33

More than 3 years have passed since last update.

[Ruby]QRコードの生成、埋め込み

Last updated at Posted at 2018-05-28

はじめに

Ruby(Rails)でQRコード生成周りを調査したので、なるべく網羅的に知見をまとめておく。

QRコードとは

参考:QRコードとは

誤り訂正符号(リードソロモン符号)
QRコードの一部分が損傷した場合でもデータを損失することなく、復元することができるようにリードソロモン法を用いて生成された符号のこと。復元率は、シンボルの損傷の度合いに応じた4段階のレベルを持っています。


なお、バージョンとはQRコードの大きさを表し、データ量が増えるとバージョンが大きくなります。(サイズも大きくなります。)

導入gem

gem : rqrcode
gem : rqrcode_png
gem : chunky_png

サンプルコード

PNGで保存

require 'rqrcode'
require 'rqrcode_png'

content = 'Hello World'
size    = '3'           # 1..40
level   = :h            # l, m, q, h

# QRコードの生成
qr  = RQRCode::QRCode.new(content, size: size, level: level)
png = qr.to_img
#リサイズして保存
png.resize(200, 200).save("#{content}_#{size}_#{level.to_s}.png")

参考:Rubyで簡単にQRコード画像を生成する方法

base64エンコードして表示

require 'rqrcode'
require 'rqrcode_png'
require 'chunky_png' # to_data_urlはchunky_pngのメソッド

content = 'Hello World'
size    = '3'           # 1..40
level   = :h            # l, m, q, h

qr = RQRCode::QRCode.new(content, size: size, level: level)
# png変換->リサイズ->base64エンコード
@qr_base64 = qr.to_img.resize(200, 200).to_data_url
ビュー
<img src ="<%= @qr_base64 %>">

参考:Railsでファイル保存をせずにPNGデータとしてQRコード表示

SVGで表示

require 'rqrcode'
require 'rqrcode_png'

content = 'Hello World'
size    = '3'           # 1..40
level   = :h            # l, m, q, h

#インスタンス変数にSVGとして格納→viewで出力
@qr = RQRCode::QRCode.new(content, size: size, level: level).as_svg.html_safe
ビュー
<%= @qr %>

参考:RailsでQRコードを表示するのがとても簡単だった(rqrcode)

あるいは参考記事のようにアプリケーションヘルパーにメソッドを作ることでアプリケーション全体から共通で呼び出せる。
オプションを指定しない場合、デフォルト値はsize=4, level=":h" 。

application_helper.rb
require 'rqrcode'
require 'rqrcode_png'

def qrcode(text, options = {})
    ::RQRCode::QRCode.new(text, options).as_svg.html_safe
end
ビュー
<%= qrcode "Hello world" {size: 3,  level: :h} %>

SVGとは(ざっくり説明)

jpg, pngなどのラスタ形式がpixelごとに情報を持つのに対し、svgはベクタ形式で描画に関する式の集合のようなもので情報を持つ。そのため、画像の拡大縮小・回転が容易であり、いろいろなサイズできれいに描画できる。幾何的な画像に向くが、複雑な画像(風景など)には向いていない。また、環境によっては描画できない(参考)。

実装例

こういう風に実装したらどうだろうという妄想

qr_controller.rb
require 'rqrcode'
require 'rqrcode_png'
require 'chunky_png'

def show
  #GETパラメータ受け取り
  request_id = params[:id]
  #
  # ここにrequest_idに一致するQR情報をDBから持ってくる処理を書く
  # qr_dataに格納
  #

  # 見つからなかった場合
  send_data(body: "error.png", style: image/png, disposal: inline) and return
  # 見つかった場合
  qr  = RQRCode::QRCode.new(qr_data.content, qr_data.option)
  png = qr.to_img.resize(200, 200)
  send_data(body: png, style: image/png, disposal: inline) and return
end

# ...

QRレコードを作り、コンテンツとオプション、その他フラグなどを管理する。/qr.png?id=1234のURIでid=1234のQRコードにアクセスできる。imgタグのsrc属性に指定することでQRコードの埋め込みができる。

おわりに

モバイルサイトやアプリインストールへの誘導などQRが有効な場面は多いためうまく活用していきたい。

51
33
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
51
33