affiliate.ks-product

アフィ収入月10万円以下の初心者を対象に、アフィリエイト、SEO、セールスライティング、マーケティングなどネットで安定して稼ぐ方法を分かりやすくまとめています!関連書籍のレビューも書いています

Xamppローカル環境にSSLを有効にする設定手順まとめ

      2017/02/23

もはやXamppを利用したWebサイト制作は、プログラマーだけでなくWebデザイナーやコーダーでも常識です。

静的なサイトであれば流れに沿ってインストールすれば十分なのですが、SSLをローカルでも利用できるようにするとなるとハードルがグンっと上がります。

私もSSLの設定でしばらく躓いていたのですが、やっと動作するようになったのでメモ用に設定手順をまとめておきます。

Xamppローカル環境にSSLを有効にする設定手順(ver 3.2.2で確認)

1. php.iniファイルを書き換える

php.iniファイルとはPHPの設定ファイルで、通常は以下のディレクトリに配置されています。

C:\xampp\php\php.ini

これをテキストエディタで開き、「extension=php_openssl.dll」で検索します。

該当行を見つけたら先頭の「;」を削除します。

;extension=php_openssl.dll

extension=php_openssl.dll

上書き保存して閉じます。

2. httpd-vhosts.confファイルを書き換える

続いて、ローカルIPアドレスを使ってサイトにアクセス出来るように設定します。以下のファイルを開きます。

C:\xampp\apache\conf\extra\httpd-vhosts.conf

ファイルの一番下に次の記述を追加します。

<VirtualHost 127.0.0.20>
 DocumentRoot "C:/xampp/htdocs/example_site1/"
 ServerName example_site1.local
 </VirtualHost>

※いずれのパラメーターも任意のものに変更してください

上書き保存します。
この時点でXamppのコンパネでApacheを再起動すれば、「http://127.0.0.20/」でサイトを表示することができます。しかし、この段階ではまだSSLにはまだ対応していません。

いくつかポイントを解説します。

  • IPアドレスは「127.0.0.××」の形式で任意に設定可能
  • DocumentRootはWebサイトのデータが保存されてるディレクトリを指定
  • ServerNameはローカルIPでアクセスする為不要ですが、空だとエラーになるのでダミーで入力しておく

3. httpd-ssl.confファイルを書き換える

続いて、「https://~」の形式でもサイトを見られるようにします。以下のファイルを開きます。

C:\xampp\apache\conf\extra\httpd-ssl.conf

ファイルの一番下に次の記述を追加します。

<VirtualHost 127.0.0.20:443>
DocumentRoot "C:/xampp/htdocs/example_site1/"
ServerName localhost:443

SSLEngine on
SSLCertificateFile "conf/ssl.crt/server.crt"
SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>

上書き保存します。
そして、Apacheを再起動すれば「https://127.0.0.20/」というように「https」形式でもアクセスできるようになります。

いくつかポイントを解説します。

  • IPアドレスはhttpd-vhosts.confに記述したものと同じものを入れ、末尾に「:443」を追加する
  • DocumentRoot、ServerName もhttpd-vhosts.confと同じものを記述 ServerNameにはlocalhost:443と記述(そうしないと動作はするがログにエラーが表示される)。
  • 5~7行目のSSLに関する記述はそのままコピペで貼り付ける

複数のサイトに個別のローカルIPで運用し、それぞれにSSL適用する方法

仕事でウェブサイトを運営している人は「ローカルIP毎にサイトを分けたい」という要望があるかと思います。非常に簡単です。

簡潔に言えば、
手順2、3で記述したものを複製して、

  • IPアドレス
  • DocumentRoot
  • ServerName

これら3つの項目をサイト毎に変えるだけです。

そして、Apacheを再起動すれば完了です。

不安な方の為に入力例を載せておきますね。

◆httpd-vhosts.conf

↓先ほど記述したもの
<VirtualHost 127.0.0.20>
 DocumentRoot "C:/xampp/htdocs/example_site1/"
 ServerName example_site1.local
 </VirtualHost>

↓追加分
<VirtualHost 127.0.0.21>
 DocumentRoot "C:/xampp/htdocs/example_site2/"
 ServerName example_site2.local
 </VirtualHost>
◆httpd-ssl.conf

↓先ほど記述したもの
<VirtualHost 127.0.0.20:443>
DocumentRoot "C:/xampp/htdocs/example_site1/"
ServerName localhost:443

SSLEngine on
SSLCertificateFile "conf/ssl.crt/server.crt"
SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>

↓追加分
<VirtualHost 127.0.0.21:443>
DocumentRoot "C:/xampp/htdocs/example_site2/"
ServerName localhost:443

SSLEngine on
SSLCertificateFile "conf/ssl.crt/server.crt"
SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>

※上記のコメント(”↓追加分”などの文言)は設定ファイルに記述しないでください。構文エラーで動作しません。

追記:
httpd-ssl.confのServerNameにはlocalhost:443を指定してください(動作はしますがエラーを吐く為)。

おわりに

これでローカルでのSSL利用が可能になり、本番環境と近い環境になったはずなので、関連ページの作業効率はかなり良くなったのではないでしょうか?

あとはメール送信もできれば完璧なんですが行き詰ってます…。

「GmailのSMTPサーバーを利用すればローカルでもSendmailが使えるようになる」という記事があったので試してみたんですが、私の環境だとGoogle側でアクセスをブロックしてしまうんですよね。なので、一旦断念しました。何か良い方法はないものか・・・。

 - Web制作テクニック ,