- 投稿日：2021-04-29T22:37:17+09:00
【Laravel 独自ページネーションを作成する方法】
LaravelのbladeとIlluminate\Pagination\LengthAwarePaginatorインスタンスでカスタムページネーションを実装する。 目的 S3の画像を一覧表示したい 流れ S3にあるオブジェクトURLを保存しているDBから配列でオブジェクトURLを取得→その配列をページネーションする。 ＃LengthAwarePaginatorクラスを使うときは、自分で配列かコレクションを分割しなければならない。配列ならarray_slice、コレクションならforpageなど。 1. bladeで表示する準備 ・ページネーション済みの配列を回して、s3に保存されている画像を一覧表示させている。 <div class="container"> @foreach ($s3ImgUrls as $objectrl) <img src="https://S3バケット名.s3-リージョン名.amazonaws.com/{{ $objectUrl }}" > @endforeach </div> {{ $s3imgUrls->links('vendor/pagination/semantic-ui') }} links() では、以下のコマンドで生成されたview/vender/pagination内のいくつかあるbladeの一つを指定している。 php artisan vendor:publish --tag=laravel-pagination 2. bladeで表示させるページネーションされた$s3imgUrls を生成する。 ポイントは、リクエストされたページ数によってarray_slice()で切り取る範囲を変えているところ。 $array = //独自ペジネータ配列の全体像 $display_limit = 3 $arrayOfNum = ((int)($request->page ?? 1) - 1) * $display_limit; $sliced_items = array_slice($array, $arrayOfNum, $display_limit); $s3ImgUrls = new LengthAwarePaginator( $sliced_items, // 現在のページのsliceした情報(items) count($array), // 総件数（total） $display_limit, // １ページに表示される数 (perPage) $currentPage, // 現在のページ(ページャーの色がActiveになる)（currentPage） ['path' => $url] // ページャーのリンクを指定 ); 3. bladeのcssを整える。 以下のようなページネーションが作れる。
- 投稿日：2021-04-29T22:32:24+09:00
続Laravel5.5でもVue.jsっぽくReact.js x TypeScriptを部分的に導入する
概要 Laravel5.5でもVue.jsっぽくReact.jsを部分的に導入するの続きで、TypeScriptを導入します。 TypeScript導入 $ npm install -D typescript @types/node @types/react @types/react-dom tsconfig.json作成 $ ./node_modules/.bin/tsc --init tsconfig.json { "compilerOptions": { "target": "es5", "module": "commonjs", "noImplicitAny": false, "jsx": "react", "strict": true, "esModuleInterop": true, "skipLibCheck": true, "forceConsistentCasingInFileNames": true }, "exclude": [ "vendor" ] } Laravel-Mixアップグレード webpackが4系じゃないとコンパイルがうまくいかないらしい package.json . . . "laravel-mix": "^5.0", . . . $ npm i ts-loaderインストール $ npm i ts-loader@^8 -D webpack.mix.js編集してtsを使用 webpack.mix.js mix.ts('resources/assets/js/app.tsx', 'public/js'); resources/assets/js/app.tsx作成 resources/assets/js/app.tsx import * as React from 'react'; import { render } from 'react-dom'; type Props = { title: string | null } const Example: React.FC<Props> = ({ title }) => ( <div className="container"> <div className="row"> <div className="col-md-8 col-md-offset-2"> <div className="panel panel-default"> <div className="panel-heading">Example Component</div> <div className="panel-body"> {title} </div> </div> </div> </div> </div> ); const Element = document.getElementById('example'); if (Element) { const title = Element.getAttribute('title'); render(<Example title={title} />, document.getElementById('example')); } resources/views/welcome.blade.phpでprops設定 welcome.blade.php . . . <body> <div class="flex-center position-ref full-height"> <div id="example" title="ts-react"></div> </div> <script src="{{ asset('js/app.js')}}"></script> </body> コンパイルと画面表示 $ npm run dev $ php artisan serve 参考 Laravel bladeからReactコンポーネント(Material UI)にバリデーションエラーメッセージを渡してみる [Laravel × React] Laravel×React(Typescript)の環境構築
- 投稿日：2021-04-29T22:20:27+09:00
【Docker】Error response from daemon: invalid mount config for type "bind": bind source path does not exist
問題 $ docker compose up -d [+] Running 0/2 ⠋ Container 3e5dfe8d1909_docker-laravel-handson_app_1 R... 0.1s ⠋ Container be3584c24dc2_docker-laravel-handson_web_1 R... 0.1s The new 'docker compose' command is currently experimental. To provide feedback or request new features please open issues at https://github.com/docker/compose-cli Error response from daemon: invalid mount config for type "bind": bind source path does not exist: /host_mnt/Users/ucan/work/ucan-lab/docker-laravel-handson/backend 原因(?) Docker Desktop のファイル共有の権限がなくてエラーになる場合があるようです。 Preferences... > Resources > FILE SHARING 今回は /Users 配下にあるディレクトリをマウントしようとしているので、問題ない気がします...? /host_mnt を追加しないといけないのか...？ 対処 Docker Desktop自体を一度終了させて、再度 docker compose up -d することでうまくいきました。 原因がハッキリしなくて気持ち悪いですが、そんなこともあるんですかね...? 参考 https://docs.docker.com/docker-for-mac/#file-sharing https://blog.dand.work/article/396 https://www.takapy.work/entry/2019/02/24/110932
- 投稿日：2021-04-29T21:41:05+09:00
Laravelでウェブアプリを作ろう
Laravelをアプリケーションサーバーとして動かすための設定を記載していきます 参考にさせていただいたサイト 自分の動作環境ではいくつかエラーが出たので、その点も含めて修正したデータを載せていきます 動作環境 MacOS Big Sur MacBookAir(13-inch, Mid2013) もくじ ウェブアプリは以下の手順で作成するものとします 環境設定+プロジェクトの作成 composerによるプロジェクトの作成 データベース Dockerでコンテナの作成とその接続設定 Migrateの作成 モデルとシーダーの作成 リクエスト ルーティング コントローラー 画面の出力
- 投稿日：2021-04-29T20:15:07+09:00
[簡単]モダン構成なSPAで作るチュートリアル①(環境構築編)
SPAで作るタスク管理アプリのチュートリアル 勉強会に参加したりするとReact.jsとかVue.jsやってみたくて勉強はしてるけど、LaravelとかRailsと、どうつなぎ込んでいいか分からんって人が多いみたいやな。 転職用のポートフォリオでもSPA化すると評価は上がるらしいな。知らんけど。 独立した技術として本とかUdemyで触ったりしてるけど、SPA化するような本とか記事は少ないみたいやから困ってる人もいるみたいやね。 かく言う私も初めてSPAのプロジェクトに参加したときは、なんのこっちゃ分かれへんかったけど、自分でタスク管理アプリ作ってJSONで繋ぎこむ部分が理解出来たら、あとはフロントとバックエンドは別世界で考えられるからちょっとワカル状態なんやな。 予定では ①環境構築(Docker/Laravel/React.js/Material-UI) ②React側でルーティング設定 ③Reactで一覧テーブル作成 ④seederで作ったDBのデータをReactに渡して一覧に表示 ⑤新規登録機能 ⑥編集・削除機能 みたいな感じで進めていくつもりや Laravelに関してはJSON返すだけやから、普段Railsの人がこのチュートリアルやってみたら、 Railsに置き換えることは簡単やと思うわ。 React.jsとVue.jsの違いは語れるほど理解できてないから何も言わんとくわな。 下のGIFみたいな感じで作っていくで。 転職用のポートフォリオ考えてる人とかはこのチュートリアルやってから、 自分のアプリ作っていったらええんちゃうかな。 前提 Gitをインストール https://git-scm.com Mac GitHub SSH接続設定をしておく Dockerを使えるようにインストール https://www.docker.com/products/docker-desktop [注意]npmやyarnのインストールで下記のエラーが出たらコンテナ内のリソース配分の問題かもしれんから、 preferencesからCPUとかメモリの割当を増やしてみてほしい 各種バージョンについて バージョンはこんな感じ - php v8.0.3 - Laravel v8.40.0 - MySQL v8.0 - npm v6.14.4 - Node.js v14.2.0 - React.js v17.0.2 - Material-UI v4.11 記事書いた時点ではそれなりにモダンな選定やと思われるな Laravelの環境構築 環境構築はこちらの記事を使わせてもらうな。 【忙しい人向け】カップ麺より早く作るDockerでLaravel開発環境構築 (@ucan-lab さん) エイリアスを設定してくれていたりで、かなり使いやすいし、 爆速で構築できる且つ環境一致させるのに最適なので、ぜひ使ってみるとええで。 今回の記事はSPAでバックエンドとフロントエンドでデータのやり取りするところをメインにしたいから、サクッと環境作れるのはマジ神やな。 また@ucan-labさんが解説も詳細に書いてくれているので、dockerに強くなりたい人とかチュートリアル中にわからんコマンドとかあったら読んでみるとええでと思うで。(https://qiita.com/ucan-lab/items/5fc1281cd8076c8ac9f4) 文中に登場するmakeコマンドはエイリアスやからMakefile見てもらえば実行内容は分かるようにしてくれてはるわ。 まぁ、dockerは別にええわって人はなれてる環境で構築してくれても大丈夫やわ。 その場合makeコマンドのところはMakefile見て良しなに置き換えてくれな。 手順 $ git clone https://github.com/ucan-lab/docker-laravel.git $ cd docker-laravel # バージョンを合わせる場合は下記コマンドの前に*バージョン対応を参照 $ make create-project ローカルで既にPortが使われてたりするとエラーが出るからそのへんはええ感じにかぶらんように変えてくれておけやで *バージョン対応 Makefileのまま環境構築すると最新版のLaravelとなるため、バージョンを合わせたい場合はgit cloneしたディレクトリ直下のMakefileで下記変更を行ってからmake create-projectを行う #Makefile ６行目をバージョン指定に変える - docker-compose exec app composer create-project --prefer-dist laravel/laravel . # こちらは削除 + docker-compose exec app composer create-project --prefer-dist "laravel/laravel=8.4" . #こちらに変える Laravelの初期画面が表示されたらOKな ホンマにカップ麺食う暇もなかったな LGTM１００個ぐらい押したいところやわ。 DBクライアントを利用する場合 コマンドラインで進められる方はスルーしてもOKな MySQLが8.0のためTablePlus等を利用する(SeaquelProは8.0非対応のはず) 手順通り行っった場合は以下が接続情報となるわ Host: 127.0.0.1 Password:secret Port: 3306 User: phper Database: laravel_local レコードはまだ存在しないもののuserテーブルとか出来てるの確認できたらOKやね ここまでできたら変更差分を分かりやすくするためにブランチを切ってコミットしておくとええな $ git checkout -b taskApp $ git add . $ git commit -m "TaskAppInit" Reactの環境構築 UIのパッケージをインストールし、Reactの導入 npm関連で手順通りやってThis is probably not a problem with npm. There is likely additional logging output above.が出る場合はdockerのリソースの問題かもしれないから書いておくな # npmを使えるようにしておく $ make npm # UIパッケージ導入 $ docker-compose exec app composer require laravel/ui # React.js導入 $ docker-compose exec app php artisan ui react --auth # 下記の様の出たらOK React scaffolding installed successfully. Please run "npm install && npm run dev" to compile your fresh scaffolding. Authentication scaffolding generated successfully. npmでビルド $ make npm-install $ make npm-dev コマンドにより生成された不要なファイルを削除しておく resources/viewsの下はシングルページとするためapp.blade.phpのみとする 下記4項目を削除する /auth以下 layouts - (app.blade.phpをviews直下に移動させlayoutsディレクトリ自体を削除) home.blade.php welcome.blade.php # 削除後にresources/viewsディレクトリ下は下記のようになっていればOK resources ┗ views ┗ app.blade.php (layouts下に出来ていたものをviews下に移動する) views/app.blade.phpを修正 既存のコードに対してid="app"の中身を空っぽにするで # views/app.blade.php <!doctype html> <html lang="{{ str_replace('_', '-', app()->getLocale()) }}"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- CSRF Token --> <meta name="csrf-token" content="{{ csrf_token() }}"> <title>{{ config('app.name', 'Laravel') }}</title> <!-- Scripts --> <script src="{{ asset('js/app.js') }}" defer></script> <!-- Fonts --> <link rel="dns-prefetch" href="//fonts.gstatic.com"> <link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet"> <!-- Styles --> <link href="{{ asset('css/app.css') }}" rel="stylesheet"> </head> <body> <div id="app"> # id="app"の中身を空する変更 </div> </body> </html> resources/js/components/Example.jsを修正 id="app"としたため、getElementByIdを下記のように変更 example→app Example.js // 20行目以下を修正 export default Example; if (document.getElementById('app')) { ReactDOM.render(<Example />, document.getElementById('app')); } routes/web.phpを修正 シングルページアプリケーションなのでどんなURLだったとしても/views/app.blade.phpを表示するように設定します。 web.php // 既存コードの16行目以下を削除 // Route::get('/', function () { // return view('welcome'); // }); // Auth::routes(); // Route::get('/home', [App\Http\Controllers\HomeController::class, 'index'])->name('home'); // 追記 Route::get('{any}', function () { return view('app'); })->where('any','.*'); Reactを読み込む準備できたのでビルドする $ make npm-dev 画面をリロードしてExample Componentという文字列が表示されたらReactの導入はOK これは何が表示されているかというとresources/js/components/Example.jsの中身が表示されている laravel側のid="app"にExampleコンポーネントの中身を表示しているんやな 試しに下記変更を加えてみるな Example.jp className="card-headerの文字列 Example Component → React導入できたわな？？ Example.js import React from 'react'; import ReactDOM from 'react-dom'; function Example() { return ( <div className="container"> <div className="row justify-content-center"> <div className="col-md-8"> <div className="card"> <div className="card-header">React導入できたわな？？</div> <div className="card-body">I'm an example component!</div> </div> </div> </div> </div> ); } export default Example; if (document.getElementById('app')) { ReactDOM.render(<Example />, document.getElementById('app')); } ビルド(make yarn-dev)すると下記のように表示されるはずやな Reactで修正したのに「あれ、、変わらん」みたいなことあるけど、だいたいビルド忘れてるか、キャッシュリロードできてないかどっちかのはずやわ。 ここまで来たらコミットしとこうな $ git add . $ git commit -m "React導入" Material-UIを導入 日本語の公式ドキュメントがある - MATERIAL-UI そもそも何やねんって話なんやけどGoogleが提唱してるマテリアルデザインを実現するためのUIフレームワークで、 手っ取り早く見た目がええ感じになるから使っていくな。 https://qiita.com/nogson/items/804dd3a879f482fb7018 ドキュメント通りに進めればOKやから下記のコマンドで進めていくで # コンテナ内でインストール docker-compose exec web npm install @material-ui/core ボタンをインポートしExample.jsの中で表示してみる Example.js import React from 'react'; import ReactDOM from 'react-dom'; import { Button } from '@material-ui/core'; //Buttonをインポート function Example() { return ( <div className="container"> <div className="row justify-content-center"> <div className="col-md-8"> <div className="card"> <div className="card-header">React導入できたわな</div> <div className="card-body">Im an example component!</div> //ボタンを追記 <Button color="primary" variant="contained">Hello World</Button> </div> </div> </div> </div> ); } export default Example; if (document.getElementById('app')) { ReactDOM.render(<Example />, document.getElementById('app')); } リロードしてHELLO WORLDボタンが表示されたらMaterial-UIの導入はOK ドキュメントがしっかりしているので参考にしながら弄ってみるといいかもしれないな 追加したボタンを以下のように書き換えてみる Expamle.js <Button color="secondaly" variant="contained">ワイがMaterial-UIのボタンやな？？</Button> 基本的にインポートしたものはタグ的な感じで使えて colerとかで簡単に見た目変えたりできるねん。 便利やな。 マウスオーバーすると色が変わるようになってたり 色々タグやテンプレートがあったりするからイジってみるとええちゃうかな。 コミットしておくな git add . git commit -m "Material-UIの導入" 今日はここまでやわ。 次ははReactで一覧テーブルのコンポーネント作っていくところをやっていこうと思うで。 次回はReactで一覧表示 ほな、LGTMよろしゅーやで。 ソースはGitHubに乗せておくから分からんときはコミット履歴見たら解決できるかもな。 https://github.com/morry48/LaravelReactTaskApp
- 投稿日：2021-04-29T17:58:57+09:00
Laravelでcsvファイルを一時的にアップロードする
LaravelでCSVファイルをサーバーに一時的に保存して、処理後に削除する方法のメモ 前提 バージョン：Laravel6 実装方法 ①csvファイルを一時保存する form.blade.php <body> {!! Form::open(['route' => 'upload', 'method' => 'post', 'files' => true]) !!} {!! Form::label('file', 'ファイル') !!} {!! Form::file('file', ['accept' => '.csv']) !!} {!! Form::submit('送信') !!} {!! Form::close() !!} </body> Laravel/collectiveではForm::openに'files' => trueを追記することでformタグにenctype="multipart/form-data"が適用される。 DataController.php public function upload(Request $request) { // バリデーション $request->validate([ 'file' => 'required|file|mimes:csv,txt|mimetypes:text/plain' ]); // ファイル名生成 $time = date('YmdHis'); $uploadFile = $request->file('file'); $fileName = $time . $uploadFile->getClientOriginalName(); // 一時保存 $uploadFile->storeAs('data', $fileName); } 一時的なファイルではあるが、念のためdate関数でタイムスタンプを作成してファイル名の重複を避けている。 storeAs('data', $fileName)の保存先はstorage/app/dataとなる。 ②csvファイルを変数に格納する DataController.php public function upload(Request $request) { //1部分は省略 // ファイルの内容を取得 $csvFile = new \SplFileObject(storage_path('app/data/' . $fileName)); // splFileObjectをcsv読込用に設定 $csvFile->setFlags( \SplFileObject::READ_CSV | // CSV列として行を読込 \SplFileObject::READ_AHEAD | // 先読み/巻き戻しで読み出し \SplFileObject::SKIP_EMPTY | // 空行を読み飛ばし。ただしREAD_AHEADが有効になっていることが前提 \SplFileObject::DROP_NEW_LINE // 行末の改行を読み飛ばし ); } strage_path()はデフォルトでstrageを参照しているため'app/data/'を追記してパスを通す必要がある。 $csvFileへの格納後は好きな処理を記述する。 ③一時保存したファイルを削除する DataController.php public function upload(Request $request) { //1、2部分は省略 //$csvFileの処理内容 // ファイルの削除 \Storage::delete('data/' . $fileName); } \Storageファサードはデフォルトでstorage/appを参照しているため'data/'を追記してパスを通す必要がある。 サンプル全文 form.blade.php <body> {!! Form::open(['route' => 'upload', 'method' => 'post', 'files' => true]) !!} {!! Form::label('file', 'ファイル') !!} {!! Form::file('file', ['accept' => '.csv']) !!} {!! Form::submit('送信') !!} {!! Form::close() !!} </body> web.php Route::post('/upload', 'DataController@upload')->name('upload'); DataController.php <?php namespace App\Http\Controllers; use Illuminate\Http\Request; class DataController extends Controller { public function upload(Request $request) { // バリデーション $request->validate([ 'file' => 'required|file|mimes:csv,txt|mimetypes:text/plain' ]); // ファイル名生成 $time = date('YmdHis'); $uploadFile = $request->file('file'); $fileName = $time . $uploadFile->getClientOriginalName(); // 一時保存 $uploadFile->storeAs('data', $fileName); // ファイルの内容を取得 $csvFile = new \SplFileObject(storage_path('app/data/' . $fileName)); // splFileObjectをcsv読込用に設定 $csvFile->setFlags( \SplFileObject::READ_CSV | // CSV列として行を読込 \SplFileObject::READ_AHEAD | // 先読み/巻き戻しで読み出し \SplFileObject::SKIP_EMPTY | // 空行を読み飛ばし。ただしREAD_AHEADが有効になっていることが前提 \SplFileObject::DROP_NEW_LINE // 行末の改行を読み飛ばし ); // ファイルの削除 \Storage::delete('data/' . $fileName); } }
- 投稿日：2021-04-29T17:55:35+09:00
Laravel 419|PAGE EXPIRED 解決方法
こちらの記事では今回発生したエラー'419|PAGE EXPIRED'の解決方法と原因についてご紹介します。 今回発生した該当コードは下記の通りです。 検索ワードを入力し、画面遷移したブラウザで検索結果を表示させようとした際にエラーが発生しました。 <form method="post" action="/list/search"> <input type="text" name="search"> <button> 検索 </button> </form> 419|PAGE EXPIRED 発生原因と解決方法 発生原因はformタグに@csrfを記述しなかったからです。 @csrfは、CSRF対策のために用意されたBladeディレクティブで、Laravelでは、CSRF対策がなされていないフォームの送信は例外が発生して受け付けられないようになっています！ ですので、formタグに@csrfを追加すれば今回のエラーは解決します。 <form method="post" action="/list/search"> @csrf // CSRF対策 <input type="text" name="search"> <button> 検索 </button> </form> CSRF（Cross Site Request Forgery）とは CSRFとはクロスサイトリクエストフォージェリと呼ばれるWebアプリケーションの脆弱性を利用したサイバー攻撃の一種になります。 攻撃手法 1.攻撃者が攻撃用Webページや不正なスクリプトなどを準備し、脆弱性のあるサイトのフォームなどから不正送信。 2.攻撃対象サーバ上のWebアプリが不正なリクエストを処理し、ユーザーが意図していない処理が行われる。 影響・被害 攻撃者自身が直接攻撃対象サーバへアクセスせずに、攻撃対象のWebアプリケーションに任意の処理を行わせることができます。 主な攻撃 ・いたずら的書き込み ・不正サイトへの誘導 ・犯罪予告といった掲示板やアンケートフォームへの不正な書き込み ・フォームへの大量なコンテンツの送り付けによるDoS攻撃 攻撃Webページに誘導された一般ユーザに直接的な被害はありませんが、攻撃対象サーバへの不正なリクエストを送信した攻撃者として認識されてしまうことがあります。 DoS攻撃 情報セキュリティにおける可用性（利用者が必要なときに安全にアクセスできる状態）を侵害する攻撃手法の一種。 Webサービスを稼働しているサーバやネットワークなどのリソース（資源）に、意図的に過剰な負荷をかけたり脆弱性をついたりする事でサービスを妨害します。 @csrfディレクティブ 上記のようなサイバー攻撃を防止するために用意されたのが@csrfです。 @csrfは、「トークン」と呼ばれるランダムな文字列を非表示フィールドとしてフォームに追加し、トークンの値が正しいフォームのみを受け付けるようにします。 こうすることで、用意されたフォームからの送信なのかどうかを見分けることができ、正しいフォーム以外からの不正な送信を阻止することが可能になります！ 参考サイト ・参考にしたQiita記事 https://qiita.com/taka_no_okapi/items/fb4bbe59c18eeaf5a043 ・Laravel公式ドキュメント https://readouble.com/laravel/8.x/ja/csrf.html ・クロスサイトリクエストフォージェリについて https://www.trendmicro.com/ja_jp/security-intelligence/research-reports/threat-solution/csrf.html
- 投稿日：2021-04-29T16:57:38+09:00
【Laravel初心者向け】DBの値を取得する際の方法
とよぴろだお。 LaravelのDBの値を取得する際の方法を書いてくお。 今後どんどん追記していくお。 get() Laravelでデータベースからデータを取得する時は以下のように。 $items = \DB::table('items')->get(); // 全てのデータが取得できる データベース名をtable()内に書き込んでget()を呼ぶだけ。 これでitemsの全データをデータベースから持ってくることができる。 first() get()は該当するデータ全て（上記だと'items'）を取得するやり方。 first()を使うと一つだけデータを取得することができる。 $items = \DB::table('items')->first(); この場合はitemsの中から一番最初のデータだけが取得できる。 Array ( [id] => 1 [name] => 名前0 [created_at] => 1995-02-23 17:21:50 // 私の誕生日 [updated_at] => 1995-02-23 17:21:50 // 私の誕生日 ) 「id」の昇順となるため「id」の1番目のデータが所得される。 findでidを指定して取得 Laravelではデータベースのテーブルに「id」というカラムがある。 これを利用した便利な書き方がfind()。 id番号を指定してあげればget()やfirst()を使わないでもデータが取得できる。 ではやってみよう！ $id = 1; $item = \DB::table('items')->find($id); また、idは複数の指定も可能。 $item = \DB::table('items')->find([1,2]); この場合複数のデータが取得される。 だから、foreach()を使ってループさせながらデータを取得させるといい。 該当するデータだけ取得する where()で指定する もし、カラム名「name」の「名前1」というデータを取得したい場合はwhere()を使って該当データだけを探しだす。 $item = \DB::table('items')->where('name','名前1')->first(); AND/OR検索 「->」でつなげてAND検索 例えば、以下の条件の場合。 ・ID番号は1番 ・アイテムの名前は「マンモス」 $item = \DB::table('items')->where('user_id', 1) ->where('name', 'マンモス') ->first(); AND検索の場合は、where()の後にまたアロー演算子「->」を使ってさらにwhere()を使って さらにwhere()を追加すればOK! orWhere()でOR検索 OR検索したい場合は、同じく「->」を使ってorWhere()を繋げることが可能。 $item = \DB::table('items')->where('item_id', 1) ->orWhere('name', 'マンモス') ->get(); イージー！ 他にも腐る程あるから、今後追記していくお！
- 投稿日：2021-04-29T16:37:36+09:00
[SQL SERVER + Laravel] IDENTIFY 設定したテーブルにIDを含むデータをInsertする
SQL Server で Identify 設定がしてあるテーブルにIDを含むInsert文を発行したところ、下記のエラーが発生。 SQLSTATE[23000]: [Microsoft][ODBC Driver 17 for SQL Server][SQL Server]IDENTITY_INSERT が OFF に設定されているときは、テーブル 'tableName' の ID 列に明示的な値を挿入できません。 Identifyが設定してある場合は任意のIDで登録できないんですね。というわけで、SET IDENTITY_INSERT 文を発行して一時的に設定を解除したのちに登録することにしました。 ややこしい（？）ポイントとしては、ON で identify を無効化、 OFF で有効化です。 構文 SET IDENTITY_INSERT [ [ database_name . ] schema_name . ] table_name { ON | OFF } コードサンプル（Laravel） プロジェクトがLaravelを使っていたので Laravel のコードになりますが、下記サンプルになります。 use DB; $tableName = 'test_table'; // IDを任意の値で設定したいので Identify 設定を解除 DB::unprepared("SET IDENTITY_INSERT {$tableName} ON;"); // ここでInsert文を発行 // 設定を戻す DB::unprepared("SET IDENTITY_INSERT {$tableName} ON;");
- 投稿日：2021-04-29T15:33:34+09:00
Laravel5.5でもVue.jsっぽくReact.jsを部分的に導入する
背景 タイトルまんま 導入 $ composer create-project --prefer-dist laravel/laravel react-laravel "5.5" $ cd react-laravel $ php artisan preset react $ npm install && npm run dev ここでコンパイルまでは行って、サンプルまで表示できる。 LaravelからReact.jsに変数を渡す welcome.blade.php . . . <body> <div class="flex-center position-ref full-height"> <div id="example" title="title"></div> </div> <script src="{{ asset('js/app.js')}}"></script> </body> Example.js import React from 'react'; import { render } from 'react-dom'; const Example = ({ title }) => ( <div className="container"> <div className="row"> <div className="col-md-8 col-md-offset-2"> <div className="panel panel-default"> <div className="panel-heading">Example Component</div> <div className="panel-body"> {title} </div> </div> </div> </div> </div> ); const Element = document.getElementById('example'); if (Element) { const title = Element.getAttribute('title'); render(<Example title={title} />, document.getElementById('example')); } いざコンパイルと画面表示 $ npm run dev $ php artisan serve 参考 Laravel bladeからReactコンポーネント(Material UI)にバリデーションエラーメッセージを渡してみる
- 投稿日：2021-04-29T15:28:37+09:00
laravel8 tailwind テーブルに中央配置
こちらの記事では、Laravelでtailwindを使ったテーブルを中央に配置する方法についてご紹介します！ 非常に簡単に実装できるので是非参考にして頂ければと思います！ テーブル中央配置を実装 <div class="flex justify-center"> <table> <thead class=""> <tr> <th class="">期限</th> <th class="">商品</th> <th class="">数量</th> </thead> <tbody class=""> @foreach ($stocks as $stock) <tr class =""> <td class=""> {{$stock->deadline}} </td> <td class=""> {{$stock->name}} </td> <td class=""> {{$stock->number}} </td> </tr> @endforeach </tbody> </table> </div> tailwindの実装はdivタグ内のclassにflex justify-centerを実装するだけです。 あとは文字の大きさやテーブルの幅、背景色など、個別によって実装したいデザインがあるかと思うので、各タグのclassに記述していけばOKです！ 今回実装したflex justify-centerについては下記のリンクからtailwind公式のサイトをご覧ください。 https://tailwindcss.com/docs/justify-content#class-reference
- 投稿日：2021-04-29T10:43:52+09:00
AWSのCloud9(Amazon Linux2)を利用してLaravelで好きなYouTube動画を管理できるプラットフォームを作る
AWSのCloud9でLaravelを使ってみる PHPのワークフレームであるLaravelを使ってみたいと思い、色々と学んだことを健忘録がてら、まとめようと思います。 特にAmazon Linux2に関しては、調べてもナレッジが少なかったので、他の方の参考になれば幸いです。 AWS上でCloud9を起動し、環境設定を行う AWSにサインイン AWSからコンソールにサインインする。 案内に従って、マネジメントコンソールが表示されるまで進む Cloud9を検索 検索窓でCloud9を検索し選択 environmentを構築する environment=プロジェクトの構築環境を作る。 ますは、「create environment」を選択し、 名前と詳細を記入し、 環境設定を行う。 「Instance type」は無料枠の場合、「t2.micro」を選択する。 また、30分ごとに接続が切れるように設定しないと、気付いたら高額の請求がされる可能性があるので注意。 Laravelの環境設定 environmentの構築が終わると、下のような画面が表示されます。 一番したのwindowはtarminal windowであり、以下もコードをこのwindowに書き込んでいきます。 ＊コマンド入力の最中に質問されることがありますが、全て'y'と答えれば問題ないです。 PHPセットアップ まずはPHP７.２のセットアップ ターミナル $ sudo amazon-linux-extras install php7.2=stable ターミナル $ sudo yum install php-mbstring php-pecl-memcached php-gd php-apcu php-xml MaryaDBの設定 MySQLの上位互換であるMaryaDBを構築 MaryaDBの設築 ターミナル $ sudo amazon-linux-extras install -y lamp-mariadb10.2-php7.2 MariaDBのインストール ターミナル $ sudo yum install -y mariadb-server MariaDBの起動と初期設定 ターミナル $ sudo systemctl start mariadb ターミナル $ sudo mysql_secure_installation 上記のコマンド入力後に初期設定についていくつか質問されるので、以下のように答えます。 新しいパスワードを入力する時、入力の文字は表示されないので注意してください。 <初回設定の入力項目> Set root password? [Y/n] y New password: root Re-enter new password: root Remove anonymous users? [Y/n] y Disallow root login remotely? [Y/n] y Remove test database and access to it? [Y/n] y Reload privilege tables now? [Y/n] y MaridaDBの自動起動を有効化 MaridaDBが自動で起動するように設定。 ターミナル $ sudo systemctl enable mariadb ターミナル $ sudo systemctl is-enabled mariadb Composerインストール PHPのライブラリを管理してくれるComposerをインストールする。 ターミナル $ curl -sS https://getcomposer.org/installer | php ターミナル $ sudo mv composer.phar /usr/bin/composer ターミナル $ composer Laravelインストール composerを利用してcmsという作業ディレクトリを作成しLaravelをインストールします。 ターミナル $ composer create-project laravel/laravel cms 6.* --prefer-dist 今後の作業はこのcmsディレクトリで行います。 サーバーの起動とLaravelの起動 BuiltInサーバーを起動：動作確認 サーバーを起動するために、先ほど作成した作業ディレクトリであるcmsに移動 $ cd cms 下記コマンドを入力しサーバーを起動します。 $ php artisan serve --port=8080 Cloud9の画面上部の緑の起動ボタンの左側PreviewボタンからPreview Running Applicationをクリック 右下に画面が起動してLaravelの文字が確認できたら、Laravelのインストール成功 新しくpop upしたwindowの右上にある「pop up into new window」を選択し、新規タブでLaravelのデモ画面を表示 今後はこの画面で更新した内容を確認する サーバーを起動しているtarminalはそのままに、新しいtarminalを立ち上げておく。 上記までの流れでLaravelの環境設定は完了です。 データベースの作成 新しく立ち上げたターミナルで作業ディレクトリであるcmsに移動 ターミナル $ cd cms 下記コマンドを入力していき、c9というデータベースを作成 ターミナル $ mysql -u root -p パスワードの「root」を入力 ターミナル root [Enterキー] c9というデータベースを作成 ターミナル create database c9; うまく作成されたか確認 ターミナル show databases; 下記のようにtarminalに表示されれば成功 データベースから退場 ターミナル exit; Laravelプロジェクト初期設定 .envファイルの更新 上記のように「Show Hidden Files」を設定し.envファイルが確認 .envファイルの下記該当部分を内容を下記のように更新し保存 .env DB_CONNECTION=mysql DB_HOST=localhost DB_PORT=3306 DB_DATABASE=c9 DB_USERNAME=root DB_PASSWORD=root Composerアップデートコマンド実行 更新内容を反映するために、サーバーを一度停止。 サーバーを動かしているtarminalで"control+c"を入力し、サーバーを停止。 その後下記を入力し、composerをupdate。 ターミナル sudo composer update 途中で質問が出るが、yesで回答。 その後、再度サーバーを起動。 ターミナル $ php artisan serve --port=8080 /app/Providers/ AppServiceProvider.php ファイルを修正 app→Providers→AppServiceProvider.phpと進み、下記のように記載。 AppServiceProvider.php <?php namespace App\Providers; use Illuminate\Support\ServiceProvider; use Illuminate\Support\Facades\Schema; //この行を追加 use Illuminate\Support\Facades\URL; //この行を追加 class AppServiceProvider extends ServiceProvider { /** * Register any application services. * * @return void */ public function register() { // } /** * Bootstrap any application services. * * @return void */ public function boot() { Schema::defaultStringLength(191); //この行を追加 URL::forceScheme('https'); //この行を追加 } } phpMyAdmin設定 cms階層からpublicフォルダに移動 $ cd public phpMyAdminのzipをダウンロード $ wget https://files.phpmyadmin.net/phpMyAdmin/4.8.3/phpMyAdmin-4.8.3-all-languages.zip zipファイルを解凍 $ unzip phpMyAdmin-4.8.3-all-languages.zip cms階層に戻る $ cd .. phpMyAdminを確認する publicフォルダ内に「phpMyAdmin-4.8.3-all-languages」フォルダが作成される。 フォルダ名が長いので「phpMyAdmin」に変更。 「Preview」で開かれているURLの最後に「phpMyAdmin/index.php」をつけてEnterキーを押す。 ＊ URL例： https://＊＊＊＊＊＊.cloud9.us-east-1.amazonaws.com/phpMyAdmin/index.php phpMyAdmin画面が表示されたら： ユーザー名・パスワードともに「root」を入力してログイン ログインできればOK お気に入りYouTube管理アプリを実装する 以下のコマンドは作業ディレクトリのcmsで行ってください。 Laravel/uiの実装 今後のUIを整えるために必要なパッケージをインストールします。 インストールできると、ログイン認証画面が簡単に実装できます。 1. マイグレーションを実行 php artisan migrate 2. laravel/ui パッケージをインストール composer require laravel/ui:^1.0 --dev 3. artisan コマンドを実行 php artisan ui vue --auth 4. npmパッケージをインストール npm install 5. パッケージをビルド npm run dev 右上にログインが表示されれば、成功です。 データベースにMoviesテーブルを作成する為のマイグレーションを作成 1. artisanコマンドでマイグレーション作成 ターミナル $ php artisan make:migration create_movies_table --create=movies 2. database/migrationsの直下のmovies_table.phpに以下追記 movies_table.php public function up() { Schema::create('movies', function (Blueprint $table) { $table->bigIncrements('id'); $table->string('item_name'); $table->text('item_url'); $table->timestamps(); }); } 3. マイグレーション実行（テーブルの作成） ターミナル php artisan migrate phpMyAdminでmoviesが作成されているか確認する カラムの修正・追加時は、tableのファイルを修正・保存後に、下記コマンドでrefreshする。 ターミナル $ php artisan migrate:refresh モデルの作成/ルーティングとviewの設定 1.artisanコマンドでモデル作成 作成したテーブルを適宜使用するためにモデルを作成します。 このモデルに対して働きかけることで、テーブルの管理を行います。 その際に、複数形のテーブル名を単数形＋大文字スタートでモデル名を設定すれば、Laravel上で自動的にリンクされます。 ターミナル $ php artisan make:model Movie 2./routes/web.phpの設定 web.phpはこのプロジェクトの設計図にあたる場所で、このプロジェクトで使用するURLを管理する場所です。 このファイルを見れば、このプロジェクトがどのように作成されているかを理解できる場所です。 まず、このweb.phpと先ほど作成したMovieモデルを接続します。 また、後ほど作成するコントローラーに機能を振り分けるための処理を記載します。 web.php <?php use App\Movie; use Illuminate\Http\Request; /* |-------------------------------------------------------------------------- | 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('/', 'MoviesController@index'); // 新「動画」を追加 Route::post('/movies', 'MoviesController@store'); // 動画を削除 Route::delete('/movie/{movie}', 'MoviesController@destroy'); //「動画」を更新画面表示 Route::get('/moviesedit/{movie}','MoviesController@edit'); //「動画」を更新処理 Route::post('movies/update','MoviesController@update'); Auth::routes(); Route::get('/home', 'HomeController@index')->name('home'); Auth::routes(); Route::get('/home', 'HomeController@index')->name('home'); 4. MoviesControllerの設定。 app->Http->Controllers->MoviesController.phpに下記を追記します。 MoviesController.php <?php namespace App\Http\Controllers; use Illuminate\Http\Request; use App\Movie; use Validator; class MoviesController extends Controller { /** * Display a listing of the resource. * * @return \Illuminate\Http\Response */ public function index() { $movies = Movie::orderBy('created_at', 'asc')->paginate(3); return view('movies', [ 'movies' => $movies ]); } /** * Show the form for creating a new resource. * * @return \Illuminate\Http\Response */ public function create() { // } /** * Store a newly created resource in storage. * * @param \Illuminate\Http\Request $request * @return \Illuminate\Http\Response */ public function store(Request $request) { //バリデーション $validator = Validator::make($request->all(), [ 'item_name' => 'required|max:255', ]); //バリデーション:エラー if ($validator->fails()) { return redirect('/') ->withInput() ->withErrors($validator); } //以下に登録処理を記述（Eloquentモデル） // Eloquent モデル $movies = new Movie; $movies->item_name = $request->item_name; $movies->item_url = $request->item_url; $movies->save(); return redirect('/'); } /** * Display the specified resource. * * @param int $id * @return \Illuminate\Http\Response */ public function show($id) { // } /** * Show the form for editing the specified resource. * * @param int $id * @return \Illuminate\Http\Response */ public function edit(Movie $movie) { return view('moviesedit', ['movie' => $movie]); } /** * Update the specified resource in storage. * * @param \Illuminate\Http\Request $request * @param int $id * @return \Illuminate\Http\Response */ public function update(Request $request) { //バリデーション $validator = Validator::make($request->all(), [ 'item_name' => 'required|max:255', ]); //バリデーション:エラー if ($validator->fails()) { return redirect('/') ->withInput() ->withErrors($validator); } // Eloquent モデル $movies = Movie::find($request->id); $movies->item_name = $request->item_name; $movies->item_url = $request->item_url; $movies->save(); return redirect('/'); } /** * Remove the specified resource from storage. * * @param int $id * @return \Illuminate\Http\Response */ public function destroy(Movie $movie) { $movie->delete(); //追加 return redirect('/'); //追加 } } 5. resources/views/の直下にmovies.blade.php を作成して以下を追記 動画を登録するためのUIとなるページを作成します。 UI部分はこのviewsファイルに格納します。 movies.blade.php <!-- resources/views/movies.blade.php --> @extends('layouts.app') @section('content') <!-- Bootstrapの定形コード… --> <div class="card-body"> <div class="card-title"> ＜お気に入り動画入力フォーム＞ </div> <!-- バリデーションエラーの表示に使用--> @include('common.errors') <!-- バリデーションエラーの表示に使用--> <!-- 動画登録フォーム --> <form action="{{ url('movies') }}" method="POST" class="form-horizontal"> {{ csrf_field() }} <!-- 動画のタイトル --> <div class="form-group"> <div class="card-title"> ＜動画タイトル＞ </div> <div class="col-sm-6"> <input type="text" name="item_name" class="form-control"> </div> </div> <!-- 動画のURL --> <div class="form-group"> <div class="card-title"> ＜動画URL＞ </div> <div class="col-sm-6"> <input type="text" name="item_url" class="form-control"> </div> </div> <!-- 動画 登録ボタン --> <div class="form-group"> <div class="col-sm-offset-3 col-sm-6"> <button type="submit" class="btn btn-primary"> Save </button> </div> </div> </form> <!-- 現在の動画 --> @if (count($movies) > 0) <div class="card-body"> <div class="card-body"> <table class="table table-striped task-table"> <!-- テーブルヘッダ --> <thead> <th>動画タイトル</th> <th>動画URL</th> <th> </th> <th> </th> <th> </th> </thead> <!-- テーブル動画体 --> <tbody> @foreach ($movies as $movie) <tr> <!-- 動画タイトル --> <td class="table-text"> <div>{{ $movie->item_name }}</div> </td> <!-- 動画URL --> <td class="table-text"> <div>{{ $movie->item_url }}</div> </td> <td class="table-text"> <button type=“submit” class="btn btn-success" onclick="location.href='{{$movie->item_url}}'">動画へ</button> </td> <!-- 動画: 削除ボタン --> <td> <form action="{{ url('moviesedit/'.$movie->id) }}" method="GET"> {{ csrf_field() }} <button type="submit" class="btn btn-primary">更新 </button> </form> </td> <td> <form action="{{ url('movie/'.$movie->id) }}" method="POST"> <form action="{{ url('movie/'.$movie->id) }}" method="POST"> {{ csrf_field() }} {{ method_field('DELETE') }} <button type="submit" class="btn btn-danger"> 削除 </button> </form> </td> </tr> @endforeach </tbody> </table> </div> </div> @endif <!-- Movie: 既に登録されてる動画のリスト --> <div class="row"> <div class="col-md-4 offset-md-4"> {{ $movies->links()}} </div> </div> @endsection 6. resources/views/の直下にmoviesedit.blade.php を作成して以下を追記 動画の内容を変更し登録するためのUIとなるページを作成します。 moviesedit.blade.php @extends('layouts.app') @section('content') <div class="row"> <div class="col-md-12"> @include('common.errors') <form action="{{ url('movies/update') }}" method="POST"> <!-- item_name --> <div class="form-group"> <label for="item_name">Title</label> <input type="text" name="item_name" class="form-control" value="{{$movie->item_name}}"> </div> <!--/ item_name --> <!-- Save ボタン/Back ボタン --> <div class="well well-sm"> <button type="submit" class="btn btn-primary">Save</button> <a class="btn btn-link pull-right" href="{{ url('/') }}"> Back</a> </div> <!--/ Save ボタン/Back ボタン --> <!-- id 値を送信 --> <input type="hidden" name="id" value="{{$movie->id}}" /> <!--/ id 値を送信 --> <!-- CSRF --> {{ csrf_field() }} <!--/ CSRF --> </form> </div> </div> @endsection 7. /resources/views/common/errors.blade.phpを作成し以下を追記 誤った入力が行われた場合の処理を設定するために、commonフォルダを作成し、errors.blade.phpファイルを作成します。 errors.blade.php @if (count($errors) > 0) <!-- Form Error List --> <div class="alert alert-danger"> <div><strong>入力した文字を修正してください。</strong></div> <div> <ul> @foreach ($errors->all() as $error) <li>{{ $error }}</li> @endforeach </ul> </div> </div> @endif データベース管理の設定について データベースは、 ① 登録 ② 表示 ③ 更新 ④ 削除 の4つ機能で全て表現することができます。 そしてこれらの処理については、MoviesController.phpに記載されています。 登録について web.phpの中も「動画の追加部分」に'MoviesController@store'と記載することで、登録処理についてはMoviesController.php内のstore部分で行うように振り分けることができます。 MoviesController.php public function store(Request $request) { //バリデーション $validator = Validator::make($request->all(), [ 'item_name' => 'required|max:255', ]); //バリデーション:エラー if ($validator->fails()) { return redirect('/') ->withInput() ->withErrors($validator); } //以下に登録処理を記述 $movies = new Movie; $movies->item_name = $request->item_name; $movies->item_url = 'aaaa'; $movies->item_details = 'details'; $movies->published = '2017-03-07 00:00:00'; $movies->save(); return redirect('/'); } 表示について web.phpの中も「動画管理の初期画面」に'MoviesController@index'と記載することで、表示についてはMoviesController.php内のindex部分で行うように振り分けることができます。 MoviesController.php public function index() { $movies = Movie::orderBy('created_at', 'asc')->paginate(3); return view('movies', [ 'movies' => $movies ]); } これにより、Movieモデルを介して、moviesテーブル内のデータが降順に$moviesに格納され、viewファイル内のmovies.blade.phpにデータが渡されます。 更新について web.phpの中も「更新画面表示」にからMoviesedit.phpに遷移し、中の処理は'MoviesController@edit'と記載することで、MoviesController.php内のedit部分で行うように振り分けることができます。 MoviesController.php public function index() { $movies = Movie::orderBy('created_at', 'asc')->paginate(3); return view('movies', [ 'movies' => $movies ]); } その後、updateにて更新された内容が反映されます。 削除処理について web.phpの中の「削除」部分にあるdeleteの中に、選択された項目のidを持った変数が選択され、それが削除されるという処理をMoviesController.php内のdestoryに振り分けるという記述を行いっています。 MoviesController.php public function destroy(Movie $movie) { $movie->delete(); //追加 return redirect('/'); //追加 } 長々と書きましたが、これで下記のようなものが実装完成です。
- 投稿日：2021-04-29T10:20:58+09:00
Laravel〜Eloquentリレーション〜
はじめに テーブルは自身で独立していることよりも他のテーブルを関係を持っていることが多い。 そのため、テーブル同士でリレーションを設定することで他のテーブルへのデータのアクセスが 可能となる。 今回は以下の４ケースについて紹介する。 1. 1対1 2. 1対多 3. 1対多（Inverse） 4. 多対多 1対1 まずは1対1で、例として公式ドキュメント同様に、userモデルとphoneモデルを挙げる。 ユーザー1人に対して、携帯電話が1台持っており、1台の携帯電話に対してユーザーは 1人なので1対1のリレーションを持っている。 まずは親モデル(userモデル)にhasOneメソッドを記載する。 <?php namespace App; use Illuminate\Database\Eloquent\Model; class User extends Model { public function phone() { return $this->hasOne('App\Phone'); //第一引数にモデル名 } } また、外部キーは自動で「親モデル_id」と指定されてしまうので、他のカラム名に変更したい場合は 第二引数を指定して、オーバーライドしてあげる。 主キーについても、「id」となっているので、第三引数で指定する。 public function phone() { return $this->hasOne('App\Phone', 'hoge', 'hogehoge'); } リレーションが定義できたらEloquentの動的プロパティを使い、phoneモデルのレコードを取得できる。 $phone = User::find(1)->phone; また、動的プロパティだけではなく、リレーションメソッドを返すことも可能である。 HasOne オブジェクトなどの Eloquent リレーションオブジェクトはクエリビルダとしても動作するので 便利。 $phone = User::find(1)->phone()->where('name', 'Iphone'); 逆の関係 PhoneモデルからUserモデルへアクセスするためのリレーションを定義していく。今度は、belongsToメソッドを使っていく。 <?php namespace App; use Illuminate\Database\Eloquent\Model; class Phone extends Model { public function user() { return $this->belongsTo('App\User'); //第一引数にモデル名 } } hasOneメソッド同様に、外部キーは自動で「親モデル_id」と指定されてしまうので、他のカラム名に 変更したい場合は第二引数を指定し、主キーについても、「id」となっているので、第三引数で指定する。 1対多 続いて、1対多のケース。アマゾンなどのショッピングサイトのように一つの商品(productモデル)に対して、 複数のレビュー(reviewモデル)があるような状態である。 まずは親モデル(productモデル)から子モデル(reviewモデル)へのリレーションを定義する。 <?php namespace App; use Illuminate\Database\Eloquent\Model; class Product extends Model { public function reviews() { return $this->hasMany('App\Review'); } } 引数については1対1の時と同様である。必要であればオーバーライドする。 リレーション先へのアクセス方法も動的プロパティ、クエリビルダそれぞれで アクセス可能である。 逆の関係 1対多の逆の関係、子モデル(reviewモデル)から親モデル(productモデル)へのリレーションを定義する際は、 1対1の時と同様にbelongsToメソッドを用いる。引数の考え方も同様。 <?php namespace App; use Illuminate\Database\Eloquent\Model; class Review extends Model { public function product() { return $this->belongsTo('App\Product'); } } 多対多 多対多の例として、ユーザー(user)と趣味(hoby)をあげる。 1人のユーザに対して、趣味はスポーツ、映画、料理など複数ある。 また、その逆で、1つの趣味、例えばスポーツが趣味の人は複数人いる 場合が、この多対多の関係にあたる。 また、多対多の場合は、リレーションを定義する2つのテーブル意外に、その両方をつなぐ 中間テーブルを作成する必要がある、 以下、作成テーブル例である。 users id name 1 nobita 2 suneo 3 sizuka 4 doraemon 5 takeshi hobies id category 1 sports 2 cooking 3 movie 4 reading 5 shopping hoby_user(アルファベット順にする) user_id hoby_id 1 2 2 1 3 3 3 5 まずは、usersテーブルからhobiesテーブルへアクセスするためにリレーションを定義していく。 belongsToManyメソッドを用いる。 <?php namespace App; use Illuminate\Database\Eloquent\Model; class User extends Model { public function hobies() { return $this->belongsToMany('App\Hoby', 'hoby_user', 'user_id', 'hoby_id'); } } 第一引数： クラス名 第二引数： 結合テーブル名(中間テーブル) 第三引数： リレーションを定義しているモデルの外部キー名 第四引数： 結合するモデルの外部キー名 逆の関係 逆の関係も同様にbelongsToManyメソッドを用いる。 <?php namespace App; use Illuminate\Database\Eloquent\Model; class Hoby extends Model { public function users() { return $this->belongsToMany('App\User'); } } 終わりに 今回はリレーションを定義する上で、基本的な4パターンを紹介しました。以下、3パターンについては まだ習得できていないので、またの機会とさせていただきます。 中間テーブルについても、もう少し詳しくかければいいと思います。 - Has Many Through - ポリモーフィックリレーション - ポリモーフィック関係の多対多 参考サイト https://readouble.com/laravel/5.5/ja/eloquent-relationships.html#many-to-many