Ruby 用 kintone REST API クライアント(kintone_rb)を使って、サイトからの問い合わせを管理しよう!

著者名:Mamoru Fujinoki( Fuji Business International (External link)

目次

はじめに

自社の Web サイトから問い合わせやコンタクトフォームを設置して管理しているケースは多いと思います。
今回は Ruby on Rails で作成された Web サイト上の問い合わせフォームから、 kintone_rb (External link) を利用して kintone の問い合わせ管理アプリと連携して管理する方法を紹介します。

利用している SDK は、有志の開発者により作成されたものです。
サイボウズではサポート対象外となりますので、ライセンスや機能などをご確認のうえ利用してください。

下準備

  • Rails 開発環境
    Rails が初めての方は Rails をはじめよう (External link) を参考に設定してください。
  • Ruby 2.1.0 以上
    本 Tips は Ruby 3.1.2 と Rails 7.0.3 で動作を確認しています。
  • kintone アカウント

問い合わせ管理アプリの設定

STEP 1:アプリの準備

kintone アプリストアより「問い合わせ管理」アプリを追加します。

「問い合わせ管理」アプリを開き、「アプリの設定を変更する」アイコンをクリックします。

以下の表を参考に、フォームの設定画面でフィールドコード等を変更します。

フィールドの種類 フィールド名 フィールドコード
文字列(1 行) 顧客名 Customer
文字列(1 行) ご担当者名 Customer_name
ラジオボタン 問い合わせ種別 QType
文字列(複数行) 詳細 Detail

STEP 2:API トークンの設定

次に「設定」タブを開き、「API トークン」をクリックします。

「生成する」ボタンをクリックし、「レコードの追加」にチェックを入れます。 その後、設定を保存します。

生成した API トークンは、コーディングの際必要になるのでメモしておきます。
また、アプリの ID も控えておきます。
以下のサンプルアプリの場合は 103 です。

最後にアプリの設定を反映させるために「アプリの更新」をクリックします。

以上で「問い合わせ管理」アプリの設定は終了です。

問い合わせフォームの作成

STEP 1:Ruby on Rails の開発環境準備

それでは Ruby on Rails による問い合わせフォームを作りましょう。
Ruby on Rails の開発環境がない場合は、 Railsをはじめよう (External link) を参考に設定してください。

ターミナルを開き、次のコマンドを実行します。

1
rails new contact

これにより Contact という Rails のアプリケーションが作成されます。
これ以降のコマンドは、作成された contact ディレクトリー内で実行するので、以下のコマンドでディレクトリーを移動してください。

1
cd contact

STEP 2:kintone_rb のインストール

フォーム作成の前に kintone_rb をインストールします。

Gemfile を開いてコマンドを追加します。
ファイルの最後に、次の内容を記載します。

1
gem 'kintone_rb'

ファイルを保存後、次のコマンドを実行します。

1
bundle install

STEP 3:コントローラーの作成

次のコマンドでコントローラーを作成します。

1
rails generate controller inquiries

コントローラー名は例として「inquiries」とします。

STEP 4:コードの編集

次に「Config」フォルダー内の「routes.rb」ファイルを開いて、次のコードを参考に編集します。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
=begin
RoR Route Config Sample
Copyright (c) 2018 Cybozu
Licensed under the MIT License
=end

Rails.application.routes.draw do
  get '/inquiries', to: 'inquiries#new'
  post '/inquiries', to: 'inquiries#create'
  resources :inquiries

  root 'inquiries#new'
end
コードの解説

今回は問い合わせフォームのみ作成するため、以下のようにルーティングを定義しました。

HTTP メソッド パス アクション 目的
GET /inquiries inquiries#new 問い合わせを 1 つ作成するための HTML フォームを返す
POST /inquiries inquiries#create 問い合わせを 1 つ作成する

リソース名は先ほど作成した「inquiries」を指定しています。

10
resources :inquiries

また、ホームページには問い合わせ作成のフォームを設定します。

12
root 'inquiries#new'

STEP 5:new.html.erb ファイルの作成

「views」フォルダー内の「inquiries」フォルダー内に「new.html.erb」ファイルを作成します。

次のコードを参考に form builder を使って、問い合わせフォームを作成します。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<%#
# RoR Webform View Sample
# Copyright (c) 2018 Cybozu
# Licensed under the MIT License
%>

<h1>お問い合わせ</h1>
<%= form_for :inquiry, url: inquiries_path do |form| %>
  <p>
    <%= form.label :company_name, "会社名:" %><br>
    <%= form.text_field :company_name %>
  </p>
  <p>
    <%= form.label :client_name, "お名前:" %><br>
    <%= form.text_field :client_name %>
  </p>
  <p>
    <%= form.label :contact_type, "問い合わせ種別:" %><br>
    <table style="border: 1px solid black;">
      <tr>
        <td>
    <%= form.radio_button :contact_type, "製品について"%>
    <%= form.label :product, "製品について" %>
    <%= form.radio_button :contact_type, "受発注について"%>
    <%= form.label :order, "受発注について" %>
    <%= form.radio_button :contact_type, "お客様対応について"%>
    <%= form.label :claim, "お客様対応について" %>
    <%= form.radio_button :contact_type, "その他"%>
    <%= form.label :misc, "その他" %>
        </td>
      </tr>
    </table>
  </p>
  <p>
    <%= form.label :details, "詳細:" %><br>
    <%= form.text_area :details, size: "50x6" %>
  </p>

  <p>
    <%= form.submit "送信" %>
  </p>
<% end  %>

以下のようなフォームが生成されます。

STEP 6:モデルの生成

次にさきほど指定した resource 名のモデルを生成します。
次のコマンドを実行し、「inqury」モデルを生成します。

1
rails generate model Inquiry company_name:string client_name:string contact_type:string details:text

これで次のモデルが生成されます。

フィールド名 フィールドタイプ
company_name string
client_name string
contact_type string
details text

以下のコマンドでマイグレーションを実行して、データベースにテーブルを作成します。

1
rails db:migrate

これで Inquiries テーブルがデータベース上に作成されます。
今回はデフォルトのデータベース「sqlite3」を使用しています。
まだインストールされていない場合は次のコマンドを実行してインストールしてください。

1
gem install sqlite3

STEP 7:コントローラーの編集

次にさきほど作成したコントローラーを編集します。
「Controllers」フォルダー内の「inquiries_controller.rb」をエディターで開きます。

下記を参考にコードを作成します。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
=begin
RoR Controller Sample
Copyright (c) 2018 Cybozu
Licensed under the MIT License
=end

require 'kintone_rb'
class InquiriesController < ApplicationController

  def new
  end

  def create
    @inquiry = Inquiry.new(inquiry_params)
    if @inquiry.save
      # Use token authentication
      api = Kintone::Api.new("{サブドメイン名}.cybozu.com", "{APIトークン}")
      app = {アプリケーションID}

      # Record register(single record)
      # Use Hash
      record = {"Customer" => {"value" => inquiry_params[:company_name]},
                "Customer_name" => {"value" => inquiry_params[:client_name]},
                "QType" => {"value" => inquiry_params[:contact_type]},
                "Detail" => {"value" => inquiry_params[:details]}
                }
      api.record.register(app, record)
      redirect_to root_path
    else
      render 'new'
    end
  end

  private
    def inquiry_params
      params.require(:inquiry).permit(:company_name, :client_name, :contact_type, :details)
    end
end
コードの解説

今回は簡素化するためにコントローラーのアクションは newcreate のみ定義しています。
new メソッドで問い合わせフォームを表示し、create メソッドで入力データを保存します。
new メソッドは特に処理が必要ないのでメソッド内は空です。

10
11
def new
end

フォームのデータをデータベースに保存後、kintone へ登録します。

15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
if @inquiry.save
  # Use token authentication
  api = Kintone::Api.new("{サブドメイン名}.cybozu.com", "{APIトークン}")
  app = {アプリケーションID}

  # Record register(single record)
  # Use Hash
  record = {"Customer" => {"value" => inquiry_params[:company_name]},
            "Customer_name" => {"value" => inquiry_params[:client_name]},
            "QType" => {"value" => inquiry_params[:contact_type]},
            "Detail" => {"value" => inquiry_params[:details]}
            }
  api.record.register(app, record)
  redirect_to root_path
else
  render 'new'
end

kintone_rb の読み込みとインスタンスの作成部分です。

7
require 'kintone_rb'

お使いのサブドメイン名、上記で控えておいた API トークン、アプリケーション ID を指定します。
詳細は、 GitHub 上の Readme (External link) を参照してください。

16
17
18
# Use token authentication
api = Kintone::Api.new("{サブドメイン名}.cybozu.com", "{APIトークン}")
app = {アプリケーションID}

ハッシュ形式でフォームレコードを設定し、API で kintone に登録します。

21
22
23
24
25
26
27
# Use Hash
record = {"Customer" => {"value" => inquiry_params[:company_name]},
          "Customer_name" => {"value" => inquiry_params[:client_name]},
          "QType" => {"value" => inquiry_params[:contact_type]},
          "Detail" => {"value" => inquiry_params[:details]}
          }
api.record.register(app, record)

以上で Ruby on Rails による問い合わせフォームの作成は終了です。

動作確認

以下のコマンドでローカルの Rails サーバーを起動してください。

1
rails server

ブラウザーで http://localhost:3000 を URL に指定すると以下の問い合わせフォームが表示されます。

適当にデータを入力し、「送信」ボタンをクリックすると kintone に新しいレコードが追加されます。

最後に

問い合わせフォームやコンタクト履歴、アンケートの実施など社外のデータを収集する際に Ruby on Rails で作成された Web サイトを利用される方は多いと思います。
そのシステムと kintone を連携して管理する際に、今回使用した Ruby 用 REST API クライアントの「kintone_rb」が非常に便利です。
簡単なコーディングで kintone との連携できるのでお試しください。

更新履歴

  • 2022 年 6 月 30 日
    利用する kintone REST API クライアントを kintone REST API client for Ruby から kintone_rb に修正
information

この Tips は、2022 年 6 月版 kintone で動作を確認しています。