SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

サンプルコードで学ぶRuby on Rails 5実践入門

Rails 5のAPIモードを使ってAPIを実装

サンプルコードで学ぶRuby on Rails 5実践入門 第9回

  • X ポスト
  • このエントリーをはてなブックマークに追加

APIの新規作成[2]

APIの実装

 APIの実装を進めます。

 まず、今回のAPIに必要なrack-corsmechanizeという2つのgemを追加でインストールします。rack-corsは、ドメインが違うサーバー間での通信(クロスドメイン通信)を許可する処理をRailsアプリに簡単に入れることができるものです。mechanizeは、Google画像検索結果のHTMLの構造を解析(スクレイピング)する処理を簡単に記述できるようにするものです。

 rack-corsについてはAPIモードでRailsアプリを新規作成するとGemfileにコメントアウトされた状態で記述されているので、このコメントを外します。mechanizeは追記します。

リスト3 rails5_sample_api/Gemfile
# Use Rack CORS for handling Cross-Origin Resource Sharing (CORS), making cross-origin AJAX possible
gem 'rack-cors'
gem 'mechanize'

 bundle installを実行してgemを追加します。

bin/bundle inst

 クロスドメイン通信を許可するコードを追加します。

リスト4 rails5_sample_api/config/application.rb
…(中略)…
    config.middleware.insert_before 0, Rack::Cors do
      allow do
        origins '*'
        resource '*', :headers => :any, :methods => [:get, :post, :options]
      end
    end
…(中略)…

 rack-corsが提供するDSLであるallowブロックで、ドメインをまたいだリクエストを受け付ける処理を定義しています。

 次に、imagesコントローラーを新規作成します。

bin/rails g controller images

 ↓

Running via Spring preloader in process 27450
      create  app/controllers/images_controller.rb
      invoke  test_unit
      create    test/controllers/images_controller_test.rb

 APIモードのRailsアプリ上では、ジェネレーターコマンドでコントローラーを新規作成した場合、対応するビューファイルが自動生成されないことが実行結果から分かります。

 APIは/images/検索語句形式のリクエストをimagesコントローラーのindexアクションに割り振るようにルーティングを設定します。

リスト5 rails5_sample_api/config/routes.rb
Rails.application.routes.draw do
  get '/images/:q', to: 'images#index'
end

 imagesコントローラーにリスト6の通り、処理を追加します。

リスト6 rails5_sample_api/app/controllers/images_controller.rb
class ImagesController < ApplicationController
  def index
    page = Mechanize.new.get "https://www.google.co.jp/search?q=#{params[:q]}&tbm=isch"
    image_path = page.at('img').get_attribute :src
    render json: { image_path: image_path }
  end
end

 mechanizeを使ったWebサイトスクレイピングの方法については本題とは異なるため、詳細な解説は省略します。indexアクションの1行目でGoogle画像検索結果にアクセスし、2行目で検索結果の1番目にきたimgタグのsrc属性を取得し、3行目で取得した画像パスをJSONで返却しています。

APIの動作確認

 APIの実装が完了したら動作を確認しましょう。ローカルPC上でチャットアプリのRailsとAPIのRailsの両方を動かすので、APIはポートを3001番で起動するようにオプションを指定してRailsを起動します。

bin/rails s -p 3001

 curlコマンドでAPIを実行してみましょう。

curl localhost:3001/images/rails

 ↓

{"image_path":"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTtSXRSk7CYS9bpVi3_WVKI3wdil3em46wI0ch5S5pCrDP5i3mMIvwM_bc"}

 正常に動作している場合、上記のようなJSONが返却されます。これでAPI側の開発は一通り完了です。

次のページ
既存チャットアプリの修正

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
サンプルコードで学ぶRuby on Rails 5実践入門連載記事一覧

もっと読む

この記事の著者

WINGSプロジェクト 竹馬 力(チクバ ツトム)

WINGSプロジェクトについて> 有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

山田 祥寛(ヤマダ ヨシヒロ)

静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ(Java・C#・Python・PHP・Ruby・JSP&サーブレットなど)」「速習シリーズ(ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど)」「改訂3版JavaScript本格入門」「これからはじめるReact実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/10354 2017/08/17 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング