四：實(shí)現(xiàn)用戶(hù)注冊(cè)，驗(yàn)證，登錄

原文出處：https://jellybool.com/post/programming-with-yii2-integrating-user-registration

本來(lái)打算昨晚寫(xiě)的這篇教程，但是忙著約會(huì)去了，所以現(xiàn)在補(bǔ)上吧。

上一篇寫(xiě)了一點(diǎn)點(diǎn)Yii2的數(shù)據(jù)庫(kù)相關(guān)知識(shí)和強(qiáng)大的Gii，這一篇就如上一篇的最后所說(shuō)的一樣：在Yii2中實(shí)現(xiàn)用戶(hù)的注冊(cè)和登錄。

你可以直接到Github下載源碼，以便可以跟上進(jìn)度，你也可以重頭開(kāi)始，一步一步按照這個(gè)教程來(lái)做。本期的用戶(hù)注冊(cè)和登錄，我會(huì)使用一個(gè)很棒的composer package ：dektrium/yii2-user，下面就開(kāi)始我們的故事吧。

用戶(hù)的注冊(cè)和登錄

在現(xiàn)在的Web應(yīng)用中，幾乎每一個(gè)應(yīng)用都會(huì)需要用戶(hù)注冊(cè)，不管是使用的第三方還是自建的注冊(cè)登錄系統(tǒng)，我們都需要通過(guò)某些表單來(lái)收集一些必要的用戶(hù)數(shù)據(jù)。這些功能在Yii2之中實(shí)現(xiàn)起來(lái)并不難，而且有很多種方法，好像很多方法都是比較直接，簡(jiǎn)單粗暴。這可能是很多人喜歡Yii的原因，就像很多人喜歡PHP一樣，就是簡(jiǎn)單粗暴！

其實(shí)在Yii2中，它本身就自帶了一個(gè)登錄的實(shí)現(xiàn):

但是我們重復(fù)去制造這個(gè)輪子是因?yàn)槲覀冃枰恍└訉?shí)用性的改善，比如：在注冊(cè)的時(shí)候，發(fā)送驗(yàn)證郵箱。這幾乎是每一個(gè)Web應(yīng)用在注冊(cè)的時(shí)候都會(huì)考慮的內(nèi)容。

如果你安裝的是Yii2 Advanced Application Template，那么Yii2其實(shí)就把這些功能都寫(xiě)好了，而且你還會(huì)有一個(gè)后臺(tái)管理的模塊。但是我們的教程是基于Yii2's Basic Application Template，而且我提倡大家來(lái)動(dòng)手造一下這個(gè)輪子。

帶上我們的作案工具，我們要來(lái)造輪子了。

安裝Yii2-User

我們這里的Yii2-User安裝步驟參照Yii2-User的官方安裝文檔。我們直接使用composer來(lái)進(jìn)行安裝：

composer require "dektrium/yii2-user:0.9.*@dev"

稍微等待一下，安裝完畢之后就可以進(jìn)行對(duì)應(yīng)的配置了，我們需要配置的文件是config/web.php，找到components，然后在與它同級(jí)的位置增加一個(gè)modules：

'components' => [
        // other settings...
    ],
'modules' => [
        'user' => [
            'class' => 'dektrium\user\Module',
            'confirmWithin' => 21600,
            'cost' => 12,
            'admins' => ['admin']
        ],
    ],

這里還需要將components下面的user部分注釋掉，不然就會(huì)一直登錄不了：

 /* 'user' => [
            'identityClass' => 'app\models\User',
            'enableAutoLogin' => true,
        ],*/

還有最后一步就是執(zhí)行Yii2-User的migration了，在helloYii/目錄下執(zhí)行：

php yii migrate/up --migrationPath=@vendor/dektrium/yii2-user/migrations

然后你會(huì)看到：

果斷yes

Bang，到這里Yii2-User安裝和配置已經(jīng)完成了。

配置SwiftMailer

安裝完Yii2-User之后我們先不急著去想怎么實(shí)現(xiàn)登錄和注冊(cè)(其實(shí)很是比較簡(jiǎn)單的)，我們之前說(shuō)過(guò)的目標(biāo)是實(shí)現(xiàn)用戶(hù)在注冊(cè)時(shí)候發(fā)送驗(yàn)證郵件的，這里我們先來(lái)配置一下我們的郵箱服務(wù)，因?yàn)閅ii2-User可以直接使用郵箱來(lái)進(jìn)行注冊(cè)驗(yàn)證和密碼找回等功能。在config/web.php找到mailer這個(gè)部分：

'mailer' => [
    'class' => 'yii\swiftmailer\Mailer',
    // send all mails to a file by default. You have to set
    // 'useFileTransport' to false and configure a transport
    // for the mailer to send real emails.
    'useFileTransport' => true,
],

修改成我們下面的這個(gè)樣子：

'mailer' => [
        'class' => 'yii\swiftmailer\Mailer',
        'viewPath' => '@app/mailer',
        'useFileTransport' => false,
        'transport' => [
            'class' => 'Swift_SmtpTransport',
            'host' => 'smtp.live.com',
            'username' => 'jellybool@outlook.com',
            'password' => 'your-password',
            'port' => '587',
            'encryption' => 'tls',
            ],
    ],

這里由于我經(jīng)常使用的是outlook，不要覺(jué)得我是奇葩。所以我在這里使用的是outlook的SMTP配置，各位可以根據(jù)自己的需要來(lái)進(jìn)行相應(yīng)的修改。

開(kāi)始使用Yii2-User

郵箱配置好了之后，我們就可以開(kāi)始使用Yii2-User了，首先我們來(lái)修改一下我們的導(dǎo)航欄，因?yàn)槲覀兿雽?shí)現(xiàn)的就是我們常?？吹降脑趯?dǎo)航欄的右側(cè)的注冊(cè)和登錄按鈕。在/views/layouts/main.php找到：

echo Nav::widget([
            'options' => ['class' => 'navbar-nav navbar-right'],
            'items' => [
                ['label' => 'Home', 'url' => ['/site/index']],
                [
                    'label' => 'Status',
                    'items' => [
                        ['label' => 'View', 'url' => ['/status/index']],
                        ['label' => 'Create', 'url' => ['/status/create']],
                    ],
                ],
                ['label' => 'About', 'url' => ['/site/about']],
                ['label' => 'Contact', 'url' => ['/site/contact']],
                Yii::$app->user->isGuest ?
                    ['label' => 'Login', 'url' => ['/site/login']] :
                    ['label' => 'Logout (' . Yii::$app->user->identity->username . ')',
                        'url' => ['/site/logout'],
                        'linkOptions' => ['data-method' => 'post']],
            ],
        ]);

上面的啟示就是我們?cè)谏弦黄恼滦薷倪^(guò)后的導(dǎo)航欄的代碼，然后用下面的代碼進(jìn)行替換：

$navItems=[
    ['label' => 'Home', 'url' => ['/site/index']],
    ['label' => 'Status', 'url' => ['/status/index']],
    ['label' => 'About', 'url' => ['/site/about']],
    ['label' => 'Contact', 'url' => ['/site/contact']]
  ];
  if (Yii::$app->user->isGuest) {
    array_push($navItems,['label' => 'Sign In', 'url' => ['/user/login']],['label' => 'Sign Up', 'url' => ['/user/register']]);
  } else {
    array_push($navItems,['label' => 'Logout (' . Yii::$app->user->identity->username . ')',
        'url' => ['/site/logout'],
        'linkOptions' => ['data-method' => 'post']]
    );
  }
echo Nav::widget([
    'options' => ['class' => 'navbar-nav navbar-right'],
    'items' => $navItems,
]);

修改完成之后，我們直接訪(fǎng)問(wèn)：http://localhost:8999/user/register，你將會(huì)看到下面的類(lèi)似頁(yè)面：

有沒(méi)有覺(jué)得很神奇？沒(méi)錯(cuò)Yii2-User幫我們都全部寫(xiě)好了！然后我們輸入相應(yīng)的信息點(diǎn)擊注冊(cè)，之后就會(huì)看到這個(gè)信息提示頁(yè)面：

提示新說(shuō)表明驗(yàn)證郵箱已經(jīng)發(fā)送，我們登錄qq郵箱去看看，果然：

看到這個(gè)，相信大家都會(huì)很開(kāi)心，有圖有真相。直接點(diǎn)擊郵件的驗(yàn)證鏈接，然后就會(huì)看到Y(jié)ii2-User給我們反饋的驗(yàn)證成功的信息：

注意右上角，這個(gè)時(shí)候我們已經(jīng)登錄到應(yīng)用了，如果點(diǎn)擊Logout就會(huì)回到登錄頁(yè)面：

到這里，注冊(cè)登錄整個(gè)流程就實(shí)現(xiàn)完了，不過(guò)還有一個(gè)我們?nèi)粘ｉ_(kāi)發(fā)經(jīng)常遇到的情況：忘記密碼。嗯，對(duì)于這個(gè)情況，Yii2-User直接就提供了這個(gè)功能！你可以直接訪(fǎng)問(wèn)：http://localhost:8999/user/forgot?就可以看到了：

嗯，就這樣，很簡(jiǎn)單吧。借助Yii2-User這個(gè)強(qiáng)大的composer package，我們可以輕松實(shí)現(xiàn)用戶(hù)注冊(cè)，登錄和忘記密碼等各個(gè)功能。當(dāng)然，Yii2-User還有很多特性，我們這里只是用到了很小一部分，你可以直接到文檔中查看：

https://github.com/dektrium/yii2-user/blob/master/docs/README.md

最后希望這一篇文章可以幫你解決一些問(wèn)題。下一步我肯能會(huì)說(shuō)一下用戶(hù)權(quán)限控制和管理，因?yàn)檫@里實(shí)現(xiàn)的用戶(hù)注冊(cè)，所以下一篇顯得是自然而然的。