🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

phpMyAdmin

phpMyAdminはオープンソースで、PHPで書かれたウェブベースのMySQL管理ツールのことです。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

アップロード

アップロードは特定のファイルをウェブサーバに送るプロセスのことを指します。

MAMP

Mac 上で WordPress などの動的ページのサイトが作れるように環境を構築するフリーソフト

Q&A

解決済

1回答

2939閲覧

【laravel初心者】画像アップロード機能を実装したい

moru

総合スコア5

Laravel

LaravelとはTaylor Otwellによって開発された、オープンソースなPHPフレームワークです。Laravelはシンプルで表現的なシンタックスを持ち合わせており、ウェブアプリケーション開発の手助けをしてくれます。

phpMyAdmin

phpMyAdminはオープンソースで、PHPで書かれたウェブベースのMySQL管理ツールのことです。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

アップロード

アップロードは特定のファイルをウェブサーバに送るプロセスのことを指します。

MAMP

Mac 上で WordPress などの動的ページのサイトが作れるように環境を構築するフリーソフト

0グッド

0クリップ

投稿2021/01/26 14:58

編集2021/01/27 00:18

前提・実現したいこと

Laravelで画像アップロード機能を作りたいです。
ブログ投稿フォームに画像をアップロードし、タイトルと本文と一緒にDBに保存したいです。
いろいろ調べたのですが、解決しないためお知恵を借りたいです。
よろしくお願い致します。

発生している問題・エラーメッセージ

①BlogRequestファイルにバリデーションを設定しているんですが、imageに設定すると投稿ボタンを押しても「ブログを登録しました」という画面に遷移しません。DBにも保存されていません。
(その部分をコメントアウトすると問題なくDBに保存されます)
イメージ説明
↓投稿ボタン押下後↓
イメージ説明
↓imageのバリデーションをコメントアウトした場合↓
イメージ説明

②storage/app/publicに画像が保存されません。
画像をアップロードすると、phpmyadminのimageカラムに一応保存されています。
ですが、storage/app/publicのファイルには保存されておらず、image_pathカラムはnullです。

やったこと

・php artisan storage:linkの実行
・store関数をstoreAsにする

**<form.blade.php>** @extends('layout') @section('title', 'ブログ投稿') @section('content') <div class="row"> <div class="col-md-8 col-md-offset-2"> <h2>ブログ投稿フォーム</h2> <form method="POST" action="{{ route('store') }}" onSubmit="return checkSubmit()" enctype=”multipart/form-data”> @csrf <div class="form-group"> <label for="title"> タイトル </label> <input id="title" name="title" class="form-control" value="{{ old('title') }}" type="text" > @if ($errors->has('title')) <div class="text-danger"> {{ $errors->first('title') }} </div> @endif </div> <div class="form-group"> <label for="content"> 本文 </label> <textarea id="body" name="body" class="form-control" rows="4" >{{ old('body') }}</textarea> @if ($errors->has('body')) <div class="text-danger"> {{ $errors->first('body') }} </div> @endif </div> <label for="image"> 画像 </label> <br> <input type="file" name="image" accept="image/png, image/jpeg"> <div class="mt-5"> <a class="btn btn-secondary" href="{{ route('blogs') }}"> キャンセル </a> <button type="submit" class="btn btn-primary"> 投稿する </button> </div> </form> </div> </div> <script> function checkSubmit(){ if(window.confirm('送信してよろしいですか?')){ return true; } else { return false; } } </script> @endsection
**<Blog.php>** <?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; class Blog extends Model { use HasFactory; protected $table = 'blogs2'; protected $fillable = [ 'title', 'body', 'image', 'image_path' ]; }
**<BlogRequest.php>** <?php namespace App\Http\Requests; use Illuminate\Foundation\Http\FormRequest; class BlogRequest extends FormRequest { /** * Determine if the user is authorized to make this request. * * @return bool */ public function authorize() { return true; } /** * Get the validation rules that apply to the request. * * @return array */ public function rules() { return [ 'title'=>'required | max:100', 'body' =>'required', 'image'=>'file | image | mimes:png,jpeg', ]; } }
<BlogController.php> public function exeStore(BlogRequest $request) { // 画像を受け取る $upload_image = $request->file('image'); if($upload_image) { //アップロードされた画像を保存 $path = $upload_image->store('images','public'); // 画像の保存に成功したらDBに記録する if($path){ Blog::create([ "image" => $upload_image->getClientOriginalName(), "image_path" => $path ]); } } //ブログのデータ受け取る $inputs = $request->all(); \DB::beginTransaction(); try{ //ブログを登録する Blog::create($inputs); \DB::commit(); } catch(\Throwable $e) { \DB::rollback(); abort(500); } \Session::flash('err_msg', 'ブログを登録しました。'); return redirect(route('blogs')); }
**<web.php>** // ブログ登録 Route::post('/blog/store', [BlogController::class, 'exeStore'])->name ('store');

補足情報(FW/ツールのバージョンなど)

MAMPのバージョンは6.0.1(986)
VScodeバージョン: 1.52.1
laravelのバージョンは8です。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2021/01/26 22:55

バリデーションの区切りの前後半角スペースって大丈夫でしたっけ。 ドキュメントにはないようですが。何を参考に書いたのでしょう。
moru

2021/01/27 00:05

ご回答ありがとうございます。 バリデーションの書き方については、youtubeにある動画を参考にしました。 半角スペースを無くしても解決はしません。
m.ts10806

2021/01/27 00:09

ちなみに「保存できなくなります」というのは起きてる現象ではないのでは。 何が、起きてますか?画面キャプチャなども提示されたほうが良いかもしれません。
moru

2021/01/27 00:18

ありがとうございます。上記の通り修正致しました。
guest

回答1

0

ベストアンサー

enctype=”multipart/form-data”

” -> "

これでは

投稿2021/01/29 09:29

mikkame

総合スコア5036

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

moru

2021/01/29 09:40

回答ありがとうございます。 enctype=”multipart/form-data”を enctype=”multipart/form->data”に変えるということですか?
mikkame

2021/01/29 11:12

” この記号がおかしいです
moru

2021/01/29 12:28

すみません、ありがとうございます。 ご指摘の通り直したところ画像ファイルも保存できるようになりました。 ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問