EdgeOne Pages 函数：地理位置检测

基于 Next.js 和 EdgeOne Pages Functions 构建的实时地理位置检测应用。自动检测用户 IP 地址并显示地理位置信息，具有精美的响应式界面和暗黑模式支持。

• 🌍 实时地理位置检测 - 检测用户所在城市、省份、国家及经纬度
• 🌐 运营商信息 - 显示互联网服务提供商和 ASN 信息
• 🔒 TLS 版本 - 显示连接加密详情
• 🌐 国际化支持 - 根据国家自动切换语言（中文/英文）
• 📱 响应式设计 - 针对手机和桌面端优化
• 🌙 暗黑模式 - 支持亮色/暗色主题切换
• 📊 访问统计 - 基于 KV 存储的访问数据分析
• ⚡ 边缘计算 - 通过 EdgeOne 边缘节点实现毫秒级响应

• Node.js 18+
• npm、yarn、pnpm 或 bun

git clone https://github.com/your-username/geolocation.git
cd geolocation
npm install

npm run dev

打开 http://localhost:3000 查看应用。

npm run build
npm run start

├── app/
│   ├── page.tsx          # 主页面组件
│   ├── layout.tsx        # 根布局
│   └── globals.css       # 全局样式
├── components/
│   ├── AppleIcons.tsx    # SVG 图标组件
│   └── ThemeToggle.tsx   # 暗黑模式切换组件
├── functions/
│   ├── geo/index.ts      # /geo 端点
│   ├── zh/index.ts       # /zh 端点（中文）
│   └── headers/index.ts  # /headers 端点
├── lib/
│   ├── utils.ts          # 工具函数
│   └── kv-storage.ts     # KV 存储操作封装
├── types/
│   └── kv.d.ts           # TypeScript 类型定义
└── package.json

• 框架: Next.js 14
• 样式: Tailwind CSS + shadcn/ui
• 边缘函数: EdgeOne Pages Functions
• 数据存储: EdgeOne Pages KV Storage
• 语言: TypeScript

1. 用户访问页面
2. 请求到达 EdgeOne 边缘节点
3. EdgeOne 检测用户 IP 并解析地理位置
4. 地理数据通过响应头或 JSON 返回
5. 访问数据自动保存到 KV 存储（30天保留期）
6. 前端根据国家代码显示对应语言

项目集成了 EdgeOne Pages KV 存储，提供访问数据记录功能：

• 数据保存：每次访问自动保存到 KV 存储，包含地理位置、IP、时间戳等信息
• 自动清理：30天前的数据自动清理，概率为1%
• 配置要求：需要在 EdgeOne 控制台创建 Geolocation KV 命名空间并绑定到项目

详细配置说明请参考 KV_STORAGE_README.md

ISC

• 在线演示
• EdgeOne Pages
• 更多模板