2023.08.14

Azure App ServiceでWordPressを構築する

mabushiisign

はてなブログを使っていましたが、IT系のものはWordPressでブログを始めようと思いました。
レンタルサーバを借りてやるのも良いのですが、せっかくAzureを勉強しているので、Azureで行うことにしました。
その代わり、レンタルサーバより費用がかかります。
なお、この記事では、Azureのアカウント作成などは割愛いたします。

WordPressの構築方法
リソースの作成
カスタムドメインの設定
- カスタムドメインの追加
- Azureのドメインからカスタムドメインへのリダイレクト
さいごに

WordPressの構築方法

Azureでリソースの作成にて、検索フィールドに「wordpress」と入力すると、たくさんのものが表示されます。
安全に構築したいので、Microsoftが提供する「WordPress on App Service」を使用します。

選択すると概要が表示されます。

概要を翻訳してみると、以下のように書かれており、App Serviceの他にAzure Database, CDN, Storageを使用した構成になっています。

このテンプレートは、セキュリティとパフォーマンスのベストプラクティスを備えた App Service 用に最適化された WordPress のインスタンスを提供します。これは、WordPress とそれをホストするために必要な Azure リソース (コンピューティング (App Service Web App) やデータベース (Azure Database for MySQL) など) を含むオールインワンデプロイです。高度なオプションを使用すると、Azure CDN と Azure Storage を構成して、パフォーマンスと信頼性をさらに向上させることができます。
WordPress on App Service

なお、このリソースの内容は、GitHubでソース公開されています。https://github.com/Azure/wordpress-linux-appservice

リソースの作成

それでは、リソースを作成していきます。

基本設定

リソースグループとリージョンの選択

まず、最初にリソースグループを選択します。ブログ用なのでblog-rgとしておきます。
そのあとに、リージョンと名前を設定します。リージョンは東日本(Japan East)、名前は他の人と被らない名前にしておきます。

ホスティングプランの選択

次に、スペックを選択します。
デフォルトは「Standard」ですが、アクセス数は当面来ないのとお金もかかるので、「Basic」に変更します。
2023/8時点では、App ServiceのB1で1,957円/月、Azure DatabaseのB1sで1340円/月とデータが従量課金で、3,500円/月くらいしそうです。

WordPressの設定

管理人の情報や管理画面のID/PWを設定します。

詳細設定

Azure Email Service

WordPressからメール送信するための設定です。Japanはないので、Asia Pacificにします。

Azure CDN or FrontDoor

CDNかFrontDoorかを選択します。このブログは、日本向けなので、CDNにします。

Azure Storage

デフォルトではチェックがついていませんが、せっかくなのでチェックをつけます。
また、あらかじめストレージアカウントを作成していなかったため、新規作成してもらいます。

Virtual Network

仮想LANの設定。こちらもあらかじめ作成していないので、新規作成してもらいます。

あとは、タグの設定をし確認をしたのち作成します。

作成完了

作成完了すると、デプロイが始まります。デプロイは10分ちょっとかかりました。

その後、リソースの作成時に入れた名前の「xxxxx.azurewebsite.net」にアクセスするとWordPressのインストールがされます。

こちらもしばらく待つと、サンプルの内容のブログが表示されます。
Hello World!は、日本語で「こんにちは世界!」になりますw

管理画面へアクセス

/wp-admin にアクセすると、管理画面のログイン画面が表示されます。
リソース作成した際に設定した管理者のID/PWでログインできます

カスタムドメインの設定

ブログを運営するにあたって、「xxxx.azurewebsites.net」ではちょっとさみしいです。
自分でドメインを取得し、カスタムドメイン設定するのがよいです。

カスタムドメインの追加

私の場合、すでにドメインを持っているため、それを設定しました。持っていない場合、App Serviceでドメイン取得をすることもできます。

「カスタムドメインを追加」ののち、ドメインの設定をし、保有するドメインのDNSで、AレコードまたはCNAMEレコードを設定し、検証するが通れば設定完了となります。

Azureのドメインからカスタムドメインへのリダイレクト

この状態ですと、Azureから割り当てられた「xxxx.azurewebsites.net」でもアクセスが可能な状態になっています。
こちらのアドレスは非公開にしたいため、万が一アクセスがきたら、カスタムドメインに301リダイレクトする設定をします。

このリダイレクトの設定は、Azure App Serviceの機能ではできません。WordPressのWebサーバであるNginxに設定を行います。

Configure nginx for Various WordPress Scenarios | GitHub

こちらのページにNginxの設定の仕方が記載されております。コンテナで動作しているため、サーバの設定を直接書き換えても意味がないので、用意されている/home/dev/startup.shにNginxの設定を上書きするコマンドとNginxを再起動させるコマンドを記載します。
これらの設定作業は、Azure PortalのAzure App ServiceのメニューのSSHを使用すると、サーバに入れるので、これを使用し行います。

1cp /home/dev/custom-default.conf /etc/nginx/conf.d/default.conf
2/usr/sbin/nginx -s reload

そして、ベースとなる/etc/nginx/conf.d/default.conf を/home/dev/custom-default.confとしてコピーし、今回必要となる設定を行います。
設定は、serverの設定を追加し、Azureのドメインではカスタムドメインにリダイレクトするようにします。

1# Azureドメインのが設定を追加
2server {
3        listen 80;
4        server_name xxxxx.azurewebsites.net;
5        # カスタムドメインへリダイレクト
6        rewrite ^/(.*) https://カスタムドメイン/$1 permanent;
7}
8
9server {
10        listen 80;
11        ## Your website name goes here.
12        server_name カスタムドメイン;
13        ## Your only path reference.
14        root /var/www/wordpress;

これを行い、startup.shを実行することで、動作反映できます。
実際、azureのドメインでのアクセスは恒久的な移動を表す301でリダイレクトされるようになりました。

さいごに

このブログが、この手順で構築したWordPressになります。
個人だと検証くらいしかAzureを使う機会がなかったので、こういう形で実際に使えて良かったと思います。

#Azure #WordPress

ABOUT ME