XSERVERでLaravelからアップロードした画像をブラウザから見れるようにするための設定

XSERVERでLaravelからアップロードした画像をブラウザから見れるようにするための設定

Webシステムでは、画像のアップロードはつきもの。
XSERVERで運用しているLaravelを使用したシステムで、”/storage/”下にアップロードした画像を、エンド・ユーザーのブラウザから閲覧可能とする設定方法を書きます。
といっても、単純な話しで、公開フォルダから”/storage/”に対してシンボリックリンクを設定するだけです。

XSERVERでLaravelを動かすフォルダ構成と基本的な設定はこちら。以下の説明は、そのフォルダ構成を前提としています。

Laravelでアップロードする画像の格納先は次のとおりです。

public_html/larvel/storage/app/public/product/商品A/商品Aの写真.jpg

例:
public_html/larvel/storage/app/public/product/my_product/my_product.jpg

例えばLaravelのウェブ・システムでアップロードされた画像を、上記のフォルダに格納した場合、そのままではブラウザから直接閲覧することはできません。公開フォルダからシンボリックリンクを張ってあげることで、ブラウザから閲覧可能になります。

シンボリックリンクの作成は、SSHを使ってXSERVERにログインし、コマンドを実行する必要があります。SSHでのログイン方法は、XSERVERのマニュアル・ページにWindowsの「Tera Term」を使用した場合を例に詳しく解説されています。もちろん、Macからでも可能です。

では、XSERVERでシンボリックリンクを作成するコマンドです。

ln -s /home/サーバーID/ホスト名/public_html/laravel/storage/app/public/home/サーバーID/ホスト名/public_html/storage

「サーバーID」はFTPで接続する時のユーザー名、ホスト名はFTPで接続する時のホスト名になります。

例えば、サーバーIDが「myname」、ホスト名が「abc.com」だったとすると、

ln -s /home/myname/abc.com/public_html/laravel/storage/app/public/home/myname/abc.com/public_html/storage

こんな感じでコマンドを叩いてやると、ブラウザから「https://abc.com/storage/product/my_product/my_product.jpg」といったアドレスで、画像が閲覧可能となります。