2019年11月9日土曜日

Heroku にデプロイしたアプリを Google Search Console のプロパティとして登録する方法

概要
環境
Heroku にテスト用のアプリ作成
サンプルアプリ作成
Dockerfile 作成
Search Console にプロパティを登録する
HTML ファイルをルートに配置する
イメージ作成
イメージアップロード
コンテナアプリデプロイ
動作確認
最後に

概要

Heroku にアプリをデプロイすると https で xxxx.herokuapp.com というドメインがアプリに振られます
Google の OAuth などと連携することを考慮するとサイトの所有者であることを証明しておく必要があります
今回は Heroku にデプロイした Ruby のコンテナアプリの所有者であることを証明する方法を紹介します

環境

Google Search Console (2019/11/07 時点)
Heroku Container Registry (2019/11/07 時点)
docker 19.03.4
heroku cli 7.33.3

Heroku にテスト用のアプリ作成

まずは Heroku にアプリを作成します

heroku create -a test-app-20191107

サンプルアプリ作成

Heroku にデプロイする Ruby アプリを作成します
このアプリの所有者であることを Search Console を使って確認します

bundle init
vim Gemfile

gem "sinatra"

bundle install --path vendor
vim config.ru

$stdout.sync = true
require './app'
run TestWebApp

vim app.rb

require 'sinatra/base'

class TestWebApp < Sinatra::Base
  get '/' do
    'ok'
  end
end

Dockerfile 作成

Heroku にデプロイする際に Container Registry としてデプロイするので Dockerfile を作成します

FROM ruby

ADD . /home
WORKDIR /home
RUN gem install bundler
RUN bundle install --path vendor

CMD bundle exec rackup config.ru -o 0.0.0.0 -p $PORT

$PORT を使ってポートが Heroku によって割り当てられる変数を使うのがポイントです

Search Console にプロパティを登録する

Google Search Console にアクセスしましょう

今回は右側の「URL プレフィックス」を選択します
Heroku に作成したアプリから URL を入力します
今回であれば https://test-app-20191107.herokuapp.com になります

続行を選択するとサイトの所有者であることを確認するための HTML ファイルがダウンロードできるのでしましょう
これをアプリのルートに配置します
また HTML ファイルを配置するまで確認は押さないようにしましょう

HTML ファイルをルートに配置する

mkdir public
mv ~/Downloads/google1234567890abcd.txt public/google1234567890abcd.html

ダウンロードしたファイルが Chrome だと .txt になってしまうので .html にリネームします
Sinatra アプリの場合ルートは public ディレクトリ配下になります
ここは各自のアプリによってことなると思うので注意してください

イメージ作成

ビルドします

docker build -t registry.heroku.com/test-20191107/web .

イメージアップロード

作成されたイメージを Heroku Container Registry にアップロードします

heroku container:login
docker push registry.heroku.com/test-20191107/web

コンテナアプリデプロイ

イメージのアップロードが完了したらアプリをリリースしましょう

heroku container:release web

デプロイできたら確認用の HTML ファイルが見えるか確認しましょう
https://test-app-20191107.herokuapp.com/google1234567890abcd.html という感じのパスで確認できれば OK です

動作確認

アプリがデプロイできたら Search Console に戻って確認ボタンを押しましょう
以下のように「所有権を確認しました」となれば登録完了です

最後に

Heroku にデプロイしたアプリを Google Search Console に登録しサイトの所有者であることを証明しました
やっていることはサイトのルートに HTML ファイルを置いているだけです
なので、アプリによってルートのパスが様々なので各自のアプリにあったパスに HTML ファイルを配置してデプロイしてください
また認証などがある場合も注意してください
認証が全ページにあるようなアプリでは Search Console から HTML ファイルが見えなく確認が失敗するので HTML ファイルのパスだけは認証がかからないような工夫が必要になるかもしれません

hawksnowlog