实验楼的laravel 4.2 blog 教程(一)

#课程介绍

本教程将使用Laravel 4.2完成一个多用户的博客系统,大概会包含如下内容:

  • 路由管理。
  • 用户管理,如用户注册、修改信息、锁定用户等。
  • 文章管理,如发表文章、修改文章等。
  • 标签管理,文章会有一到多个标签。
  • 数据库管理,如迁移、填充数据等。
  • Web表单验证。
  • Blade模版引擎。
  • 分页处理。
  • 安全处理。
  • 单元测试。
  • 部署到应用服务器Apache。

# 环境要求:

- PHP 5.4+
- MySQL 5.1+
- Composer([中国镜像](http://pkg.phpcomposer.com/))

我的本地环境是wamp

安装composer

https://getcomposer.org/download/ 下载Composer-Setup.exe

安装的过程中有可能出现提示关闭文件管理器:可通过ctrl+alt+delete打开任务管理器、在detail结束explorer.exe进程、然后安装成功后在file=》new task新建explorer 即可


#1、新建项目

composer create-project laravel/laravel sylblog 4.2 --prefer-dist
#修改配置文件 app/config/app.php

debug为 true、timezone为RPC、locale为zh


#开启自带的服务器

php artisan serve

#打开浏览器 http://localhost:8000/ 显示laravel 的logo 页面即是成功


#2、安装插件 generator

在 composer.json 增加

"require-dev": {
    "way/generators": "~2.0"
},

#更新安装

composer update

#添加配置项

app/config/app.php的providers中增加

'Way\Generators\GeneratorsServiceProvider'

#查看

php artisan
即多了generate 选项


#3、建立数据库

把app/config/database.php中connections下的mysql改成你自己的配置
'mysql' => array(
    'driver'    => 'mysql',
    'host'      => 'localhost',
    'database'  => 'sylblog',
    'username'  => 'root',
    'password'  => '',
    'charset'   => 'utf8',
    'collation' => 'utf8_unicode_ci',
    'prefix'    => '',
),
#在数据库中创建数据库:sylblog ,编码为:utf8_unicode_ci

#创建数据迁移文件

php artisan migrate:make create_users_table --create=users


#添加刚创建的迁移文件中属性

app\database\migrations\*_create_users_table.php
Schema::create('users', function(Blueprint $table)
{
    $table->increments('id');
    $table->string('email');
    $table->string('password');
    $table->string('nickname');
    $table->boolean('is_admin')->default(0);
    $table->boolean('block')->default(0);
    $table->string('remember_token')->nullable();
    $table->timestamps();
});


#执行迁移

php artisan migrate
即在数据库中多了两张表users和migrations,users表就是我们定义的表,migrations表记录了迁移的信息。

#4、创建用户模型

#在已存在的app\models\User.php 添加属性

protected $fillable = array('email', 'password', 'nickname');


#5、填充数据

#在在app/database/seeds下创建一个名为UserTableSeeder.php的文件

class UserTableSeeder extends Seeder {
    public function run()
    {
        User::create([
            'email'    => 'admin@shiyanlou.com',
            'password' => Hash::make('12345678'),
            'nickname' => 'admin',
            'is_admin' => 1,
        ]);
    }
}


# 然后在DatabaseSeeder.php中增加:

$this->call('UserTableSeeder');


#执行填充

php artisan db:seed


#6、创建视图模板

php artisan generate:view _layouts.default
php artisan generate:view _layouts.nav
php artisan generate:view _layouts.footer
php artisan generate:view index


#修改 default.blade.php

<!DOCTYPE html>
<html>
<head lang="zh">
  <meta charset="UTF-8"/>
  <title>ShiYanLou Blog</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
  <meta name="viewport"
        content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <meta name="format-detection" content="telephone=no"/>
  <meta name="renderer" content="webkit"/>
  <meta http-equiv="Cache-Control" content="no-siteapp"/>
  <link rel="alternate icon" type="image/x-icon" href="{{ URL::asset('i/favicon.ico') }}"/>
  <link rel="stylesheet" href="http://labfile.oss.aliyuncs.com/amazeui/2.2.1/css/amazeui.min.css"/>
  {{ HTML::style('css/custom.css') }}
</head>
<body>
<header class="am-topbar am-topbar-fixed-top">
  <div class="am-container">
    <h1 class="am-topbar-brand">
      <a href="/">ShiYanLou Blog</a>
    </h1>
    @include('_layouts.nav')
  </div>
</header>

@yield('main')

@include('_layouts.footer')

<script src="http://labfile.oss.aliyuncs.com/jquery/2.1.3/jquery.min.js"></script>
<script src="http://labfile.oss.aliyuncs.com/amazeui/2.2.1/js/amazeui.min.js"></script>
</body>
</html>
URL::asset('i/favicon.icon') 、HTML::style('css/custom.css')、@include('_layouts.nav') 包含app/view/_layouts/nav.blade.php、$yield('main') 用户模板继承


#修改nav.blade.php

<button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-secondary am-show-sm-only"
        data-am-collapse="{target: '#collapse-head'}"><span class="am-sr-only">nav switch</span>
        <span class="am-icon-bars"></span></button>
<div class="am-collapse am-topbar-collapse" id="collapse-head">
  <div class="am-topbar-right">
    <a href="#" class="am-btn am-btn-primary am-topbar-btn am-btn-sm topbar-link-btn"><span class="am-icon-user"></span> Login</a>
  </div>
</div>

#修改footer.blade.php
<footer class="footer">
  <p>© 2015 By <a href="http://www.shiyanlou.com" target="_blank">www.shiyanlou.com</a></p>
</footer>


#修改index.blade.php

@extends('_layouts.default')

@section('main')
<div class="am-g am-g-fixed blog-g-fixed">
  <div class="am-u-sm-12">
      <h1>Welcome to ShiYanLou!</h1>
  </div>
</div>
@stop
@extends('_layouts.default') 继承 app/view/_layout/default.blade.php @yield('main')  对应 @section('main') 并填充为其中内容

#在public 下新建两个目录 i 和css 、在 i 方置 favicon.ico 图标、在css 中新建 custom.css 文件修改如下

.footer p {
  color: #7f8c8d;
  margin: 0;
  padding: 15px 0;
  text-align: center;
  background: #2d3e50;
}

.topbar-link-btn {
    color: #fff !important;
}


#7、修改路由访问首页

#在app/routes.php 修改

Route::get('/', function()
{
    return View::make('index');
});

#访问首页 :localhost:8000



#8、创建登陆视图

#在 nav.blade.php 修改登录链接

<a href="{{ URL::to('login') }}" class="am-btn am-btn-primary am-topbar-btn am-btn-sm topbar-link-btn"><span class="am-icon-user"></span> Login</a>
URL::to('login')

#修改 nav.blade.php 登陆链接

<a href="{{ URL::to('login') }}" class="am-btn am-btn-primary am-topbar-btn am-btn-sm topbar-link-btn"><span class="am-icon-user"></span> Login</a>

#创建登录模板 login.blade.php

php artisan generate:view login


#修改login.blade.php

@extends('_layouts.default')

@section('main')
  <div class="am-g am-g-fixed">
    <div class="am-u-lg-6 am-u-md-8">
      <br/>
      @if (Session::has('message'))
        <div class="am-alert am-alert-danger" data-am-alert>
          <p>{{ Session::get('message') }}</p>
        </div>
      @endif
      @if ($errors->has())
        <div class="am-alert am-alert-danger" data-am-alert>
          <p>{{ $errors->first() }}</p>
        </div>
      @endif
      {{ Form::open(array('url' => 'login', 'class' => 'am-form')) }}
        {{ Form::label('email', 'E-mail:') }}
        {{ Form::email('email', Input::old('email')) }}
        <br/>
        {{ Form::label('password', 'Password:') }}
        {{ Form::password('password') }}
        <br/>
        <label for="remember_me">
          <input id="remember_me" name="remember_me" type="checkbox" value="1">
          Remember Me
        </label>
        <br/>
        <div class="am-cf">
          {{ Form::submit('Login', array('class' => 'am-btn am-btn-primary am-btn-sm am-fl')) }}
        </div>
      {{ Form::close() }}
      <br/>
    </div>
  </div>
@stop

#Route.php添加登陆路由

Route::get('login', function()
{
    return View::make('login');
});

#访问:localhost:8000/login


#9、实现登陆

#创建登陆后个人主页

php artisan generate:view home

#修改模板 home.blade.php
@extends('_layouts.default')

@section('main')
<div class="am-g am-g-fixed blog-g-fixed">
  <div class="am-u-sm-12">
      <h1>Hello {{{ Auth::user()->nickname }}}</h1>
  </div>
</div>
@stop
{{{ }}} 对文字进行转义处理


#修改导航模板 nav.blade.php

<div class="am-collapse am-topbar-collapse" id="collapse-head">
  @if (Auth::check())
    <ul class="am-nav am-nav-pills am-topbar-nav am-topbar-right">
      <li class="am-dropdown" data-am-dropdown>
        <a class="am-dropdown-toggle" data-am-dropdown-toggle href="javascript:;">
          <span class="am-icon-users"></span> {{{ Auth::user()->nickname }}} <span class="am-icon-caret-down"></span>
        </a>
        <ul class="am-dropdown-content">
          <li><a href="{{ URL::to('logout') }}"><span class="am-icon-power-off"></span> Exit</a></li>
        </ul>
      </li>
    </ul>
  @else
    <div class="am-topbar-right">
      <a href="{{ URL::to('login') }}" class="am-btn am-btn-primary am-topbar-btn am-btn-sm topbar-link-btn"><span class="am-icon-user"></span> Login</a>
    </div>
  @endif
</div>

#在Routes.php 中添加提交登陆路由和个人主页路由

Route::post('login', array('before' => 'csrf', function()
{
    $rules = array(
        'email'       => 'required|email',
        'password'    => 'required|min:6',
        'remember_me' => 'boolean',
    );
    $validator = Validator::make(Input::all(), $rules);
    if ($validator->passes())
    {
        if (Auth::attempt(array(
            'email'    => Input::get('email'),
            'password' => Input::get('password'),
            'block'    => 0), (boolean) Input::get('remember_me')))
        {
            return Redirect::intended('home');
        } else {
            return Redirect::to('login')->withInput()->with('message', 'E-mail or password error');
        }
    } else {
        return Redirect::to('login')->withInput()->withErrors($validator);
    }
}));

Route::get('home', array('before' => 'auth', function()
{
    return View::make('home');
}));

这里我们使用了Laravel自带的身份验证Auth,你也可以使用更加强大的Sentry,Web表单验证用了Validator,View和Redirect详细可以查看视图和响应文档,还使用了路由过滤器,csrf过滤器可以使我们轻松地防御csrf攻击。这里我们使用了Laravel自带的身份验证Auth,你也可以使用更加强大的Sentry,Web表单验证用了Validator,View和Redirect详细可以查看视图和响应文档,还使用了路由过滤器,csrf过滤器可以使我们轻松地防御csrf攻击。

测试登陆:账户是:admin@shiyanlou.com 密码:12345678


#添加Route.php 退出登录

Route::get('logout', array('before' => 'auth', function()
{
    Auth::logout();
    return Redirect::to('/');
}));

至此简单的用户登录功能就完成了,你除了要完成上述的例子外,还要完成记住我的功能哦!你可以通过下面途径来完成:

代码下载:$ git clone http://git.shiyanlou.com/shiyanlou/laravel-blog-1


参照:https://www.shiyanlou.com/courses/document/394

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值