2024年2月

はじめに 今回はRuby on rails6にて画像認識で自動的にタグをつけてくれる処理と自然言語処理をすることにより、投稿がネガティブなものなのか、ポジティブなものなのかを判断するAIを実装していこうと思います。今回実装していく機能では、Google Cloud Platformが提供している「Cloud Vision API」と「Cloud Natural Language API」の二つを使用していきます。 Cloud Vision APIとは Cloud Vision API は、 Google が提供する画像認識サービスで、 Google 独自の機械学習モデルを採用しています。これによって効率的に画像を分析し、様々なことを実現することが可能になります。例えば、 ・画像に何が移っているかを判別する・手書きの文字を読み取る・画像から顔を検出する といったようなことができるようになります。Cloud Vision APIの機能をざっくりと以下の表にまとめます。 機能説明LABEL_DETECTION画像全体に対して画像コンテンツ分析を実行し、結果を返します。TEXT_DETECTIONtext画像内のテキストに対して光学式文字認識（ocr）を実行します（文字数制限あり）。DOCUMENT_TEXT_DETECTION高密度テキスト画像に対して光学式文字認識（ocr）を実行します（プレミアム機能では文字数制限なし）。FACE_DETECTION画像内の顔を検出します。LANDMARK_DETECTION画像内の地理的ランドマークを検出します。LOGO_DETECTION画像内の企業ロゴを検出します。SAFE_SEARCH_DETECTION画像の画像セーフサーチ プロパティを判別します。IMAGE_PROPERTIES画像の一連のプロパティ（画像のドミナント カラーなど）を計算します。図1. Cloud Vision API 機能表 Cloud Natural Language APIとは Cloud Natural Language APIは、文章をAPIをリクエストとして、その内容をGoogleの機械学習アルゴリズムが分析してその文字列の感情を数値化したり、構造、意味を返してくれるというAPIとなっています。これによってできることは、 ・ニュース記事やブログ記事で言及されている人、場所、イベントなどの情報を抽出する・文章がポジティブなものかネガティブなものかという感情認識を行う・テキストがどんなカテゴリに属していそうかを分類する といったことです。Cloud Natural Language APIの機能をざっくりと以下の表にまとめます。 機能のタイプ説明感情分析指定されたテキストを調べて、そのテキストの背景にある感情的な考え方を分析します。エンティティ分析指定されたテキストに既知のエンティティ（著名人、ランドマークなどの固有名詞）が含まれていないかどうかを調べて、それらのエンティティに関する情報を返します。構文解析指定されたテキストの内容を分析します。エンティティ感情分析エンティティ分析と感情分析の両方を組み合わせたものであり、テキスト内でエンティティについて表現された感情（ポジティブかネガティブか）の特定を試みることが可能です。図1. Cloud Natural Language API 機能表 Google Cloud Platformの設定 次に、Google Cloud Platform(以下GCP)の設定をしていきます。GCPのアカウント登録などはこちらをご参照ください。https://cloud.google.com/free/docs/free-cloud-features?hl=ja ①新しいプロジェクトの作成 まず、画像の赤丸の位置をクリックします。 次に新しいプロジェクトというところを選択し、プロジェクト名は自分の好きなようにつけ、場所は特に目的がないのであれば、組織なしで作成します。 そしてしばらく待つとプロジェクトの作成が完了します。 ②APIキーの発行 先ほどと同じく赤丸の位置をクリックすると自分で作成したプロジェクトが表示されると思うので、自分で作成したプロジェクトを選択しましょう。 左上の三本線を押し、メニューから「APIとサービス」→「認証情報」を選択しましょう。 次に、上の「認証情報を作成」から「APIキー」を選択するとAPIキーが作成されます。このAPIキーは非常に重要なものなので、必ずどこかにメモで控えておきましょう。そしてほかの人に公開するというようなことはしないようにしてください。 ③APIの有効化 次に、今回使用するAPIの有効化をするので、APIとサービスのライブラリを選択します。 ライブラリのページを開くことができたら、検索窓にvisionと入力し、検索します。すると「Cloud Vision API」が検索結果に出てくると思うので選択してください。 選択すると画像のようなページに飛ぶと思うので、有効にするを押します。 このようなページに飛んでいれば成功しています。また、「有効なAPIとサービス」から このように「Cloud Vision API」が適用されていることが確認できます。同じように「Cloud Natural Language API」も適用してみましょう。検索窓にはnaturalなどと入れると出てくると思います。すると以下のようになりました。 これで2つ有効になっていることが確認できたので、GCPでの準備は終わりです。 Cloud Vision APIの実装 ①APIキーの管理 まずは先ほど作成したプロジェクトのapiキーを管理する方法を記述していきます。 Gemfileに以下の記述をし、bundle installをします。 gem 'dotenv-rails' dotenv-railsは環境変数を管理することができるgemです。自身で作成したアプリケーションの直下に.envファイルを作成することで、パスワードなどネット上に公開させたくない情報を扱い、自動で読み込むことが可能になります。 ではさっそくアプリケーション直下に.envファイルを作成していきます。 .envファイルの中には以下の記述をします。APIキーは先ほど作成した自分のものを使用してください。 GOOGLE_API_KEY=&quot;API Keyの値をこちらに記載&quot; そしてgitで管理している人が忘れてはいけないことが、.envファイルをgitで管理しないように変更することです。APIキーというものは大抵の場合、使いすぎると課金が発生したり、いろいろな人が利用すると提供している側からapiの使用を差し押さえられてしまいます。なので、githubにapiの情報をpushしてしまうと、誰かに悪用されてしまうかもしれません。 そこで登場するのが、.gitignoreというファイルです。このファイルの中に書いてあるファイルはgitの管理下に置かれないというものです。railsでは標準で.gitignoreファイルを作成してくれるので、探して開いてみましょう。.gitignoreにはすでにいろいろ書かれていると思いますが、任意の場所に新しく行を作って以下の記述をしてください。 /.env これで.envをgit の管理下から外すことができました ②ライブラリの作成 ここではCloud Vision APIを呼ぶためのライブラリを作成していきます。自分で作成するライブラリはlibファイルの下に置きます。libファイルの中にvision.rbを作成します。vision.rbの中には以下を記述してください。 require 'base64' require 'json' require 'net/https' module Vision class &lt;&lt; self def get_image_data(image_file) # APIのURL作成 api_url = &quot;https://vision.googleapis.com/v1/images:annotate?key=#{ENV['GOOGLE_API_KEY']}&quot; # 画像をbase64にエンコード base64_image = Base64.encode64(image_file.tempfile.read) # APIリクエスト用のJSONパラメータ params = { requests: [{ image: { content: base64_image }, features: [ { type: 'LABEL_DETECTION', maxResults: 3 } ] }] }.to_json # Google Cloud Vision APIにリクエスト uri = URI.parse(api_url) https = Net::HTTP.new(uri.host, uri.port) https.use_ssl = true request = Net::HTTP::Post.new(uri.request_uri) request['Content-Type'] = 'application/json' response = https.request(request, params) response_body = JSON.parse(response.body) # APIレスポンスをログに出力 Rails.logger.debug &quot;API response: #{response_body}&quot; # APIレスポンス出力 if (error = response_body['responses'][0]['error']).present? raise error['message'] else response_body['responses'][0]['labelAnnotations'].pluck('description').take(3) end end end end はい。なんだかよくわかりませんね。部分ごとに分けて解説していきます。 module Vision class &lt;&lt; self def get_image_data(image_file) 今回はVisionというmoduleのなかにget_image_data(image_file)というクラスを定義しています。 # APIのURL作成 api_url = &quot;https://vision.googleapis.com/v1/images:annotate?key=#{ENV['GOOGLE_API_KEY']}&quot; # 画像をbase64にエンコード base64_image = Base64.encode64(image_file.tempfile.read) api_urlはapiを呼び出すためのurlです。そして、Cloud Vision APIではbase64という形に画像を変換する必要があるので、base64_imageとして変換しています。 # APIリクエスト用のJSONパラメータ params = { requests: [{ image: { content: base64_image }, features: [ { type: 'LABEL_DETECTION', maxResults: 3 } ] }] }.to_json ここではjsonでリクエストを書いています。LABEL_DETECTIONはこちらで説明した機能の部分にあたります。今回は画像コンテンツ分析の機能を使用します。maxResultsは結果をいくつ返すかというものです。今回は3に設定してあります。 # Google Cloud Vision APIにリクエスト uri = URI.parse(api_url) https = Net::HTTP.new(uri.host, uri.port) https.use_ssl = true request = Net::HTTP::Post.new(uri.request_uri) request['Content-Type'] = 'application/json' response = https.request(request, params) response_body = JSON.parse(response.body) # APIレスポンスをログに出力 Rails.logger.debug &quot;API response: #{response_body}&quot; # APIレスポンス出力 if (error = response_body['responses'][0]['error']).present? raise error['message'] else response_body['responses'][0]['labelAnnotations'].pluck('description').take(3) end Cloud Vision APIにリクエストを送り、成功したときはapiでの分析の結果が返ってくるようにしています。この際にデバッグできるようにRails.loggerのデバッグ用の記述を書いています。 自作したライブラリはこのままでは動いてくれないので、config/application.rbに読み込むための記述をします。以下の一文を追加しておきましょう。 config.paths.add 'lib', eager_load: true ③モデルファイルの作成＆ビューファイルの修正 ここでようやくいつものrailsのようなコードを書いていきます。長かった... 今回は本の投稿に画像を添付し、その画像コンテンツを分析する仕様にします。その結果をタグとして付けたいので、そのタグを保存するためのmodelを作っていきます。 ターミナル↓ rails g model tag name:string book_id:integer rails db:migrate models/tag.rb class Tag &lt; ApplicationRecord belongs_to :book end models/book.rb has_many :tags, dependent: :destroy #追加 モデルの作成は以上です。次に、ビューファイルを少し修正していきます。 booksのindexページは部分テンプレートで作っているので、以下のように修正します。 &lt;table class='table table-hover table-inverse'&gt; &lt;thead&gt; &lt;tr&gt; &lt;th&gt;&lt;/th&gt; &lt;th&gt;Title&lt;/th&gt; &lt;th&gt;Opinion&lt;/th&gt; &lt;th&gt;Tag&lt;/th&gt; &lt;th colspan=&quot;3&quot;&gt;&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;tbody&gt; &lt;% books.each do |book| %&gt; &lt;tr&gt; &lt;td&gt;&lt;%= link_to(book.user) do %&gt; &lt;%= image_tag book.get_image, size:'50x50' %&gt; &lt;% end %&gt; &lt;/td&gt; &lt;td&gt;&lt;%= link_to book.title,book %&gt;&lt;/td&gt; &lt;td&gt;&lt;%= book.body %&gt;&lt;/td&gt; #ここから &lt;td&gt; &lt;% book.tags.each do |tag| %&gt; &lt;span class=&quot;label&quot;&gt;&lt;%= tag.name %&gt;&lt;/span&gt; &lt;% end %&gt; &lt;/td&gt; #ここまで &lt;td id=&quot;favorite_buttons_&lt;%= book.id %&gt;&quot;&gt; &lt;%= render &quot;favorites/favorite&quot;, book: book %&gt; &lt;/td&gt; &lt;td&gt;&lt;%= &quot;コメント数: #{book.book_comments.count}&quot; %&gt;&lt;/td&gt; &lt;/tr&gt; &lt;% end %&gt; &lt;/tbody&gt; &lt;/table&gt; これに合わせてshowファイルを以下のように変更していきます。 &lt;div class='container'&gt; &lt;div class='row'&gt; &lt;div class='col-md-3'&gt; &lt;h2&gt;User info&lt;/h2&gt; &lt;%= render 'users/info', user: @user %&gt; &lt;h2 class=&quot;mt-3&quot;&gt;New book&lt;/h2&gt; &lt;%= render 'form', book: @new_book %&gt; &lt;/div&gt; &lt;div class='col-md-8 offset-md-1'&gt; &lt;h2&gt;Book detail&lt;/h2&gt; &lt;table class='table'&gt; &lt;tr&gt; &lt;td&gt;&lt;%= link_to(@book.user) do %&gt; &lt;%= image_tag @book.get_image, size:&quot;100x100&quot; %&gt;&lt;br&gt; &lt;%= @book.user.name %&gt; &lt;% end %&gt; &lt;/td&gt; &lt;td&gt;&lt;%= link_to @book.title, @book %&gt;&lt;/td&gt; &lt;td&gt;&lt;%= @book.body %&gt;&lt;/td&gt; #ここから &lt;td&gt; &lt;% @book.tags.each do |tag| %&gt; &lt;span class=&quot;label&quot;&gt;&lt;%= tag.name %&gt;&lt;/span&gt; &lt;% end %&gt; &lt;td&gt; #ここまで &lt;% if @book.user == current_user %&gt; &lt;td&gt;&lt;%= link_to 'Edit', edit_book_path(@book), class: &quot;btn btn-sm btn-success&quot; %&gt;&lt;/td&gt; &lt;td&gt;&lt;%= link_to 'Destroy', @book, method: :delete, data: { confirm: '本当に消しますか？' }, class: &quot;btn btn-sm btn-danger&quot;%&gt;&lt;/td&gt; &lt;% end %&gt; &lt;td id=&quot;favorite_buttons_&lt;%= @book.id %&gt;&quot;&gt; &lt;%= render &quot;favorites/favorite&quot;, book: @book %&gt; &lt;/td&gt; &lt;td&gt;&lt;%= &quot;コメント数: #{@book.book_comments.count}&quot; %&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;div id=&quot;comments_area&quot;&gt; &lt;%= render &quot;book_comments/comments&quot;, book: @book %&gt; &lt;/div&gt; &lt;div class=&quot;new-comment&quot;&gt; &lt;%= render &quot;book_comments/form&quot;, book: @book, book_comment: @book_comment %&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; ついでにタグのcssも適当に作っていきます。 app/assets/stylesheets/application.css↓ .label { background-color: #337ab7; font-weight: 500; display: inline; padding: .2em .6em .3em; font-size: 75%; font-weight: bold; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25em; } はい。これで下準備が整いました。 ④コントローラの修正 createの部分を以下のように変更します。 def create @book = Book.new(book_params) @book.user_id = current_user.id if @book.image.attached? tags = Vision.get_image_data(book_params[:image]) else tags = [&quot;none&quot;] end if @book.save tags.each do |tag| @book.tags.create(name: tag) end redirect_to book_path(@book), notice: &quot;You have created book successfully.&quot; else @books = Book.all render 'index' end end なんかよくわからない記述が出てきましたね。 if @book.image.attached? tags = Vision.get_image_data(book_params[:image]) else tags = [&quot;none&quot;] end この部分が今回の大きな変更箇所です。画像を投稿するフォームで画像があるときには先ほど作成したVisionのライブラリを呼び出し、apiに分析させるという記述です。そして、画像が添付されなかった場合には自動的にnoneのタグをつけるようにしました。この状態でフォームを送ると以下のようになります。 フォームに入力↓ 投稿後↓ 画像を分析した結果がタグについています。これで成功です。 番外編 デバッグ ここではデバッグをする方法を簡単に説明していきます。railsでは開発環境での実行ログをlog/development.logにて管理しています。サーバーを立ち上げたままこのファイルを監視していきます。サーバーを閉じずに別のターミナルを開き、以下のコマンドを打ち込みます。 tail -f log/development.log | grep response これでリアルタイムでrailsの動きを監視することができます。tail -f log/development.logだけでもいいですが、これだとrails上で動いているすべてのリクエストが返ってきてしまうため、apiのレスポンスを見たいときには適していません。なので、grepで検索しながら見てあげるととても見やすくなります。このコマンドを実行して、もう一度投稿してみましょう。結果が以下になります。 今回タグとして使用している場所はdescriptionと書いてある場所になります。 Cloud Natural Language APIの実装 ①ライブラリの作成 先ほどapiキーの設定などをやったので、今回はライブラリの作成からになります。もしまだやっていない方はこちらをご確認ください。 先ほどと同じようにlibファイルの下にライブラリを作成していきます。今回はlanguage.rbというファイルで作成しました。 require 'base64' require 'json' require 'net/https' module Language class &lt;&lt; self def get_data(text) # APIのURL作成 api_url = &quot;https://language.googleapis.com/v1/documents:analyzeSentiment?key=#{ENV['GOOGLE_API_KEY']}&quot; # APIリクエスト用のJSONパラメータ params = { document: { type: 'PLAIN_TEXT', content: text } }.to_json # Google Cloud Natural Language APIにリクエスト uri = URI.parse(api_url) https = Net::HTTP.new(uri.host, uri.port) https.use_ssl = true request = Net::HTTP::Post.new(uri.request_uri) request['Content-Type'] = 'application/json' response = https.request(request, params) # APIレスポンス出力 response_body = JSON.parse(response.body) # APIレスポンスをログに出力 Rails.logger.debug &quot;API response: #{response_body}&quot; if (error = response_body['error']).present? raise error['message'] else response_body['documentSentiment']['score'] end end end end ここのライブラリも先ほどまでとほとんど同じですが、type: 'PLAIN_TEXT'を指定しています。ここはHTMLまたはPLAIN_TEXTを指定できますが、今回はテキストを入力するので、PLAIN_TEXTにしています。そして受け取る値は['documentSentiment']['score']というもので、これは送られた文章がポジティブかネガティブかを判断してくれます。 ②モデルファイルの作成&amp;ビューファイルの編集 まずはbookのmodelにscoreのカラムを追加していきます。 ターミナル↓ $ rails g migration AddScoreToBooks 'score:decimal{5,3}' $ rails db:migrate 今回の感情分析のスコアは-1~1の範囲で送られてくるので、小数点を扱えるdecimal形で作成します。{5,3}はprecision: 5, scale: 3という意味になっています。これは簡単に言うと全体で5桁、小数点以下3桁という意味になります。 次にビューファイルを作成していきます。 _index.html.erb↓ &lt;td&gt;&lt;%= book.score %&gt;&lt;/td&gt; # 追加 show.html.erb &lt;td&gt;&lt;%= @book.score %&gt;&lt;/td&gt; #追加 これで下準備が整いました。 ③コントローラの編集 @book.score = Language.get_data(book_params[:body]) はい。この一行をcreateの中に追加するだけです。今回はbodyが空で投稿された場合はバリデーションではじかれるので、if文で処理しなくてもエラーで弾かれません。この一行によってscoreカラムにはフォームのbodyの内容がネガティブなものかポジティブなものかapiが判断した数値が格納されます。 これで完成なので、どのような動きになるか見てみましょう。 フォームに入力↓ 投稿結果↓ このようにポジティブなことを書くと+のスコアが表示され、ネガティブなことを書くと-のスコアが表示されます。試しにデバッグしてみてみましょう。 しっかりと値を受け取れていますね。表示されている値もdocumentSentimentのscoreなので、正常です。 おわり ここまでお付き合いくださり、ありがとうございました。rails6にaiの機能を入れようと今回のことを始めてみたのはいいものの、いろいろなところでエラーが出てきて想像以上に時間がかかってしまいました。GCPにはまだたくさんのAPIが用意されているので、いろいろ試してみてください！調子に乗って使いまくると課金されてしまうので、ご注意を...この下に、今回作成したアプリのリポジトリを置いておきます。当記事を読んでいただきありがとうございました。 https://github.com/0611NASKA/Bookers2-blog/tree/ai

2024年2月

AWSでrailsのアプリケーションをデプロイする

【Ruby on rails6】画像認識と自然言語処理の実装