在 Laravel Sail 環境下完成 L01 教程第 5 遍的感想

Alcohol發表於2021-05-22
LaravelAI

4 月初購買了《L01 Laravel 教程 - Web 開發實戰入門》（下文簡稱：L01），到今天為止，斷斷續續，做了 5 遍。
一開始練習時，搭建環境就花了 3 天，才成功讓 Laravel 在電腦上跑起來。
詳情可以參考：《歷時 3 天，成功搭建 Laravel Sail 環境》
到現在，可以說對 Laravel 開發有一個基本的瞭解，但是距離課程提到過的挑戰： 嘗試使用文字將專案的功能寫個列表，然後在不看教程的情況下實現整個專案的功能 ，還有一段比較比較遠的距離。
所以，第 5 遍並不是終點，還要繼續做，繼續往下走，直到對每個功能的實現邏輯都心中有數。
然後，再來分享一下，我對這 L01 專案的魔改部分：關於頭像。
L01 專案是用 Gravatar 頭像作為解決方案的，但是這個網站在國外，被牆擋住了，導致在練習的時候，頭像一直無法顯示，有些同學還以為自己哪裡做錯了，其實，你並沒有做錯什麼，只是 Gravatar 讀取不到而已。
不過， http://cn.gravatar.org/avatar 這個連結是可以用，也能讀取到頭像的，可惜， 我不喜歡這個頭像 。
所以，這都第五次練習了，我對這個專案，也算有一定了解了，不如來魔改一下吧。
一開始，我用隨機產生的數字來代表指定對應頭像，結果發現一個弊端：
每次重新整理網頁，頭像都會變化，甚至同一個使用者 id 也會產生不同的頭像。
這多不好。
那不如，把指定頭像的資料，存到資料庫裡面吧？
思路瞬間開闊起來，以下是我的實現步驟：
準備工作： 

在 weibo\public 目錄下，建立 gravatar 資料夾

蒐集一些你喜歡的頭像，放到 gravatar 資料夾，頭像以數字命名，如下所示：

接下來，生成一個 遷移檔案 ，為使用者表新增 gravatar_id 欄位。

這是在 Laravel Sail 環境下的操作，Sail 命令已經經過簡單配置，關於配置部分請看文末參考資料。

sail artisan make:migration add_gravatar_id_to_users_table --table=users

最終，我編寫遷移檔案如下：
檔案位置：

database/migrations/[timestamp]_add_gravatar_id_to_users_table.php

檔案程式碼：

<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
class AddGravatarIdToUsersTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::table('users', function (Blueprint $table) {
            $table->string('gravatar_id')->default('1');
        });
    }
    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::table('users', function (Blueprint $table) {
            $table->dropColumn('gravatar_id');
        });
    }
}

編寫完成之後，進行資料庫遷移，執行遷移檔案：

sail artisan migrate

執行結果如下所示：

接著，更改使用者工廠檔案，從指定陣列裡面隨機獲取元素，作為 gravatar_id :
檔案位置：

database/factorise/UserFactory.php

檔案程式碼：

<?php
namespace Database\Factories;
use App\Models\User;
use Illuminate\Database\Eloquent\Factories\Factory;
use Illuminate\Support\Str;
class UserFactory extends Factory
{
    protected $model = User::class;
    public function definition()
    {
        return [
            'name' => $this->faker->name,
            'email' => $this->faker->unique()->safeEmail,
            'email_verified_at' => now(),
            'activated' => true,
            'password' => '$2y$10$92IXUNpkjO0rOQ5byMi.Ye4oKoEa3Ro9llC/.og/at2.uheWG/igi', // password
            'remember_token' => Str::random(10),
            'gravatar_id'    => $this->faker->randomElement(['1', '2', '3', '4', '5', '6', '7', '8', '9', '10']),
        ];
    }
}

其實，我只是新增了這一行：

'gravatar_id'    => $this->faker->randomElement(['1', '2', '3', '4', '5', '6', '7', '8', '9', '10']),

這個陣列的寫法非常不優雅，我知道，請大家不要罵得太厲害

然後，對資料庫進行重置，填充：

sail artisan migrate:refresh --seed

隨後，再到使用者模型裡，修改頭像方法的邏輯：
檔案位置：

app/Models/User.php

修改 L01專案 生成頭像的方法：

<?php
namespace App\Models;
use Illuminate\Contracts\Auth\MustVerifyEmail;
  .
  .
  .
class User extends Authenticatable
{
    .
    .
    .
    public function gravatar($size = 140)
    {
        $gravatar = $this->attributes['gravatar_id'];
        return "/gravatar/$gravatar.jpg";
    }
    .
    .
    .
}

至此，那我們生成的使用者就都可以隨機到頭像了。
效果如下：

那麼，新註冊的使用者怎麼辦呢 ？雖然 gravatar_id 欄位的預設值被設定為 1 ，但是新註冊的使用者，不能隨機到其他的頭像的話，上面這個半天搞出來的功能豈不是很雞肋？
在我一番百度+查詢社群內的 Laravel 中文文件之後，想到了一個辦法，利用輔助函式 Arr::random 從資料中隨即返回一個值。
以下是具體實現程式碼，我選擇在使用者啟用的同時，為他隨機一個頭像：

<?php
namespace App\Http\Controllers;
use App\Models\User;
.
.
.
use Illuminate\Support\Arr; // 注意引入 Arr
class UsersController extends Controller
{
    .
    .
    .
    public function confirmEmail($token)
    {
        $user = User::where('activation_token', $token)->firstOrFail();
        $user->activated = true;
        $user->activation_token = null;
        $array = range(1, 10);
        $user->gravatar_id = Arr::random($array);
        $user->save();
        Auth::login($user);
        session()->flash('success', '恭喜你，啟用成功 2021年5月20日 14:33:07');
        return redirect()->route('users.show', [$user]);
    }
    .
    .
    .
}

至此，我設想的功能已經完成。
以下是新註冊使用者的效果：

不行，我在最後一定要放一張隨機到結衣頭像的使用者：

以上，就是做完 5 次專案的感想，這個專案還沒摸透，還需要繼續練習。
如果社群的大家們有更好的方法，也可以提醒我，另外，很想問一下，學到什麼樣的程度能達到找工作的要求呢？
這是我目前最想弄清楚的問題。
參考資料：
關於使用 Laravel Sail 命令

本文完成於 2021年5月22日

本作品採用《CC 協議》，轉載必須註明作者和本文連結

相關文章