Laravel에서 이미지 게시 기능을 수행합니다.구체적으로 다음과 같은 기능을 실시한다.

위의 사진에서 이미지 파일을 선택하고 양식에 설명을 입력한 후 투고 버튼을 누릅니다.

상기 사진과 같이 이미지와 댓글을 표시하는 기능을 실현한다.

개발 환경

Laravel:5.5.46
MYSQL:5.5.62
PHP:7.2.17
이미지 업로드 서버: 아마존 S3

마이그레이션 파일 만들기

이미지와 주석을 저장하는 테이블posts를 만듭니다.터미널에서 다음 명령을 실행하여 마이그레이션 파일을 만듭니다.$ php artisan make:migration _create_posts_table --create=posts생성된 마이그레이션 파일을 편집합니다.
database/migrations/2019_10_22_220848_create_posts_table.php

<?php

use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;

class CreatePostsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('posts', function (Blueprint $table) {
            $table->increments('id');
            $table->string('image_file_name',100);//追加
            $table->string('image_title',100);//追加
            $table->timestamps();

        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('posts');
    }
}

터미널에 다음 명령을 입력하여 마이그레이션을 실행합니다.$ php artisan migrate

모범

후기 모델을 생성합니다.터미널에서 다음 명령을 실행하여 모델을 생성합니다.$ php artisan make:model Post생성된 모델을 편집합니다.
app/Post.php

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;
class Post extends Model
{
//後にcreate()メソッドで保存するカラムを指定
    protected $fillable = [
        'image_file_name', 'image_title',
    ];
}

라우터

라우터를 설명합니다.페이지를 표시할 때와 게시물 버튼을 누를 때의 경로를 설명합니다.
routes/web.php

Route::post('upload', 'PostsController@upload')->name('upload');
Route::get('/', 'PostsController@index');

컨트롤러

터미널에서 다음 명령을 실행하고 컨트롤러를 만듭니다.$ php artisan make:controller PostsControllerweb.php에서 기술한 모든 루트에 대응하는 동작을 설명합니다.
/app/Http/Controllers/PostsController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Illuminate\Foundation\Auth\User;
use App\Post;
use Storage;
use Illuminate\Support\Facades\Validator;

class PostsController extends Controller
{
//画像およびコメントアップロード
public function upload(Request $request){

//Validatorファサードのmakeメソッドの第１引数は、バリデーションを行うデータ。
//第２引数はそのデータに適用するバリデーションルール
        $validator = Validator::make($request->all(), [
            'file' => 'required|max:10240|mimes:jpeg,gif,png',
            'comment' => 'required|max:191'
        ]);

//上記のバリデーションがエラーの場合、ビューにバリデーション情報を渡す
        if ($validator->fails()){
            return back()->withInput()->withErrors($validator);
        }
//s3に画像を保存。第一引数はs3のディレクトリ。第二引数は保存するファイル。
//第三引数はファイルの公開設定。
        $file = $request->file('file');
        $path = Storage::disk('s3')->putFile('/', $file, 'public');
//カラムに画像のパスとタイトルを保存
        Post::create([
            'image_file_name' => $path,
            'image_title' => $request->comment
        ]);

        return redirect('/');
    }
//ページ表示
    public function index(){
        $posts = \App\Post::all();

        $data = [
            'posts' => $posts,
        ];

        return view('welcome',$data);
    }
}

뷰에서 Form 외립면을 사용할 수 있도록 터미널에 다음 명령을 입력합니다.$ composer require "laravelcollective/html":"5.5.*"AWS에 액세스하는 S3의 라이브러리를 가져옵니다.$ composer require league/flysystem-aws-s3-v3.env에서 환경 변수를 설정합니다.
.env

AWS_S3_KEY=[your Access Key ID]
AWS_S3_SECRET=[your Secret Key]
AWS_S3_REGION=[your region]
AWS_S3_BUCKET=[your backet]

보기

resources/views에는 처음부터 welcome가 있습니다.blade.php를 편집합니다.
resources/views/welcome.blade.php

//投稿フォーム
{!! Form::open(['route' => 'upload', 'method' => 'post','files' => true]) !!}
    <div class="form-group">
        {!! Form::label('file', '画像投稿', ['class' => 'control-label']) !!}
        {!! Form::file('file') !!}
    </div>
    <div class="form-group m-0">
        {!! Form::label('textarea', '投稿コメント', ['class' => 'control-label']) !!}
        {!! Form::textarea('comment',null,['class' => 'form-control']) !!}
    </div>   
    <div class="form-group text-center">
        {!! Form::submit('投稿', ['class' => 'btn btn-primary my-2']) !!}
    </div>
{!! Form::close() !!}
//画像とコメントをすべて表示
@foreach($posts as $post)
    <div class="card-header text-center">
        <img src= {{ Storage::disk('s3')->url($post->image_file_name) }} alt="" width=250px height=250px></a>
    </div>
    <div class="card-body p-1">
        <span class="card-title">{{ $post->image_title }}</span>
    </div>
@endforeach