Help us understand the problem. What is going on with this article?

AWSに構築したWordPressをhttps対応してみた

はじめに

AWSにWordPressを構築してみた
AWSに構築したWordPressに独自ドメインを割り当ててみた
の続き。
WordPressを構築して独自ドメインを割り当ててSSL対応したところまで終わった。
が、WordPress側がhttpsに対応してないのでデザイン崩れが発生しているのと
httpでのアクセスがまだできる状態なのでその2つを対応していく。

https対応設定

現状、こんな感じ。
68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f3536333632352f65636663333433632d346563342d663334332d663032362d3735656331636436613133662e706e67.png

httpsのページからhttpのコンテンツを参照しようとするとセキュリティレベルの問題でブラウザが読み込みを止めるのでこういう現象が起こる。

<link rel='stylesheet' id='dashicons-css'  href='http://olafblog.org/wp-includes/css/dashicons.min.css?ver=4.7.2' type='text/css' media='all' />

こういうの。ってことでコンテンツの読み込みもhttpsでするようにしていく。

WordPress側での設定

ちょっと調べたらWordPressのプラグインで一発で対応できそうなのでそのプラグインを試してみる。

http://xxx.xxx.xxx.xxx/wp-login.php

で管理ツールにログイン。[プラグイン]>[新規追加]で画面を開いて
「Really Simple SSL」
を検索してインストールして、有効化!

はい、完成。

https://olafblog.org

でログイン。・・・あれ崩れたまま?
管理画面に入って原因ch・・・リダイレクトループ?

ぐぐるとどうやらサーバー側での設定が必要みたい。

サーバー側での設定

サーバー側にログインして設定を追加していく。

$ cd /var/www/html

# 管理画面から設定が変えれるように権限変更しておく
$ chmod 660 wp-config.php

# 下記設定を
# require_once(ABSPATH . 'wp-settings.php');
# の上部に追加
$ vi wp-config.php
_/_/_/_/_/_/_/_/_/_/_/_/_/_/
$_SERVER['HTTPS']='on';
define('FORCE_SSL_LOGIN', true);
define('FORCE_SSL_ADMIN', true);
_/_/_/_/_/_/_/_/_/_/_/_/_/_/

再度アクセス。・・・うん。管理画面に入れるようになった。

再度、WordPress側ので設定

[設定]の「WordPressアドレス(URL)」と「サイトアドレス(URL)」をhttpsに変更。
あとなんか上の方にボタンが出てたのでSSL有効ボタンをポチる。

スクリーンショット 2020-01-10 13.25.32.png

さて、トップページにアクセス。
スクリーンショット 2020-01-10 13.28.56.png

お、できた。余裕ですねぇ。

http->httpsリダイレクト設定

最後にhttpアクセスをhttpsリダイレクトするように設定していく。

# server_nameを正規ルートのみ許可するように不要な記述を削除
# httpアクセスに対して301リダイレクトするよう設定を追加
$ sudo vi /etc/nginx/conf.d/wordpres.conf
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
server {
  listen 80;
  server_name olafblog.org;

  location / {
    if ($http_x_forwarded_proto = 'http'){
      return 301 https://$host$request_uri;
    }
    root /var/www/html;
    index index.php index.html;
  }
  location ~ \.php$ {
    root /var/www/html;
    fastcgi_pass 127.0.0.1:9000;
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    include fastcgi_params;
  }
}

# 再起動だとうまく設定が反映されなかったので再起動
$ sudo nginx -s stop
$ sudo nginx
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

オッケー。設定完了したのでhttpでアクセス。

http://olafblog.org

httpsにリダイレクトされることを確認。
簡単ですねぇ。お疲れ様でした。
次回「WordPressにGoogleAnalyticsを導入してみた

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした