本文适用于对 PHP 和 laravel 框架有一定了解并已经看完laravel入门视频:Laravel 5 Fundamentals 的初学者。本文内容主要讲解如何搭建一个有简单注册、登录、填写表单、生成文本、预览、发送邮件和展示的 web 应用。
视频作者的视频经常被非法上传的 youtube 上,想要向有关当局反映必需填写一个 DMCA 文件并附上源视频地址和非法上传的视频地址,还要表达一些诉求。为了方便起见,网站被设计成填写表单自动生成 DMCA 文件自动发送邮件。
如果还没看请先下载观看:
1.修改视图文件 index.blade.php 使得在没有创建通知单的时候页面能有提示告诉用户。
@extends('app') @section('content') <h1class="page-heading">YourNotices</h1> <tableclass="table table-striped table-bordered"> <thead> <th>This Content:</th> <th>AccessibleHere:</th> <th>Is InfringingUponMyWorkHere:</th> <th>NoticeSent:</th> <th>ContentRemoved:</th> </table> <tbody> @foreach ($noticesas $notice) <tr> <td>{{ $notice->infringing_title }}</td> <td>{!! link_to($notice->infringing_link) !!}</td> <td>{!! link_to($notice->original_link) !!}</td> <td>{{ $notice->created_at->diffForHumans() }}</td> <td> {!! Form::open() !!} <divclass="form-group"> {!! Form::checkbox('content_removed',$notice->content_removed,$notice->content_removed) !!} </div> {!! Form::close() !!} </td> </tr> @endforeach ($noticesas $notice) <tbody> @unless(count($notices)) <p class="text-center">Youhaven't sentanyDMCAnoticesyet!</p> @endunless@endsection
2.添加发送新通知单之后的反馈信息。此处作者使用了一个新的 package laracasts/flash ,使用命令 composer require laracasts/flash 进行安装。
首先在 config/app.php 中注册 'Laracasts\Flash\FlashServiceProvider';
然后在 controller 中编写相应代码实现提示信息。
<?phpnamespace App\Http\Controller; use ... class NoticesController extends Controller { public function __construct() { $this->middleware('auth');//注册一个中间件对所有方法进行验证 parent::__construct(); } public function index() { $notices = $this->user->notices()->latest()->get();//降次排序 notices return view('notices.index',compact('notices'))); } public function create() { // get list of providers $provider = Provider::list('name','id'); // load a view to create a new notice return view('notices.create',compact('providers')); } pubilcfunction confirm(PrepareNoticeRequest $request) { $template = $this->compileDmcaTemplate($data = $request->all()); session()->flash('dmca',$data); return view('notices.comfirm',compact('template'));//返回一个新视图页,检查填写的表单数据 } public function store() { $this->creaeNotice($request); Mail::queue(['text' => 'emails.dmca'],compact('notice'),function($message) use ($notice){ $message->from($notice->getOwnerEmail()) ->to($notice->getRecipientEmail()) ->subject('DMCA Notice'); }) flash('Your DMCA notice has been delivered!'); return redirect('notices'); } public function compileDmcaTemplate($data) { $data = $data + [ 'name' => $this->user->name, 'email' => $this->user->email, ];//为模版传入数据,拼接数据 return view()->file(app_path('Http/Templates/dmca.blade.php'),$data); } private function createNotice(Request $request) { $notice = session()->get('dmca') + ['template' => $request->input('template')]; $notice = $this->user->notices()->save($notice); return $notice; } }
最后在主界面 app.blade.php 中添加反馈展示区域。
<!DOCTYPEhtml><htmllang="en"><head> <metacharset="UTF-8"> <metahttp-equiv="X-UA-Compatible" content="IE=edge"> <metaname="viewport" content="with=device-width,initial-scale=1"> <title>DMCAApp</title> <linkrel="stylesheet" href="/css/app.css"></head><body> @include('flash::message') @include('partial.nav)//载入导航栏 @yield('content')//内容插入处 <scriptsrc="//cdjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <scriptsrc="//cdjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js"></script></body></html>
3.为 notices 表格中的 Content Removed 栏中的 checkbox 添加 submit 按钮,编写 update 方法将变化写入数据库。
<?phpnamespace App\Http\Controller; use ... class NoticesController extends Controller { public function __construct() { $this->middleware('auth');//注册一个中间件对所有方法进行验证 parent::__construct(); } public function index() { $notices = $this->user->notices()->latest()->get();//降次排序 notices return view('notices.index',compact('notices'))); } public function create() { // get list of providers $provider = Provider::list('name','id'); // load a view to create a new notice return view('notices.create',compact('providers')); } pubilcfunction confirm(PrepareNoticeRequest $request) { $template = $this->compileDmcaTemplate($data = $request->all()); session()->flash('dmca',$data); return view('notices.comfirm',compact('template'));//返回一个新视图页,检查填写的表单数据 } public function store() { $this->creaeNotice($request); Mail::queue(['text' => 'emails.dmca'],compact('notice'),function($message) use ($notice){ $message->from($notice->getOwnerEmail()) ->to($notice->getRecipientEmail()) ->subject('DMCA Notice'); }) flash('Your DMCA notice has been delivered!'); return redirect('notices'); } public function update($noticeId,) { $isRemoved = $request->has('content_removed'); Notice::findOrFail($noticeId) ->update(['content_removed' => $isRemoved]); return redirect()->back(); } public function compileDmcaTemplate($data) { $data = $data + [ 'name' => $this->user->name, 'email' => $this->user->email, ];//为模版传入数据,拼接数据 return view()->file(app_path('Http/Templates/dmca.blade.php'),$data); } private function createNotice(Request $request) { $notice = session()->get('dmca') + ['template' => $request->input('template')]; $notice = $this->user->notices()->save($notice); return $notice; } }
之后作者去掉 submit 键
4.使用 javascript 实现上述功能,此处简要展示代码。
为 app.blade.php 添加定制 javascript 代码
<!DOCTYPEhtml><htmllang="en"><head> <metacharset="UTF-8"> <metahttp-equiv="X-UA-Compatible" content="IE=edge"> <metaname="viewport" content="with=device-width,initial-scale=1"> <title>DMCAApp</title> <linkrel="stylesheet" href="/css/app.css"></head><body> @include('flash::message') @include('partial.nav)//载入导航栏 @yield('content')//内容插入处 <scriptsrc="//cdjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <scriptsrc="//cdjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js"></script> <scriptsrc="/js/all.js"></script></body></html>
修改 index.blade.php 添加异步通信、提示信息,去掉 submit 按钮。
@extends('app') @section('content') <h1class="page-heading">YourNotices</h1> <tableclass="table table-striped table-bordered"> <thead> <th>This Content:</th> <th>AccessibleHere:</th> <th>Is InfringingUponMyWorkHere:</th> <th>NoticeSent:</th> <th>ContentRemoved:</th> </table> <tbody> @foreach ($noticesas $notice) <tr> <td>{{ $notice->infringing_title }}</td> <td>{!! link_to($notice->infringing_link) !!}</td> <td>{!! link_to($notice->original_link) !!}</td> <td>{{ $notice->created_at->diffForHumans() }}</td> <td> {!! Form::open(['data-remote','method' => 'PATCH','url' => 'notices/'.$notice->id]) !!} <divclass="form-group"> {!! Form::checkbox('content_removed',$notice->content_removed,$notice->content_removed,['data-click-submits-form']) !!} </div> {!! Form::close() !!} </td> </tr> @endforeach ($noticesas $notice) <tbody> @unless(count($notices)) <p class="text-center">Youhaven't sentanyDMCAnoticesyet!</p> @endunless@endsection
laravel 框架展示出了优秀易读的特性,本文水平有限只做了简要介绍详情请继续学习相关 文档 ,和 视频 。