cockpit-tools 通用帳號管理工具 codex,claude code,Antigravity
為了方便切換 AI 所使用的帳號 這個工具 可以考慮使用
Cockpit Tools
Easy is power
cockpit-tools 通用帳號管理工具 codex,claude code,Antigravity
為了方便切換 AI 所使用的帳號 這個工具 可以考慮使用
Cockpit Tools
loading="eager"、fetchpriority="high" 與 preload 是什麼?如果你使用 Google PageSpeed Insights 檢測網站,可能會看到建議:
為 LCP 圖片使用
loading="eager"、fetchpriority="high",並在<head>加入preload。
這些設定的目的只有一個:讓首頁最重要的圖片更快顯示,提高網站效能。 閱讀全文〈網站圖片載入優化:loading=”eager”、fetchpriority=”high” 與 preload 是什麼?〉
串接前準備清單
開始設定前,確認以下四項到位:
OpenClaw 已安裝運行
1. 版本建議 2026.3.9 以上,跑
openclaw doctor
確認狀態正常
2. LINE Developers 帳號 https://developers.line.biz/console/
到 developers.line.biz 註冊,用既有的 LINE 帳號即可
3. LINE 官方帳號 https://manager.line.biz/
在 LINE Official Account Manager 建立,免費方案即可開始測試
4. 公開 HTTPS 端點
開發環境用 ngrok,正式環境用 Cloudflare Tunnel 或反向代理
五步驟完成串接
第一步:安裝 LINE Plugin
openclaw plugins install @openclaw/line
如果你是用 Git clone 的方式跑 OpenClaw,改用本地安裝:
openclaw plugins install ./extensions/line
第二步:在 LINE Developers 建立 Messaging API Channel
登入 LINE Developers Console(developers.line.biz/console),選擇或建立一個 Provider,然後新增 Messaging API Channel。這裡你需要拿到兩個東西:Channel Access Token 和 Channel Secret。Access Token 在 Channel 設定頁面最下方可以 Issue 一個長效版本。
第三步:設定 Webhook URL
在 LINE Developers 的 Messaging API 設定頁面,打開「Use webhook」,把 Webhook URL 設成:
https://你的域名/line/webhook
安全建議 不要走預設 18789 port
3-1 使用 Cloudflare Tunnel :
官方下載頁在這裡: Cloudflare Tunnel / cloudflared Downloads
如果你是 Windows,最簡單是開 PowerShell 執行:
winget install --id Cloudflare.cloudflared
單次型:
最簡單用法是:先讓你的本機服務跑起來,然後用 cloudflared 把它公開出去。
假設你的網站在本機:
http://localhost:3000
可以執行:
cloudflared tunnel –url http://localhost:3000
它會產生一個像這樣的網址:
https://xxxx.trycloudflare.com
把這個網址給 webhook
把 Webhook URL 設成
https://xxxx.trycloudflare.com
,對方就能連到你本機的 localhost:3000 服務。
永久型: (綁domain)
https://dash.cloudflare.com/<你的帳號id>/one/networks/connectors
* 以系統管理員身分開啟命令提示字元。 執行下列命令:
cloudflared.exe service install <配對碼>
如果要把程式移除:
1.關閉連接器
https://dash.cloudflare.com/<你的帳號id>/one/networks/connectors
2.
winget uninstall Cloudflare.cloudflared
3-2 使用 ngrok :
下載 ngrok
打開官網
👉 https://ngrok.com/download
選擇:
👉 Windows (64-bit)(通常都是這個)
下載後會得到:
ngrok-v3-stable-windows-amd64.zip
開發測試階段用 ngrok 產生臨時 URL:
ngrok http 18789
把 ngrok 給的 HTTPS URL 加上
/line/webhook
路徑填進去。注意:ngrok 每次重啟 URL 會變,要重新更新。
正式環境建議用 Cloudflare Tunnel:穩定、有自訂域名、不用開防火牆 port。
第四步:寫入 OpenClaw 設定
最小設定如下:
{
"channels": {
"line": {
"enabled": true,
"channelAccessToken": "你的_LINE_CHANNEL_ACCESS_TOKEN",
"channelSecret": "你的_LINE_CHANNEL_SECRET",
"dmPolicy": "pairing"
}
}
}
也可以用環境變數:
export LINE_CHANNEL_ACCESS_TOKEN="..." export LINE_CHANNEL_SECRET="..."
或者用檔案方式存放(建議正式環境用這個,比較安全):
{ "channels": { "line": { "tokenFile": "/path/to/line-token.txt", "secretFile": "/path/to/line-secret.txt" } } }
第五步:完成配對驗證
OpenClaw 預設使用 pairing 模式。在 LINE 上加你的官方帳號為好友,傳任何訊息過去,Bot 會回覆一組六位數配對碼。回到終端機:
openclaw pairing list line openclaw pairing approve line <配對碼>
配對完成後,你就可以在 LINE 上跟 AI 代理人正常對話了。
記得關掉 LINE 官方帳號的內建自動回覆
這一步很多人會忘記。LINE 官方帳號預設有自動回覆訊息和加入好友歡迎訊息。如果不關掉,使用者會同時收到 LINE 內建的制式回覆和 OpenClaw 的 AI 回覆,體驗會很混亂。
到 LINE Official Account Manager → 設定 → 回應設定,把「自動回應訊息」和「加入好友的歡迎訊息」都關掉。
安全配置:上線前必做的六件事
OpenClaw 跟一般聊天機器人不同,它可以執行 shell 指令、讀寫檔案、控制瀏覽器。權限越大,風險越大。把它接上 LINE 等於開了一個外部可存取的入口,安全配置馬虎不得。
安全措施具體做法
最小權限原則
LINE 上的 AI 代理人只開放它需要的 Skill。客服用的 Bot 不需要檔案系統存取權
Token 定期輪換
每 90 天重新 Issue 一次 Channel Access Token,懷疑洩漏就馬上撤銷
不關閉 Webhook 簽章驗證
OpenClaw 預設啟用 HMAC 簽章驗證,這是確保請求真的來自 LINE 的機制
Gateway 不暴露到公網
只開 LINE Webhook 需要的路徑,其他管理介面走 Tailscale 或 SSH tunnel
定期稽核配對裝置
用
openclaw pairing list
檢查所有連線,移除不認識的
沙盒化執行
用 Docker 跑 OpenClaw,限制檔案系統和指令執行範圍
SlowMist(慢霧科技)在 GitHub 上發布了一份 OpenClaw 安全實踐指南,建議把
openclaw.json
設定檔用
chattr +i
鎖定防止被竄改,並設定每夜自動稽核的 Cron Job。
資料來源:
OpenClaw 的 LINE 串接
Source: OpenClaw 串接 LINE 完整教學:從 Messaging API 設定到企業級 AI 客服實戰
使用 Gemini Cli VibeCoding 做 Android APP (FTP為例) 配合 antigravity google nano banana2 做圖
首先 我要聲明 我沒開發過 android app 是第一次做 成果 遠超我的想像 非常完美
看來下一個殺入的市場 可能就是 APP開發 效果 實在驚人 這麼繁雜的工作量也可以完成
總開發時間: 3小時
使用模型 讓AI自行切換 我沒管
中間 過程 從如何開始 到 安裝什麼 怎樣安裝 全程問AI 遇到 bug 就把 bug 整段丟給他 要他幫我找問題 我再來排除
全程 0碼 畢竟我不熟 Android 怎開發
比較多問題的環節是 我FTP/防火牆 沒設定好 他還教我怎樣處理 如果是一般APP應該不用管 閱讀全文〈使用 Gemini Cli VibeCoding 做 Android APP開發 (FTP為例) 配合 antigravity google nano banana2 做圖〉
將 OpenClaw 結合 OpenAI codex 使用 Aouth 模型 GPT-5.2-codx
掛上 gws cli 與 自行開發的 FTP/DB/網頁設計 Skills 疊加使用
效果不錯 蠻驚奇的 把整個網站噴出來…在我還在發矇的時候…
成品: https://openclaw-web.98goto.com/
事後檢查:
後端有做 sql injection 防範 , 全程出錯較多 都是權限/防火牆未開
比較專業難處理的部分:
.env 把 要連線的帳密 放好 (流程感覺可以在改 但怕權限太大)
設定 google smtp 的 應用程式密碼
整體驚奇度 ★★★★☆
前端效果 ★★★☆☆
後端效果 ★★★☆☆
自動化 ★★★★★
自行製做的 skills 的部份 雖然我覺得比較像是mcp (概念有點模糊)
ftp-db-agent-skills:
https://github.com/good1515/ftp-db-agent-skills
# Step1 產生一組沒有加密的 2048 bits 私密金鑰(PK: Private Key) openssl genrsa -out server.key 2048 # Step2 產生憑證簽署請求(CSR: Certificate Signing Request) # /C=Country 國別 # /ST=State 州 # /L=Location 地區 # /O=Organization 組織 # /OU=Organizational Unit 組織部門單位 # /CN=Common Name 網域名稱 openssl req -sha512 -new -key server.key -out server.csr -subj "/C=TW/ST=Taipei/L=Taipei/O=example/OU=Personal/CN=www.example.com" # Step3 檢查 CSR,列出請求內部資料(可省略) openssl req -in server.csr -noout -text # Step4 建立自我簽署的憑證(Self-Sign Certificate) openssl x509 -sha512 -req -days 3650 -in server.csr -signkey server.key -out server.crt
資料來源: 如何建立 OpenSSL Self-Sign Certificate https://dev.twsiyuan.com/2016/01/self-sign-certificate.html
透過 OAuth 登入取得。
圖形 API 測試工具 https://developers.facebook.com/tools/explorer/
存取權杖偵錯工具 https://developers.facebook.com/tools/debug/accesstoken/
實現了 ftp 的 agent skills 讓AI開發完 自動化上傳到我經營的 虛擬主機
把頭疼的部屬問題解決了
效果不錯 就差個 openclaw 就能遠端直接用 line or tg 修改網站了 🤣 不過是權限給的有點略大了沒錯
openclaw 使用 ollama gpt-oss:20b 單機模型
設定方式 C:\Users\[使用者名稱]\.openclaw\openclaw.json 加入設定
這個 SwordSoft Mousetrack 使用的效果真的不錯 很適合錄影用
尤其在拉箭頭的時候 我都笑了 值得安裝
心血來潮 做一個需求收集 網站製作需求 的 互動小遊戲
確實感覺到 雖然不盡完美 但十分可怕的AI智能
google antigravity gemini3 好威猛阿.. 看來又要好好學習一番了
目前看起來並不會輸 gemini cli 裡面整合了版控 補足了 cli 的短版
給這個IDE評價 增高中…很期待下一版 版面語言的問題能在處理得更好 目前摸索功能有點苦手
#google #antigravity #gemini #小毛網站
微型網站架設選擇 Cloudflare Pages
在偶然的狀況下 測試了 Cloudflare Pages
用於架設不須資料庫的 微型網站 是可考慮的 但也有其缺點 像是無法使用FTP等
亮點:
1.有 gitHub 可以連接做版控
2.也可選擇檔案直接丟上來
3.可以設定自己的域名
4.有SSL
這是 測試的範例 freepagetest.98goto.com 後面再來使用AI(gemini cli) 來做個簡易界面試試
本次測試了使用 gemini cli 的 mcp 功能 來控制 chrome 瀏覽器 閱讀 與 debug 輸入 等功能 效果驚人
安裝需求:
node.js 22 up
google chrome
github:
https://github.com/ChromeDevTools/chrome-devtools-mcp
如何在匯出 google aistudio 實現 網站部屬
首先 可以在本地電腦 打開 cmd
然後切換到 下載檔案所在的 目錄
cd /d 所在目錄 npm install npm run build
使用 Gemini Cli 製作了一個 PHP 版本的 MCP AI Agent 功能是讀取 DB資料庫 分析使用者意圖 做出報告 使用的是 OpenAI 的 GPT-5-mini 模型
核心功能就是 讓 AI接管DB的查詢權限 由AI判斷 是否已達目標 未達就繼續收集資訊 最後在彙整成報告給使用者
當然是要做一些事前宣告會比較好 像是 產品在哪等等的 (雖然不宣告也行 但如果命名混亂 且非正規化資料庫 查詢的效果就會打折)
比較實用的可能用例:
統計有多少產品
今日是否有留言
今日營業額多少,是多少客人的消費
今日消費的客人,哪幾位有留言
換衣服/產品照/室內裝修/圖生影/換髮型/合照/貼圖產生器/音訊轉出文字/塗鴉板/故事書/照相館/婚紗照/產品行銷/圖片優化工具/品牌設計/網頁RWD效果
試玩版連結:
https://ai.studio/apps/4407980e-ad99-442e-a665-e2324a337897?fullscreenApplet=true
首先 把照片使用 gemini 做成T字模型 白底/綠底
提示詞:
請幫我獨立生一個模型 要白底的 不用底座 手T字分開 要準備改做成3D模型用的
然後打開 Tripo3D
Tripo3D : https://studio.tripo3d.ai/
生成3D模型 -> 圖像/文本 生成3D
即可得到真正的3D模型
然後可以在選擇 一鍵綁骨 就可以做出有動骨的 模型了
使用 5090 + Comfui Wan 2.2 動畫製作
製作重點:
解析度不要太大 建議在 600*600 以內 如果太大超出了 vram 容易造成 comfui 卡死不動
效果展示:
過程:
提示詞:
請幫我將最前面的模型動起來,變出演講桌、投影布幕,投影布幕顯示的是網站製作的方式
提示詞:
把我做成Q版卡通的手辦模型
模型背後應該有一個模型包裝盒,上面印著Q版卡通的角色。在包裝盒前面,用圓形塑膠底座放置我給你的Q版卡通手辦模型。我希望PVC材質能夠清晰地呈現出來,背景要室內。
提示詞:
使用 nano-banana 模型,以逼真的風格和環境,創建插畫中人物的1/7比例商業化手辦。將手辦放置在電腦桌上,使用圓形透明壓克力底座,底座上不帶任何文字。在電腦螢幕上,展示手辦的ZBrush建模流程。在電腦螢幕旁,放置一個印有原圖的BANDAl風格玩具包裝盒。
參考資料來源:
Facebook 社團分享的提示詞
用AI做的 瀏覽器插件外掛
使用 chatGPT 做的 chrome 外掛插件 功能是使用API KEY 來呼叫 chatGPT
原理相當類似 html + js 其實沒有想像中的困難 不過在 封裝/測試/部屬 是確實比較麻煩的部分 由其實版本編號 每次上線都要手動去調整+1 詳細可以查看相關的教學文章(之後再補)