Mr. W 電腦村莊

 前言 

最近正在整理形象網站的後台技術，我想說在登入頁面加上「機器人驗證」。

常見的機器人驗證有 2 家廠商：Google reCAPTCHA 以及 Cloudflare Turnstile

這 2 間的技術我都沒寫過，所以我打算來踩雷一下，就先用 Google reCAPTCHA 試水溫。

說到 Google reCAPTCHA，它有分 v3 和 v2，以前的 v2 版本就是「圖形驗證」。

不過我自己還蠻討厭狂按圖形的，因為還要動腦解謎題，實在有夠煩。

網路上面好像都是 v2 版本的教學居多，這次我就寫看看 v3 版本！

前端、後端我都會寫範例 Code，總共拆成 2 篇文章。

 使用情境 

1. 你想要保護網站，阻擋機器人的惡意嘗試。

2. 你希望從 v2 版本轉換至 v3 版本。

 註冊 reCAPTCHA 

先進入 Google reCAPTCHA 的官網，下方有簡單的介紹和影片。

影片講解蠻清楚的，有時間的話可以看看。

看完就點擊「開始使用」。

 前言 

這次要來聊網頁開發當中常見的名詞：JSON (JavaScript Object Notation) 格式

JSON 就是由 JavaScript 語法所組成的資料交換格式，可以在前、後端進行資料的傳遞。

但這不是說，JSON 只能在 JavaScript 這個程式語言使用，

像是 ASP.NET (C#) 也有辦法解析 JSON 格式。 

如果能夠了解 JSON 格式的組成，以後將資料進行傳遞時，就比較能夠上手！

現在我就來整理 JSON 的常見用法～

貼心提醒：如果圖片看不清楚，可以點開看大圖喔～

 什麼是 JSON 

我在 JSON 的學習上，大部分都是參考 MDN 的官方文件。

我個人是蠻推薦閱讀的，因為官網寫得很清楚！

1. JSON 全名是 JavaScript Object Notation，是一種在網路上很常見的

「資料交換格式」。

就像剛才我有提到「網頁前後端」使用 RESTful API 傳遞資料，

 前言 

今天來跟各位聊一個前端開發的工具，它叫做「PageSpeed Insights」。

就如同它字面上的意思，能夠幫你提升 (優化) 網站的載入速度。

一般來說，我覺得任何網站開發完成後，都要跑一下這個工具！

為什麼我會這樣說：因為有時候是「取決於客戶」要不要跑～

阿我本人是比較囉嗦一點，就算客戶說不用跑，我還是會給它偷跑一下。

這篇文章主要放在「工具」的教學，至於「優化技巧」要等我熟一點，才能分享給大家瞧瞧。

示範的網站只有用 HTML、CSS、BootStrap 進行設計，

對於前、後端的開發人員應該都可以輕鬆上手！

貼心提醒：如果圖片看不清楚，可以點開看大圖喔～

 前言 

我前幾個月幫老師在 Cloudflare Page 架了一個靜態網頁，結果 Google 一直檢索不到...

該加的 robots.txt 也弄了，以前在 GitHub Page 架網站也沒遇到這個問題。

後來我參考 Google 官方建議，手動通知 Google Search Console 檢索網站。

我自認應該是 SEO 做得不好，所以才沒被檢索到吧？

這次我採用 meta 標籤的 Google Site Verification 加到網站首頁的 HTML。

以下是小弟實作的流程，歡迎大家多多支持～

 實際操作 

我建議可以先判斷，Google 到底有沒有檢索到你的網頁？

你可以在 Google 搜尋框輸入「site:你的網站首頁」

如下圖，Google 告訴我「找不到」，那就是沒被檢索到。

繼續往下做，你先登入 Google 帳號，準備綁定 GSC。

進入到 GSC，在「網址前置字元」輸入你的網址，記得點「繼續」。