Skip to content

LevelDrain/UploadService

Repository files navigation

私の(作品の)取扱説明書

1. DBのインポート方法
xamppのhtdocsに解凍したディレクトリ「E17C2002_final」を入れる。

http://localhost/phpmyadmin/ より、データベースを新規作成。
この時のDB名を「e17c2002_imagedb」にします。
設定は「utf8_general_ci」のみ。

アクセスするPDOの設定は「User:mediaserver、Password:2018f(授業と同じ)」です。
予めアカウントを作成してください。
変更がある場合は「dbconnect.php」を操作してください。

※ 学籍番号を付けたのは、他の人の提出物と被りそうという理由だけなので、
必要に応じて変えてください。
変えた場合は「dbconnect.php」のアクセス先も変更してください。


テーブル作成のSQL文が入った「e17c2002_imagedb.sql」を
「インポート」からアップロードファイルに指定して、実行してください。

サンプルのユーザアカウントが入ったテーブルができあがります。

2. どこからアクセスするか
上記の操作の後、xamppならhtdocs中の http://localhost/E17C2002_final/ にアクセス。
シンボリックリンクがある場合などは、必要に応じて変更してください。

セッションに何も入っていない場合は自動的に
「index.php」から「login.php」に飛ばされる仕様になっているので、
そのままURLにアクセスするとログインページになります。

3. 新規の場合
「新規の方はこちら」を押すと、新規登録ページに飛びます。
ニックネーム(ユーザ名)とパスワード、メールアドレスを登録し、
登録完了画面が出ればOKです。
既に登録済みのメールアドレスは登録できません。
ユーザがユニークであるかどうかの認証は、メールアドレスを照合することで行います。

4. ログインページ
登録済みのメールアドレスとパスワードでログインしてください。
テストユーザは「メール:testtest@gmail.com、PW:testtest」です。

5. どのような操作が可能か
画像ファイル(jpg, png, gif)音声ファイル(mp3, m4a)
動画ファイル(mp4, avi)をアップロードできます。
アップロードの時に説明テキストを書き込むと個別ページの下に表示されます。

複数アップロードは可能ですが、説明テキストを書き込んで投稿した場合は
「複数画像に対し説明が一つ」になってしまいます。
複数アップロードの方法は各OSの複数選択方法に従ってください。

アップロード後の画像をクリックすると、画像の個別ページへリンクします。
※音声ファイルと動画ファイルについては、個別ページがありません(TODO)。

6. ログアウト
マイページ上部のログアウトボタンからリンク。
「ログアウトしますか?」と聞かれるので、ログアウトボタンを押して
「ログアウトしました」と出たら、「戻る」でログイン画面に移行。
(セッションが破棄されるので、自動的にindex.phpからlogin.phpに飛ばされる仕組み)

「ログアウトしますか?」の時点で「戻る」を押した場合、
セッションが保持されるのでマイページに戻れます。

7. 頑張ったところ
・ 新規会員登録 → ログイン → マイページ → アップロード → ファイルロード
 → ログアウトという何気なく利用している一連の流れを実装するのに苦労しました。
ここに予想外に時間を割きすぎました。
特に新規作成はDB登録、id参照からの個別ディレクトリ作成が難しかった……

・ 授業や書籍、有料のe-learningサイトなどを参考にたくさん勉強しましたが、
やはり一連の流れを0から実装する経験がなかったため、時間の見積もりにも実装そのものにも苦労しました。

・ ちなみに、URLに「?id=hoge」などを入れるとすごく怒られるようにしました。
具体的にはGETメソッドをはじきます。
特定のGETメソッドは受け入れられるような仕組みにはしてあります。
SQLインジェクション対策のつもりです。

・ ユーザIDと画像IDは「random_bytes」を使用しています。
PHPのドキュメンテーションでセキュリティ上推奨されていたためです。
http://php.net/manual/ja/function.random-bytes.php

・ パスワードは「password_hash」で生成します。

8. やりたかったところ
・ CSSにほぼ手をつけられず残念。
「Float」より「Flexbox」という新しいプロパティがあるようなので、つかってみたかった。
https://ics.media/entry/13117

・ 音声ファイルや動画ファイルはサムネイル画像をクリックすると個別ページで見られるようにしたかった。
ログインログアウトに時間をとりすぎて結局チャレンジできなかった……

・ ユーザ名やメールアドレス等、サニタイズができていなかった。
入力補完などもしてみたかった。

以上は課題提出後も「自主製作課題」として挑戦してみたいと思います。
モチベーションとスケジュール管理が一番の難点だったかもしれない……

9. 制作
LevelDrain
CC BY

About

画像投稿サイト(PDOの利用)

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published