尚未偵測到更新。GitHub 發布版本後會顯示在這裡。
個人 GitHub 帳號下公開儲存庫的擁有者可以登入並驗證所有權,自行管理介紹,無需管理員核准。
登入並產生驗證檔案,在 30 分鐘內將其提交至此儲存庫的預設分支。其他分支或分叉儲存庫中的檔案無效。然後在下方檢查檔案,即可無需管理員核准直接管理專案。請保留檔案以維持管理權限。
如需登入,將前往登入頁面。登入後請回到此處,再次點擊所選的驗證按鈕。
在專案資料夾中執行 /nomorevibe verify,即可驗證所有權並自行管理介紹。
一分鐘完成驗證顯示鄰近 YouBike 站點即時車位與租借狀況的 PWA,支援定位、QR Code 分享與一鍵導航
翻譯準備中
取自儲存庫 README
正在載入完整 README。 以下為已儲存的摘錄。
顯示鄰近 YouBike 站點即時車位與租借狀況的網頁應用,支援定位、QR Code 分享與一鍵導航到 Google Maps。 • 📍 依目前位置自動列出全台最近的 3 個 YouBike 站點與距離 • 🚲 即時顯示可借車輛數、可還空位數,並分別列出一般車與電輔車數量 • 🎟️ 標示「友愛接力」站點(滿站借車或空站還車可獲得騎乘券) • 🔄 按下重新整理按鈕即可更新車輛與定位資訊 • 🧭 點站名或導航按鈕,一鍵在 Google Maps 開啟站點 • 📱 一鍵開啟 YouBike 官方 App • 📷 顯示 QR Code,方便分享網站給他人檢視完整 README ↗
顯示鄰近 YouBike 站點即時車位與租借狀況的網頁應用,支援定位、QR Code 分享與一鍵導航到 Google Maps。
線上版本:https://youbike-6n2.pages.dev/
functions/api/youbike.js)作為 API proxy,透過交通部運輸資料流通服務(TDX)取得全台各縣市公共自行車即時資料,並依距離排序需要一組免費的 TDX 帳號(申請方式見下方),並在專案根目錄建立 .dev.vars 放入金鑰:
TDX_CLIENT_ID=xxxx
TDX_CLIENT_SECRET=xxxx
.dev.vars 已列在 .gitignore,不會被提交到 Git。
啟動本機伺服器:
npx wrangler pages dev public --port 1234
在 localhost 開啟時,左下角會出現除錯用的假定位按鈕(萬華 266 號綠地),正式站不會顯示。
npx wrangler pages deploy public --project-name=youbike
正式環境也需要設定 TDX_CLIENT_ID / TDX_CLIENT_SECRET。可在 Cloudflare 後台的專案 Settings → Environment variables 設定,或使用指令:
npx wrangler pages secret put TDX_CLIENT_ID --project-name=youbike
npx wrangler pages secret put TDX_CLIENT_SECRET --project-name=youbike
修改 script.js 或 style.css 後,請同步調高 index.html 裡的 ?v=NN 版本號,避免使用者讀到 CDN 上的舊檔案。
到 tdx.transportdata.tw 註冊免費帳號,在「會員中心」建立 API 應用程式,即可取得 Client ID 與 Client Secret。
App 圖示:Bicycle icon,作者 Magnific,來源 www.flaticon.com