PHP

スポンサー広告

挑戦Laravel5.4 ミニブログ 投稿機能作成

2017/08/16

挑戦Laravel5.4 ミニブログ 下準備編からログイン ではLaravel5.4をインストールしてauth機能を有効化しました。

ブログ投稿画面の作成

記事投稿用のHTMLファイルを作成します。見栄えは後程CSSで作成します。

contribute.blade.php

<!doctype html>
<html lang="{{ app()->getLocale() }}">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="">
        <title>記事の投稿</title>
    </head>
    <body>
    	<form action="" method="post">
    	 {{ csrf_field() }}
    	<p>タイトル<input type="text" name="title"></p>
    	<p>要約<input type="text" name="descript"></p>
    	<p>カテゴリ<input type="text" name="category"></p>
    	<p>内容<textarea name="comment"></textarea></p>
    	<p><input type="submit" value="投稿"></p>
    	</form>
    </body>
</html>

welcome.blade.phpのヘッダー部分を再利用しました。{{ csrf_field() }}はLaravel 5.4 CSRF保護によればクロス・サイト・リクエスト・フォージェリ攻撃を防止する目的のもので必須となるようです。

contribute.blade.phpに対するコントローラーを作成します。コマンドプロンプトでインストールフォルダ(今回はminiblog)に移動して下記コマンドでコントローラーを作成します。

php artisan make:controller ContributeController

miniblog/app/controllerに新しくコントローラにContributeControllerが作成されましたのでindexメソッドを追記しておきます。

ContributeController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ContributeController extends Controller
{
    public function index(){
    	return view('/contribute');
    }
}

コントローラにアクセスを流すためにminiblog/routes/web.phpにcontribute宛にアクセスがあったときの処理を追記します。

web.php

<?php

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', function () {
    return view('welcome');
});

Auth::routes();

Route::get('/home', 'HomeController@index')->name('home');
Route::get('/contribute', 'ContributeController@index');

この状態でhttp://127.0.0.1/miniblog/public/contributeにアクセスしてみます。

投稿フォーム

投稿フォームが表示されましたただし、ログイン状態でもログアウト状態でもこのページが表示されてしまいます。このままでは、だれでも勝手に投稿できてしまいますのでログインしている状態でのみこのページが表示されるようにしたいです。

コントローラーにコンストラクターを追加してauthの機能を持つミドルウェアを利用することにします。

ContributeController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class ContributeController extends Controller
{
  public function __construct(){
    $this->middleware('auth');
  }
    public function index(){
    	return view('/contribute');
    }
}

ContributeController配下は常にauthを使いますのでログインしていない状態では見ることができません。Laravel 5.4 認証によればweb.php側にauthをかける方法もあるようです。また、ContributeController配下であってもauthをかけたくない場合はLaravel 5.4 認証により

$this->middleware('auth')->except('メソッド名');

の様に除外もできるようです。これらにより任意のページを認証済み後にしか閲覧できないような仕組みが作成されました。

記事の投稿

記事の投稿フォームに入力されたデータを保存しておくためのDBテーブルを作成します。投稿データのテーブル名をcontributeということにしてテーブル作成用のマイグレートファイルとmodelを作成します。コマンドプロンプトでインストールフォルダに移動して

php artisan make:model Contribute -m

を実行します。migrationファイルとmodelファイルが作成されます。miniblog/database/migrationsのなかに日付_create_contributes_table.phpというファイルが作成されています。このファイルをテキストエディタで開いてテーブルのカラム情報を追記します。public function up()の中にカラム情報を追記していきます。ここでのメソッドはLaravel 5.4 データベース:マイグレーションに詳しくあります。

日付_create_contributes_table.phpの一部

    public function up()
    {
        Schema::create('contributes', function (Blueprint $table) {
            $table->increments('id');
            $table->char('title', 100);
            $table->text('descript')->nullable();
            $table->integer('category');
            $table->text('comment');
            $table->timestamps();
        });
    }

カテゴリは数値にしてあります。どこかのタイミングでカテゴリテーブルを作成してそこから表示名を取得してくるつもりです。(複数テーブルからのselect文を確認するため)この状態では、まだテーブルが作成されていませんのでテーブル作成のためのコマンドを実行します。

php artisan migrate

これで日付_create_contributes_table.phpで指示した通りのカラムのテーブルcontributeが作成されました。

次にcontributeテーブルに対するモデルを触ります。miniblog/app/Contribute.phpファイルを編集します。ほかの機能もそうなのですがmodelが一層はっきりとわからないことが多いです。今回はモデル名(クラス名)とテーブル名が一致していますので操作するテーブルの指定は不要だそうです。クラス名と違うテーブルを参照する場合

protected $table = 'テーブル名';

で変更できるそうです。今回は一致するようにしていますので書き込み可能なカラムの指定をします。今回は4つのカラムに対して書き込みしますので(idは自動採番)

Contribute.php

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Contribute extends Model
{
     protected $fillable =['title','descript','category','comment'];
}

としておきます。これでデータ書き込みの準備は整いました。今回作成した投稿フォームはform要素のaction属性が空白でした。methodはpostでしたのでcontributeからpostされた時の振る舞いをweb.phpに記述しておきます。

web.phpの一部

Route::post('/contribute', 'ContributeController@store');

contributeにpostされたらコントローラーのstoreメソッドを実行してくださいということですね。 メソッド名であるstoreは任意のものでも構いませんが、 リソースコントローラに一覧がありますのでそれに倣っておきます。

では、コントローラにstoreメソッドを追記します。先ほど触ったモデルのContributeクラスを使用したいので

use App\Contribute;

を追記します。

miniblog/app/Http/controller/ContributeController

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Contribute;	// 追記

class ContributeController extends Controller
{
	public function __construct(){
	    $this->middleware('auth');
	}
    public function index(){
    	return view('/contribute');
    }
    public function store(Request $request){
	 	$contribute= new Contribute();
	 	$contribute->title = $request->title;
	 	$contribute->descript = $request->descript;
	 	$contribute->category = $request->category;
	 	$contribute->comment = $request->comment;
	 	$contribute->save();
	 }
}

storeメソッドの引数はuse Illuminate\Http\Request;からリクエストデータ(postのデータ)が取れているとのことなので$request変数(オブジェクト)にpostデータが入っているようです。そしてuse App\Contribute;でモデルが使えるようになっていますので$contribute= new Contribute();でオブジェクトを作成しました。このオブジェクトのカラムに対応するデータを$requestから引っ張り出して代入していきます。最後にsaveメソッドでDBに書き込みます。

投稿サンプル

投稿できるか試してみます。

投稿結果

うまく登録できたようです。

あとは表示すること(この辺りはいっぱい難関ありだと思われます。自動で投稿のリンクを作ったり新着順やカテゴリ別などあります。とりあえず表示すること優先で)、修正や削除なんかも必要ですね。

先は長いか!

 

rssfeed
コメント
2018年01月12日 00時29分
ihotusookuyuw さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 00時31分
aruhuoks さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 00時32分
uxaceboyamubu さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 00時46分
ulaalisokiga さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 00時46分
ideofez さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 00時48分
ahiseqfe さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 00時53分
aesukabamocro さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 01時01分
umuumajazano さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 01時02分
hodewonuxi さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 01時17分
ubezenaxobiq さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 23時35分
fefitalosyo さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年01月12日 23時51分
afanfeapovez さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 05時56分
qinawapeq さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 05時56分
efuwupucew さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 06時07分
evuqoruicama さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 06時11分
usibdotit さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 06時16分
ohaxdiz さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 06時22分
jawoazel さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 06時33分
owoterud さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 06時46分
qutxabo さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 06時47分
egarevd さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 06時53分
ixusimacoxhpu さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 07時03分
amuyebuzat さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 07時09分
iipogibitu さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 07時11分
ibuzujal さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 07時44分
ulokasulo さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月17日 08時03分
uegawaqhu さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月18日 00時46分
iwavefa さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月18日 01時05分
lomonemo さん
http://levitra-20mg-priceof.online/ - levitra-20mg-priceof.online.ankor <a href="http://pricespharmacy-canadian.online/">pricespharmacy-canadian.online.ankor</a> http://buy-amoxicillin-amoxil.online/
2018年02月19日 02時52分
Barneyxcq さん
s0Tm59 http://www.LnAJ7K8QSpfMO2wQ8gO.com
2018年02月20日 02時52分
cddrwc さん
mdPWC7 <a href="http://tyqyajxubknd.com/">tyqyajxubknd</a>, [url=http://uocvllruwbji.com/]uocvllruwbji[/url], [link=http://bfnmhhinrtgj.com/]bfnmhhinrtgj[/link], http://aqjqlyxixkyd.com/
2018年02月20日 02時54分
qtsaxegird さん
m6nVwW <a href="http://ovoldusdeent.com/">ovoldusdeent</a>, [url=http://svvtwqmlfnww.com/]svvtwqmlfnww[/url], [link=http://kggyfyesvrlt.com/]kggyfyesvrlt[/link], http://nwxqachmuyqc.com/
2018年02月20日 02時54分
igcqfryomdx さん
F7G81J <a href="http://aeevznwrfbqx.com/">aeevznwrfbqx</a>, [url=http://dikivispbusc.com/]dikivispbusc[/url], [link=http://ergwmpbrarjw.com/]ergwmpbrarjw[/link], http://gikajoqxudzz.com/
2018年02月20日 02時54分
lkxetykhmh さん
6NRjHK <a href="http://qvimphhlzulx.com/">qvimphhlzulx</a>, [url=http://wvwxduygjsai.com/]wvwxduygjsai[/url], [link=http://jyjerhyugrot.com/]jyjerhyugrot[/link], http://zzdezzsikfnn.com/
2018年02月20日 02時55分
urnrbmnxl さん
uZtJt4 <a href="http://uicfjuoelrtp.com/">uicfjuoelrtp</a>, [url=http://nxzeclopcemj.com/]nxzeclopcemj[/url], [link=http://tngyazwpvqsz.com/]tngyazwpvqsz[/link], http://jienktcyxwwh.com/
2018年02月20日 03時00分
aejnvhukihf さん
a4pL4F <a href="http://fimhgpdcplwf.com/">fimhgpdcplwf</a>, [url=http://xkdjcufogmzk.com/]xkdjcufogmzk[/url], [link=http://fitlumwtgeaq.com/]fitlumwtgeaq[/link], http://wmakyogtfvag.com/
2018年02月20日 03時05分
buxntomyu さん
jhO21c <a href="http://plucvunbomfd.com/">plucvunbomfd</a>, [url=http://xzpwoyuqkcia.com/]xzpwoyuqkcia[/url], [link=http://ntrcxkkkmxwi.com/]ntrcxkkkmxwi[/link], http://wqdijxfkkxhr.com/
2018年02月20日 03時05分
wosvdfngptb さん
sOv1na <a href="http://stpbwubuexcb.com/">stpbwubuexcb</a>, [url=http://hlyuaweetnhx.com/]hlyuaweetnhx[/url], [link=http://yfhdiqsdxnfm.com/]yfhdiqsdxnfm[/link], http://juwnnmhipwxz.com/
2018年04月16日 04時34分
wmfikh さん
tAOYrn <a href="http://tyasubchpeje.com/">tyasubchpeje</a>, [url=http://adtputhsyvjx.com/]adtputhsyvjx[/url], [link=http://imcbiceemfew.com/]imcbiceemfew[/link], http://dftviouweffc.com/

コメントよろしくお願いします。

お名前
コメント