透過 Git 控管程式碼
雖然時光無法倒流,不過使用 Git 可以記錄你的程式碼更動,在需要的時候回復到先前某一個區段。在 commit 時寫下當次更動的摘要,我可以追蹤程式碼的修改歷程,在多人協做的情況下也可讓其他人瞭解我的開發思維。
Git 操作基本上是透過終端機指令完成,Windows 與 masOS(Linux X-Window 應該也有)平台有應用程式以圖形化介面協助 Git 作業。在之前的工作偶然知道 Sourcetree 這款圖形化 Git 管理程式,也因此認識 Bitbucket 服務,註冊服務後存放沒有公開的專案。
在撰寫此文的當下,Bitbucket 的免費服務方案下沒有限制私有專案的數量;GitHub 的免費方案有私有方案的數量限制,公開方案則無。
我的想法是先以私有專案建置專案,內容發佈到 Bitbucket 管理,等到完成後存一份複本,將複本中不便公開的部分以及 Git 記錄刪除,修改 README.md 後以公開專案發佈到 GitHub。如果有更好的作法請透過底下的回應系統或我的聯絡資訊告訴我,不勝感激。
將專案部署到網站主機
目前使用的網站主機是 Digital Ocean 的 VPS 服務,2GB Ram+1 vCPU+50GB 存儲的主機規格,一個月支出約新台幣 300 左右,與臺灣共享式虛擬主機的年費相比稍貴一些,但是效能部分差很多,還有固定 IP。
我安裝 aaPanel(寶塔面板的國際化版本)作為主機管理工具,選擇的原因有二:
- 能依照網站的需求以不同 PHP 版本執行:舉例來說 Joomla! 3 系列因為擴充套件相容性問題通常建議使用 PHP 7.4;Joomla! 3.10 及 Joomla! 4 全新網站可在 PHP 8 下運作,之後推出的 Laravel 9 框架預設就是 PHP 8.0。
- 可以透過操作頁面向 Let's Encrypt 申請免費安全憑證以及自動續約,不過要注意的是 Let's Encrypt 有域名申請時間鎖,如果因為測試網站而重複申請、刪除安全憑證超過 5 次以上,該域名的申請將會駁回,等待 168 小時(整整七日)後解除。
將本地測試的網站內容轉移到網站主機空間,一般是透過 FTP 上傳網站資料(PHP 程式、CSS 樣式檔、JavaScript 腳本檔,圖片檔案等等),資料庫部分則是先匯出成 SQL 檔案(僅匯出資料,不含結構)後再匯入到網站資料庫。不過 Laravel 專案結構複雜檔案眾多,如果用 FTP 程式上傳網站資料,傳輸時間會非常長。
現在程式碼由 Git 控管,Bitbucket 或 GitHub 託管遠端資源庫,網站的遷移作業能以更輕鬆的方式進行。
以下是 larablog 部署到網站主機的流程,給同樣是 Laravel 的新手朋友提供參考:
- 網站主機部分完成 DNS 指定、網頁根目錄位置及建立專案使用的資料庫,取得以下連線資訊:
- 網頁部分:連線主機名(或 IP 位址)、FTP 連線帳號、FTP 連線密碼。
- 資料庫部分:資料庫主機名、資料庫名稱、資料庫連線帳號、資料庫連線密碼。
- 以終端機程式登入網站主機,在網頁根目錄下用 git 指令複製專案內容:
git clone 遠端主機 git 網址
執行後會在網頁根目錄產生與專案名相同的資料夾(如:larablog),利用 FTP 軟體(如:FileZilla)或網站主機管理介面的網頁版檔案總管,將該資料夾內所有檔案/資料夾移動至上一層:網頁根目錄下。
- 使用 composer 安裝套件,此動作會新增
vendor
資料夾,存放專案所使用的套件:
composer install
- 如果專案有安裝 Voyager,或是有執行
php artisan storage:link
指令在public
資料夾建立storage
軟連結,那麼網站主機部分也需再執行一次,接著透過 FTP 軟體將檔案上傳到/storage/app/public
目錄下。 - 更動網站設定檔:Web 伺服器的網頁根目錄路徑設定要加上
public
,如果是 Nginx 請加入以下的轉寫規則:
location / {
try_files $uri $uri/ /index.php?$query_string;
}
- 為網站申請及安裝安全憑證(安全憑證透過 Let's Encrypt 申請或購買),確認連線方式是否自動轉為 HTTPS 連線。
- 從
.env.example
複製或更名為.env
,APP_URL
更改為網站網址(FDQN 格式);APP_ENV
設為 production;APP_DEBUG
改為 false 關閉偵錯模式。 - 在
.env
填入資料庫連線資訊,以及聯繫外部網路服務所需的連線資料:如 GMail 帳號、hCAPTCHA 金鑰、Algolia APP ID 等等。 - 重新產生專案連線金鑰:
php artisan key:genreate
- 執行以下指令建立資料表:
php artisan migrate
- 透過 phpMyAdmin 或其他資料庫工具程式,將資料庫內容匯入資料表:不含結構的純資料,並在匯入前確認已取消外鍵檢查。
- 確認上述作業將運作常用功能快取化:
php artisan route:cache
php artisan view:cache
php artisan config:cache
- 確認專案的目錄及檔案所有人及群組都是 Web Server。以 Ubuntu Server 環境,Web Server 是 Nginx 的情況輸入指令:
chown -R www:www (專案網站)
- 之後的更新作業依據類型透過以下方式完成:
- 程式碼更新:
git pull
,輸入存取密碼更新。 - 新增套件:
composer install
- 資料表更動:
php artisan migrate
- 如果發生像是頁面找不到或是樣式無法套用等異常狀況時,請先透過以下指令清除快取:
php artisan route:clear
php artisan view:clear
php artisan config:clear
以 aaPanel 建置網站主機管理介面時的注意事項
如果你也打算使用 aaPanel 管理 Laravel 專案網站,有兩個設定需要注意:
- 網站設定:點選左方選單「Website」項目,接著點選 Laravel 專案網站項目右方「Operation - Conf」項目,在「Site directory」分頁中取消「Anti-XSS attack (Base directory limit)(open_basedir)」勾選。
- PHP 設定:在「PHP Manage」部分「Disable functions」分頁找到「proc_open」、putenv」、「symlink」、「readlink」項目後點選右方的「Del」項目刪除停用選項。
使用套件建立與更新網站地圖
為了讓搜尋引擎(如 Google)更容易索引網站內容提高搜尋結果順位,我需要產生網站地圖(Sitemap)檔案,在 Google Search Console 提交。網站地圖可以透過線上服務建立,不過透過套件的輔助可以設定自動更新。
下載 laravel-sitemap 套件:
composer require spatie/laravel-sitemap
在 Controller 引入命名空間及撰寫程式碼:
use Spatie\Sitemap\SitemapGenerator;
public function createSitemap()
{
SitemapGenerator::create('https://larablog.abokuo.com')->writeToFile(public_path('sitemap.xml'));
}
新增網站路由:
// /routes/web.php
Route::get('/utilities/createsitemap','SiteController@createSitemap');
這樣在瀏覽器網址後面加上「utilities/createsitemap」就能產生網站地圖檔案: /public/sitemap.xml
,接著在 Google Search Console 就能輸入網站地圖路徑提交。
自動更新網站地圖
建立 artisan 命令:
php artisan make:command GenerateSitemap
會產生 /app/Console/Commands/GenrateSitemap.php
檔案,接著編輯如下:
<?php
namespace App\Console\Commands;
use Illuminate\Console\Command;
use Spatie\Sitemap\SitemapGenerator;
class GenerateSitemap extends Command
{
/**
* The name and signature of the console command.
*
* @var string
*/
protected $signature = 'sitemap:generate';
/**
* The console command description.
*
* @var string
*/
protected $description = '生成 sitemap 檔案';
/**
* Create a new command instance.
*
* @return void
*/
public function __construct()
{
parent::__construct();
}
/**
* Execute the console command.
*
* @return int
*/
public function handle()
{
SitemapGenerator::create(env('APP_URL'))->writeToFile(public_path('sitemap.xml'));
}
}
然後就可以透過以下指令建立網站地圖
php artisan sitemap:generate
編輯 /app/Console/Kernel.php
,設定每日排程更新網站地圖:
protected function schedule(Schedule $schedule)
{
$schedule->command('sitemap:generate')->daily();
}
免費視覺主題與網站地圖
網站地圖提交給 Google 之後幾天我仍然無法搜尋到 larablog,回到管理頁面發現:網站地圖記載的節點只有一筆,最少也會有十幾個吧?仔細尋找過後,在負責主版的 Blade template 檔案:/resources/views/layouts/master.blade.php
找到了以下敘述:
<meta name="robots" content="index, nofollow" />
這是告訴爬蟲程式:索引這一頁就好,接下來的不用。
以佈景主題範例來說這樣的設定有其必要:僅為範例,如果設定 follow 屬性會讓程式繼續往下追,得到一對無用的連結或範例資料反倒減損 SEO 效果。
但是現在是上線運作的網站,自然不能沿用這個設定。將該行敘述移除,重新建立網站地圖後,Google Search Console 就顯示索引了數十筆資料,問題解除。
index 與 follow 的意義與用法
就在問題解決後沒多久,我回過頭思考 index 與 follow 兩個 meta 屬性的意義:index 是告訴程式要索引;follow 是告訴程式內容中的連結納入評比。納入搜尋引擎所以可以增加網站曝光度,不過某些功能操作反倒是不要被搜尋到比較好。
基於上述思考我依網站頁面的屬性規劃四種索引策略:
- index, follow:網站首頁、文章頁面、分類顯示...等需要搜尋引擎納入索引的頁面。
- noindex, follow:服務條款、隱私權等網站必備文件頁面,搜尋引擎毋須索引。
- index, nofollow:單獨的評論頁面或留言板,讓搜尋引擎知道有此功能但毋須追蹤連結。
這裡提到的 nofollow 參數在最近有所變動,Google 的建議是付費連結改用
rel="sponsored"
;會員產出的內容(留言板、討論區等)改成rel="ugc"
。
- noindex, nofollow:管理區登入頁面、會員登入頁面、購物車、會員資料編輯等與使用者隱私有關的頁面。
主版 Blade template 檔案對於 meta robots 的行為則更動成:
<meta name="robots" content="@yield('index_rule')" />
由之後的 Blade template 依顯示內容決定使用哪種策略。