スマホとPC間でファイル転送
家にプリンターを置いていると、持っていない友人からケータイ写真の印刷を頼まれて画像の受け渡し方法に悩んだことありませんか。
Google DriveやPhoto、エアドロップやニアバイシェアなど受渡方法はいろいろ考えられますが、利用環境がなかなかそろわないのが現状だと思います。
また、USBケーブルでWindowsPCとつなぐ方法でもデータのやり取りができますが、見てはいけない他の写真までみてしまいそうで気が引けます。
そこで、友人側(第三者)の操作で画像を選択して自分のPCに送れるように、簡易的なWebアプリを構築してみました。途中でアプリダウンロードのリンクも紹介していますので、よろしければ使ってみてください。
ここではPC側をWindows10で話を進めますが、Debian(Linux)等でも同様の事は可能です。
構造と環境の整備
構造としては、Windows機にApache(Webサーバー)とPHPをインストールし、そこで稼働するサーバーに対して友人側からアクセスしてもらい、あとはホームページでファイルアップロードするのと同じ要領です。
もし、BuffaloルーターにあるゲストWi-Fiのような機能をつかっている場合は、転送先のPCもゲストWi-Fi側に接続してください。また、その際同じネットワーク間でも端末同士のアクセスができないようになっていることもありますので、それらを許可してください。
Windows機にApacheサーバーをインストールする方法や、WindowsのApacheサーバーにPHPを連携する方法はそれぞれ別記事になっていますので、合わせてお読みいただければと思います。
紹介先のリンクではApacheはSSL化していますがSSL化の必要はありません。またPHP連携ではモジュール版を使うのが簡単だと思います。
ふたつもアプリをインストールするのが面倒臭いという方は、XAMPPの導入するという方法もあります。こちらはApacheとPHPだけでなく、今回利用しないMariaDB(データベースサーバー)やPerl(スクリプト言語)までひとつのパッケージになった統合環境です。
ApacheとPHPのテスト稼働
ブラウザで表示するドキュメントを配置する場所は、バージョン2.4だと通常c:¥Apache24¥htdocsになっていると思います。ここにtest.phpという名前のファイルを作り次のような記述をします。
<?php phpinfo(); ?>
Apacheを起動するにはApache24¥htdocsフォルダの中にある「httpd.exe」をダブルクリックします。初回起動時にWindowsファイアウォールが許可を求められるので許可します。間違えて禁止してしまったら、Windows Defender ファイアウォールを立ち上げ、「受信の規則」にあるApache HTTP Serverのエントリーを禁止から許可にします。方法がわからなかったら右クリックから一度削除してやり直してもOKです。
Apache起動中は次のようなウインドウが表示され続けます。閉じてしまうと終了してしまうのでそのままにしておいてください。
この段階でApacheが立ち上がらない(コマンドプロンプトの画面がすぐに消えてしまう)なら、Apache24¥conf¥httpd.confへの記述がおかしいか、ダウンロードしたPHPのバージョンが違う可能性があります。
モジュール版を利用した場合、Apache24¥conf¥httpd.confのLoadModuleで指定したdll名称(php7apache2_4.dllなど)が、その場所に確かに存在するかを確認してください。もしdllファイルが存在していなかったらダウンロードするPHPファイルを間違えた可能性があります。Thread Safe版をダウンロードしたか確認してください。フォルダ名にntsの文字が入っていたらNon-Thrad-Safeの意味なので、おそらく間違えています。
Apacheを起動した際の黒いウインドウが残っている状態ならブラウザから接続してみましょう。http://localhost/test.phpにアクセスすると次のような画面になるはずです。細かな部分は違っていて問題ありません。
Apacheサーバーを再起動する際は、黒いウィンドウのを×ボタンから一度閉じてhttpd.exeを起動しなおすことで可能です。
アップロードアプリ(webページ)
ここまでで家の中だけからみられるWebサーバを構築しました。次は写真をアップロードするためのPHPのページ(アプリ本体)を作成します。
筆者が作った簡易アプリをこちらからダウンロードしていただけます。
拡張子が.phpになっているファイルと、libフォルダをApacheのhtdocsへコピーしてください。
アプリ利用のためにApache24¥conf¥httpd.confを再度変更します。用心しすぎかもしれませんがIPv6のアドレスが配布されていると外からインターネット側からアクセスされてしまう可能性があるので、Listenの行を変更してIPv4でのみの接続にします。
httpd.conf
... #Listen 80 Listen 0.0.0.0:80 ...
合わせて初期表示ページも変更します。DirectoryIndexのindex.htmlの前にindex.phpを追加してください。
httpd.conf
... DirectoryIndex index.php index.html ...
必須ではありませんが、PHPのルートフォルダにあるphp.iniファイルの次の項目を変更すると使い勝手がよくなるでしょう。
- upload_max_filesize = 100M
アップロードの最大サイズを指定します。
- post_max_size = 100M
上記と同時にこちらも同じサイズに設定する必要があります。
- memory_limit = 128M
使用メモリの上限です。こちらも低いと大きい画像を処理できません。
- max_execution_time = 300
転送のタイムアウトを秒で指定します。早すぎると転送完了前にエラーになってしまいます。これを0にすると永遠に待ち続けます。
Apacheを再起動して動かしてみます。
index.phpをPC側のブラウザで表示すると(http://localhost)、アクセスのためのQRコードが表示されますのでスマホ側でスキャンしてPCのページにアクセスして下しさい。
スマホ側で転送したいファイルを選択し、送信するとApache24¥htdocs¥uploadsフォルダに画像が転送されます。
上書き時の確認やセキュリティ関連の設定、CSSでの装飾、エラー処理等を省力化していますので、気になる点があれば修正して利用してください。
.heicはgimpで
稼働確認はしていませんが、ブラウザベースなのでおそらくiPadやiPhoneでも送信できると思います。その際画像ファイルは、.heicという拡張子になっているかもしれません。その場合はフリーソフトのGimp(Ver2.10.2以上)でオープン、形式変換ができます。
ちなみに、PCからPCにファイルを転送する際にはドラッグ&ドロップが使えると便利だと思います。Chromeのブラウザアプリでドラッグ&ドロップでファイルを選択する方法を別記事で紹介しています。よろしければ読んでみてください。