170 lines
5.3 KiB
Markdown
170 lines
5.3 KiB
Markdown
# MockAddress Core 使用说明
|
||
|
||
## 快速开始
|
||
|
||
### 方式一：直接使用（适合简单场景）
|
||
|
||
如果你的网站结构和 mockaddress.com 类似（有 `data/` 目录），可以直接使用，无需配置：
|
||
|
||
```html
|
||
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<link rel="stylesheet" href="./src/css/main.css">
|
||
</head>
|
||
<body>
|
||
<script type="module">
|
||
import { generateUSAddress } from './src/js/address-generator.js';
|
||
|
||
// 直接使用，会自动检测 data/ 目录
|
||
const address = await generateUSAddress('CA');
|
||
console.log(address);
|
||
</script>
|
||
</body>
|
||
</html>
|
||
```
|
||
|
||
### 方式二：自定义数据路径（推荐）
|
||
|
||
如果你的数据文件放在其他位置，需要先配置：
|
||
|
||
```html
|
||
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<link rel="stylesheet" href="./src/css/main.css">
|
||
</head>
|
||
<body>
|
||
<script type="module">
|
||
// 1. 先导入配置模块
|
||
import { configure } from './src/js/config.js';
|
||
import { generateUSAddress } from './src/js/address-generator.js';
|
||
|
||
// 2. 配置你的数据路径
|
||
configure({
|
||
dataBasePath: 'my-custom-data/', // 你的数据目录
|
||
autoDetectPaths: false // 禁用自动检测，只使用你指定的路径
|
||
});
|
||
|
||
// 3. 现在可以正常使用了
|
||
const address = await generateUSAddress('CA');
|
||
console.log(address);
|
||
</script>
|
||
</body>
|
||
</html>
|
||
```
|
||
|
||
## 配置选项
|
||
|
||
### `dataBasePath`（字符串，可选）
|
||
|
||
你的数据文件的基础路径。例如：
|
||
- `'my-data/'` - 相对路径
|
||
- `'/static/data/'` - 绝对路径
|
||
- `'https://cdn.example.com/data/'` - CDN 路径
|
||
|
||
**注意**：如果不设置，代码会自动检测路径（适合 mockaddress.com 的多语言结构）。
|
||
|
||
### `autoDetectPaths`（布尔值，默认 `true`）
|
||
|
||
是否启用自动路径检测。如果设为 `false`，则只使用 `dataBasePath` 指定的路径。
|
||
|
||
**建议**：
|
||
- 如果你的网站结构简单，设置 `dataBasePath` 并关闭 `autoDetectPaths`
|
||
- 如果你的网站有多语言目录结构（类似 mockaddress.com），保持 `autoDetectPaths: true`
|
||
|
||
## 数据文件结构
|
||
|
||
你需要准备以下 JSON 数据文件（放在你配置的 `dataBasePath` 目录下）：
|
||
|
||
- `usData.json` - 美国地址数据
|
||
- `hkData.json` - 香港地址数据
|
||
- `ukData.json` - 英国地址数据
|
||
- `caData.json` - 加拿大地址数据
|
||
- `jpData.json` - 日本地址数据
|
||
- `jpNamesData.json` - 日本姓名数据
|
||
- `inData.json` - 印度地址数据
|
||
- `twData.json` - 台湾地址数据
|
||
- `sgData.json` - 新加坡地址数据
|
||
- `deData.json` - 德国地址数据
|
||
- `namesData.json` - 通用姓名数据
|
||
- `macOuiData.json` - MAC OUI 数据（用于 MAC 工具）
|
||
|
||
> **注意**：本开源仓库不包含这些数据文件。你需要自己准备数据，或者参考 mockaddress.com 的数据格式。
|
||
|
||
## 完整示例
|
||
|
||
```html
|
||
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>我的地址生成器</title>
|
||
<link rel="stylesheet" href="./src/css/main.css">
|
||
</head>
|
||
<body>
|
||
<div id="app">
|
||
<button id="generate-btn">生成美国地址</button>
|
||
<div id="result"></div>
|
||
</div>
|
||
|
||
<script type="module">
|
||
// 导入配置和生成函数
|
||
import { configure } from './src/js/config.js';
|
||
import { generateUSAddress } from './src/js/address-generator.js';
|
||
|
||
// 配置数据路径（根据你的实际情况修改）
|
||
configure({
|
||
dataBasePath: 'data/', // 你的数据目录
|
||
autoDetectPaths: false // 只使用指定路径
|
||
});
|
||
|
||
// 绑定按钮事件
|
||
document.getElementById('generate-btn').addEventListener('click', async () => {
|
||
try {
|
||
const address = await generateUSAddress('CA');
|
||
document.getElementById('result').innerHTML = `
|
||
<p>姓名: ${address.firstName} ${address.lastName}</p>
|
||
<p>地址: ${address.fullAddress}</p>
|
||
<p>电话: ${address.phone}</p>
|
||
`;
|
||
} catch (error) {
|
||
console.error('生成失败:', error);
|
||
alert('生成失败，请检查数据文件路径是否正确');
|
||
}
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|
||
```
|
||
|
||
## 重要提示
|
||
|
||
1. **数据文件格式**：确保你的 JSON 文件格式与 mockaddress.com 使用的格式一致
|
||
2. **CORS 问题**：如果数据文件在不同域名，需要配置 CORS 头
|
||
3. **路径问题**：使用相对路径时，注意当前页面的位置
|
||
4. **缓存**：代码会自动缓存数据到 localStorage，如需清除缓存，可以调用 `localStorage.clear()`
|
||
|
||
## 不影响正式站点
|
||
|
||
- 如果你不调用 `configure()`，代码会使用默认的自动路径检测逻辑，**完全不影响 mockaddress.com 的正常运行**
|
||
- 配置是独立的，每个页面可以有自己的配置
|
||
- 配置不会持久化，每次页面加载都需要重新设置（如果需要）
|
||
|
||
## 更多功能
|
||
|
||
查看 `README.md` 了解所有可用的生成函数：
|
||
- `generateUSAddress()` - 美国地址
|
||
- `generateHKAddress()` - 香港地址
|
||
- `generateUKAddress()` - 英国地址
|
||
- `generateCAAddress()` - 加拿大地址
|
||
- `generateJPAddress()` - 日本地址
|
||
- `generateINAddress()` - 印度地址
|
||
- `generateTWAddress()` - 台湾地址
|
||
- `generateSGAddress()` - 新加坡地址
|
||
- `generateDEAddress()` - 德国地址
|
||
- `generateTaxFreeAddress()` - 美国免税州地址
|
||
- `generateIdentityInfo()` - 身份信息
|
||
- `generateCreditCardInfo()` - 信用卡信息（测试用）
|