🚀 Hướng Dẫn Nhanh

Nhập URL này vào trình duyệt:

https://buonhayvui1404--7388d0b81f8b11f19f3b42dde27851f2.web.val.run

Cấu Hình Proxy:

• 🌍 Region: Để trống hoặc nhập tên vùng (California, Texas, etc.)
• 🏙️ City: Để trống hoặc nhập tên thành phố (Los Angeles, New York, etc.)

Điều Khiển:

• ▶ START - Khởi động tạo proxy & browser
• ⏹ STOP - Dừng hệ thống

Giám Sát:

• Status hiển thị trạng thái (IDLE, RUNNING, ERROR)
• Logs theo thời gian thực với các mức: INFO, ERROR, WARN

Thao Tác:

• 🔄 REFRESH - Tải lại danh sách
• OPEN - Mở live view của proxy trong tab mới
• DEL - Xóa profile

Thông Tin:

• Hiển thị thời gian tạo
• Hiển thị ID proxy (rút gọn)

Hiện tại giao diện dùng mock data. Để kết nối với API Kernel thực:

Vào trang manage val, thêm environment variable:

• Key: KERNEL_API_KEY
• Value: <your-api-key-here>

Trong main.ts, tìm và cập nhật:

if (path === "/api/create-proxy" && method === "POST") {
  const apiKey = Deno.env.get("KERNEL_API_KEY");
  const response = await fetch("https://api.kernel.com/proxies", {
    method: "POST",
    headers: {
      "Authorization": `Bearer ${apiKey}`,
      "Content-Type": "application/json"
    },
    body: JSON.stringify({
      type: "residential",
      name: `tiktok_auto_${Date.now()}`,
      config: { country: "US", region, city }
    })
  });
  const proxy = await response.json();
  return Response.json({ success: true, proxyId: proxy.id, ... });
}

Tương tự, gọi endpoint create browser:

const browserRes = await fetch("https://api.kernel.com/browsers", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${apiKey}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    proxy_id: proxyId,
    headless: false,
    stealth: true,
    timeout_seconds: 3600
  })
});

Để lưu trữ bền vững, sử dụng database SQL:

import { sqlite } from "https://esm.town/v/std/sqlite/main.ts";
import { saveProfile, getProfiles } from "./utils.ts";

// Khi tạo profile thành công
await saveProfile(proxyId, cdpUrl, liveUrl);

// Lấy danh sách profiles
const profiles = await getProfiles();

Thay đổi theme colors trong main.ts:

/* Màu chính (neon green) */
color: #00ff00;

/* Nền tối */
background: #0f0f23;

/* Xanh đậm phụ */
background: #1a1a2e;

/* Nút khởi động */
background: #00aa00;

/* Nút dừng */
background: #aa0000;

Tất cả hoạt động hiển thị trong tab Control

import { getLogs } from "./utils.ts";
const recentLogs = await getLogs(50);

Nhấn F12 → Console để xem JavaScript logs

Nếu giao diện không tải:

1. Kiểm tra URL endpoint đúng không
2. Xóa cache: Ctrl+Shift+Del
3. Kiểm tra console (F12) có lỗi gì

Nếu API không kết nối:

1. Kiểm tra KERNEL_API_KEY có được set không
2. Kiểm tra API endpoint URL đúng không
3. Kiểm tra network tab (F12 → Network)

Nếu Profiles không lưu:

1. Kiểm tra database có được init không
2. Xem console logs có lỗi gì
3. Kiểm tra storage quota

main.ts              - HTTP endpoint + HTML UI
├─ HTML             - Giao diện web
├─ CSS              - Styling (theme dark mode)
└─ JavaScript       - Logic giao diện + API calls

browser_manager.ts   - TypeScript class quản lý browser/proxy
utils.ts            - Helper functions + database operations
README.md           - Tài liệu đầy đủ

{
  "success": true,
  "proxyId": "proxy_1742123456789",
  "message": "Proxy created successfully"
}

{
  "success": true,
  "cdpUrl": "wss://cdp.kernel.com/session/123",
  "liveUrl": "https://live.kernel.com/view/123"
}

{
  "success": false,
  "error": "Invalid API key"
}

1. Cache Profiles: Đã có sẵn trong giao diện
2. Batch Requests: Sử dụng sqlite.batch() cho multiple operations
3. Async/Await: Tất cả API calls đều async
4. Minimal Dependencies: Chỉ dùng std library

• 📖 Docs: https://docs.val.town
• 🐛 Console: Nhấn F12 để debug
• 📡 Network Tab: Kiểm tra API calls
• 💬 Community: Val Town Discord

Made with 💚 on Val Town ✨