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月23日更新
折騰了一個早上,總算是把 L01 專案部署到阿里雲上了,算是交一次作業吧,因為沒有開啟 QQ 郵箱的功能,啟用郵件傳送暫時無法實現,在這裡給大家提供一個體驗賬號(隨機到了美女頭像哦):
體驗網址:hongliblog.cn/
體驗賬號
郵箱:Blcohol@example.com
密碼:Blcohol@example.com
大家可以發條留言,證明來過,但是不要改密碼,,也不要幹壞事哦
預計 7 天后(也就是2021年5月30日)關停伺服器~
本作品採用《CC 協議》,轉載必須註明作者和本文連結