Wrangler là gì? Từ code trên máy tính tới chạy toàn cầu trên edge What is Wrangler? From laptop code to running globally at the edge What is Wrangler? From laptop code to running globally at the edge
Wrangler là “cần cẩu” đưa Worker và static site từ máy bạn lên mạng Cloudflare. Hiểu `dev`, `deploy` và secrets giúp bạn ship mà không lộ khóa API. Wrangler is the crane that lifts Workers and static sites from your machine onto Cloudflare’s network. Understanding `dev`, `deploy`, and secrets helps you ship without leaking API keys. Wrangler is the crane that lifts Workers and static sites from your machine onto Cloudflare’s network. Understanding `dev`, `deploy`, and secrets helps you ship without leaking API keys.
API serverless toàn cầu Serverless global APIs Serverless global APIs
Ví dụ kiến trúc API serverless trên Cloudflare — compute và data product (Workers, D1, R2) tương tác thế nào. An example architecture of a serverless API on Cloudflare and aims to illustrate how different compute and data products could interact with each other. An example architecture of a serverless API on Cloudflare and aims to illustrate how different compute and data products could interact with each other.
Thuật ngữ: Concepts: Concepts: Workers · D1 · R2 · Global API · Edge compute
Sơ đồ chính thức ↗ Official diagram ↗ Official diagram ↗ · Serverless Serverless Serverless
Wrangler giải quyết vấn đề gì cho developer? What problem does Wrangler solve for developers? What problem does Wrangler solve for developers?
Trước khi có Wrangler, deploy lên edge thường nghĩa là dashboard thủ công hoặc script tự viết. Wrangler là CLI chính thức: tạo project (`wrangler init`), chạy local (`wrangler dev`), deploy (`wrangler deploy` hoặc `wrangler pages deploy`), quản lý D1/KV/R2 binding và secrets — một file `wrangler.toml` (hoặc cấu hình tương đương) mô tả môi trường. Before Wrangler, deploying to the edge often meant manual dashboard clicks or homemade scripts. Wrangler is the official CLI: scaffold (`wrangler init`), run locally (`wrangler dev`), deploy (`wrangler deploy` or `wrangler pages deploy`), manage D1/KV/R2 bindings and secrets — with `wrangler.toml` (or equivalent config) describing the environment. Before Wrangler, deploying to the edge often meant manual dashboard clicks or homemade scripts. Wrangler is the official CLI: scaffold (`wrangler init`), run locally (`wrangler dev`), deploy (`wrangler deploy` or `wrangler pages deploy`), manage D1/KV/R2 bindings and secrets — with `wrangler.toml` (or equivalent config) describing the environment.
Các bài trên blog.cloudflare.com về Developer Platform thường coi Wrangler là “đường vào” cho Workers: bạn viết TypeScript/JavaScript, Wrangler đóng gói và đẩy lên hàng trăm điểm edge. Không cần SSH vào server hay cấu hình nginx chỉ để thử API nhỏ. Developer Platform posts on blog.cloudflare.com treat Wrangler as the on-ramp to Workers: you write TypeScript/JavaScript, Wrangler bundles and pushes to hundreds of edge locations. No SSH into a server or nginx tuning just to try a small API. Developer Platform posts on blog.cloudflare.com treat Wrangler as the on-ramp to Workers: you write TypeScript/JavaScript, Wrangler bundles and pushes to hundreds of edge locations. No SSH into a server or nginx tuning just to try a small API.
Trên hub này, workshop signup và quiz chạy qua Pages Functions — local full stack thường là `npm run build` rồi `wrangler pages dev dist`. Astro dev (`npm run dev`) chỉ phục vụ trang tĩnh; API `/api/*` cần Wrangler pages dev. On this hub, workshop signup and quiz run through Pages Functions — local full stack is often `npm run build` then `wrangler pages dev dist`. Astro dev (`npm run dev`) serves static pages only; `/api/*` needs Wrangler pages dev. On this hub, workshop signup and quiz run through Pages Functions — local full stack is often `npm run build` then `wrangler pages dev dist`. Astro dev (`npm run dev`) serves static pages only; `/api/*` needs Wrangler pages dev.
API serverless toàn cầu Serverless global APIs Serverless global APIs
Ví dụ kiến trúc API serverless trên Cloudflare — compute và data product (Workers, D1, R2) tương tác thế nào. An example architecture of a serverless API on Cloudflare and aims to illustrate how different compute and data products could interact with each other. An example architecture of a serverless API on Cloudflare and aims to illustrate how different compute and data products could interact with each other.
Thuật ngữ: Concepts: Concepts: Workers · D1 · R2 · Global API · Edge compute
Sơ đồ chính thức ↗ Official diagram ↗ Official diagram ↗ · Serverless Serverless Serverless
Local dev vs production: hai “thế giới” cần tách bạch Local dev vs production: two worlds to keep separate Local dev vs production: two worlds to keep separate
`wrangler dev` (hoặc `pages dev`) mô phỏng binding local: D1 local, KV preview, biến từ `.dev.vars`. Đây là nơi bạn phá hoại thoải mái. Production dùng binding remote thật — sai migration hoặc xóa nhầm bảng sẽ ảnh hưởng user thật. `wrangler dev` (or `pages dev`) simulates local bindings: local D1, KV preview, variables from `.dev.vars`. This is where you break things safely. Production uses real remote bindings — wrong migrations or accidental table drops hit real users. `wrangler dev` (or `pages dev`) simulates local bindings: local D1, KV preview, variables from `.dev.vars`. This is where you break things safely. Production uses real remote bindings — wrong migrations or accidental table drops hit real users.
Quy tắc vàng: không copy production secret vào chat Slack; dùng `wrangler secret put KEY` cho production và `.dev.vars` (gitignored) cho local. File `wrangler.toml` trong repo hub dùng bản `.example` — bản thật không commit. Golden rule: do not paste production secrets into Slack; use `wrangler secret put KEY` for production and `.dev.vars` (gitignored) for local. This hub’s `wrangler.toml` uses a `.example` file — the real one is not committed. Golden rule: do not paste production secrets into Slack; use `wrangler secret put KEY` for production and `.dev.vars` (gitignored) for local. This hub’s `wrangler.toml` uses a `.example` file — the real one is not committed.
Preview URL từ Git integration (Pages) cho mỗi PR là “production giả”: dùng binding preview riêng khi có thể, tránh test destructive trên DB production chung. Preview URLs from Git integration (Pages) per PR are “fake production”: use separate preview bindings when possible; avoid destructive tests on a shared production database. Preview URLs from Git integration (Pages) per PR are “fake production”: use separate preview bindings when possible; avoid destructive tests on a shared production database.
Luồng deploy điển hình: Worker đơn và site Astro + Functions Typical deploy flows: a single Worker and an Astro site with Functions Typical deploy flows: a single Worker and an Astro site with Functions
Worker API đơn: `wrangler init` → code trong `src/index.ts` → `wrangler dev` test → `wrangler deploy` → gán route hoặc custom domain trong dashboard. Site tĩnh + API: build frontend (`npm run build`), Functions trong `functions/`, `wrangler pages deploy dist` hoặc push Git để Pages CI deploy. Single Worker API: `wrangler init` → code in `src/index.ts` → test with `wrangler dev` → `wrangler deploy` → attach a route or custom domain in the dashboard. Static site + API: build frontend (`npm run build`), Functions in `functions/`, `wrangler pages deploy dist` or push Git for Pages CI deploy. Single Worker API: `wrangler init` → code in `src/index.ts` → test with `wrangler dev` → `wrangler deploy` → attach a route or custom domain in the dashboard. Static site + API: build frontend (`npm run build`), Functions in `functions/`, `wrangler pages deploy dist` or push Git for Pages CI deploy.
Sau deploy, `wrangler tail` xem log realtime — hữu ích hơn `console.log` mù khi debug 500 trên production. Kết hợp observability trong dashboard khi traffic tăng. After deploy, `wrangler tail` streams realtime logs — more useful than blind `console.log` when debugging production 500s. Add dashboard observability as traffic grows. After deploy, `wrangler tail` streams realtime logs — more useful than blind `console.log` when debugging production 500s. Add dashboard observability as traffic grows.
Đọc bài Workers intro và Developer Platform trên hub trước khi tối ưu CI phức tạp. Mục tiêu tuần đầu: một lần deploy thành công từ máy bạn, một lần từ Git — hiểu hai đường đó đã đủ cho hầu hết side project. Read the Workers intro and Developer Platform posts on this hub before optimizing complex CI. Week-one goal: one successful deploy from your laptop, one from Git — knowing both paths is enough for most side projects. Read the Workers intro and Developer Platform posts on this hub before optimizing complex CI. Week-one goal: one successful deploy from your laptop, one from Git — knowing both paths is enough for most side projects.
Checklist trước khi bấm deploy lần đầu Checklist before your first deploy Checklist before your first deploy
Một: `wrangler.toml` có đúng `name` và `compatibility_date`. Hai: binding D1/KV khớp tên trong code (`env.DB`). Ba: secrets đã set remote, không nằm trong Git. Bốn: chạy smoke test local với `wrangler pages dev` nếu site có API. Năm: kiểm tra custom domain và SSL mode (Full strict khi origin có cert hợp lệ). One: `wrangler.toml` has the right `name` and `compatibility_date`. Two: D1/KV binding names match code (`env.DB`). Three: secrets are set remotely, not in Git. Four: run local smoke tests with `wrangler pages dev` if the site has APIs. Five: check custom domain and SSL mode (Full strict when origin has a valid cert). One: `wrangler.toml` has the right `name` and `compatibility_date`. Two: D1/KV binding names match code (`env.DB`). Three: secrets are set remotely, not in Git. Four: run local smoke tests with `wrangler pages dev` if the site has APIs. Five: check custom domain and SSL mode (Full strict when origin has a valid cert).
Câu hỏi tự kiểm tra: “Nếu đẩy nhánh này lên main, có migration D1 nào chạy tự động không?” Nếu có, review file SQL trước. Wrangler giúp deploy nhanh — trách nhiệm review vẫn là của bạn. Self-check: “If I merge this branch to main, will any D1 migration run automatically?” If yes, review the SQL first. Wrangler makes deploy fast — review responsibility stays yours. Self-check: “If I merge this branch to main, will any D1 migration run automatically?” If yes, review the SQL first. Wrangler makes deploy fast — review responsibility stays yours.
Hình minh họa Cloudflare Cloudflare visuals Cloudflare visuals
Sơ đồ Reference Architecture chính thức và (khi có) ảnh Dashboard — giúp đối chiếu khi học. Official Reference Architecture diagrams and (when available) Dashboard screenshots — useful while you learn. Official Reference Architecture diagrams and (when available) Dashboard screenshots — useful while you learn.
Ứng dụng fullstack Fullstack applications Fullstack applications
Ví dụ fullstack trên Developer Platform — Workers/Pages, storage và AI services trong một kiến trúc thực tế. A practical example of how these services come together in a real fullstack application architecture. A practical example of how these services come together in a real fullstack application architecture.
Thuật ngữ: Concepts: Concepts: Workers · Pages · D1 · R2 · KV · Durable Objects
Sơ đồ chính thức ↗ Official diagram ↗ Official diagram ↗ · Serverless Serverless Serverless
Câu hỏi thường gặp Frequently asked questions Frequently asked questions
Wrangler khác dashboard deploy chỗ nào? How is Wrangler different from dashboard deploy? How is Wrangler different from dashboard deploy?
Dashboard phù hợp thử nhanh. Wrangler lặp lại được trong CI, version control cấu hình binding, và script hóa secrets — chuẩn cho team và production. The dashboard suits quick experiments. Wrangler repeats in CI, versions binding config, and scripts secrets — the norm for teams and production. The dashboard suits quick experiments. Wrangler repeats in CI, versions binding config, and scripts secrets — the norm for teams and production.
Có cần Wrangler nếu chỉ dùng Pages Git integration? Do you need Wrangler if you only use Pages Git integration? Do you need Wrangler if you only use Pages Git integration?
CI Git có thể deploy không cần Wrangler local hàng ngày, nhưng Wrangler vẫn hữu ích cho `pages dev`, secrets, D1 migrations và debug `tail`. Git CI can deploy without daily local Wrangler, but Wrangler still helps with `pages dev`, secrets, D1 migrations, and `tail` debugging. Git CI can deploy without daily local Wrangler, but Wrangler still helps with `pages dev`, secrets, D1 migrations, and `tail` debugging.
Lỡ commit secret vào Git thì sao? What if you committed a secret to Git? What if you committed a secret to Git?
Rotate (đổi) secret ngay trên nhà cung cấp và Cloudflare, xóa khỏi lịch sử Git nếu có thể, và dùng `wrangler secret put` thay vì file plain text. Coi secret đã lộ là compromised. Rotate the secret immediately on the provider and Cloudflare, remove it from Git history if possible, and use `wrangler secret put` instead of plain files. Treat exposed secrets as compromised. Rotate the secret immediately on the provider and Cloudflare, remove it from Git history if possible, and use `wrangler secret put` instead of plain files. Treat exposed secrets as compromised.
Học tiếp trên hub (on-page backlinks) Keep learning on this hub (on-page links) Keep learning on this hub (on-page links)
- Workers (trang sản phẩm) Workers (product page) Workers (product page)
- Lộ trình Developer Platform Developer Platform track Developer Platform track
- Use case: deploy static site Use case: deploy a static site Use case: deploy a static site
- Roadmap Developer Developer roadmap Developer roadmap
- Changelog sản phẩm Product changelog Product changelog
Nguồn tham khảo (blog.cloudflare.com) Sources (blog.cloudflare.com) Sources (blog.cloudflare.com)
Nội dung được viết lại để dễ hiểu hơn; luôn đọc bài gốc trên blog.cloudflare.com và docs chính thức khi cần chi tiết kỹ thuật hoặc cập nhật mới nhất. Content is rewritten for clarity; always read the original posts on blog.cloudflare.com and official docs for technical detail or the latest updates. Content is rewritten for clarity; always read the original posts on blog.cloudflare.com and official docs for technical detail or the latest updates.