添加产品:Google Stadia
- 来源链接:https://www.theverge.com/2022/9/29/23378713/google-stadia-shutting-down-game-streaming-january-2023/
- 类型:service
- 开放日期:2019-11-19
- 关闭日期:2023-01-18
## 自动化测试全攻略
### 测试框架配置
```javascript
// jest.config.js
module.exports = {
preset: 'ts-jest',
testEnvironment: 'node',
moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
testMatch: ['**/*.test.(ts|js)'],
collectCoverageFrom: [
'**/*.{ts,tsx}',
'!**/*.d.ts',
'!**/node_modules/**'
]
};
核心测试用例解析
// graveyard.test.ts 核心测试逻辑
describe('graveyard.json validation', () => {
it('should have valid JSON format', () => {
// 验证JSON格式正确性
expect(() => require('./graveyard.json')).not.toThrow();
});
it('each product should have required fields', () => {
const data = require('./graveyard.json');
data.forEach(product => {
// 验证必填字段
expect(product).toHaveProperty('name');
expect(product).toHaveProperty('dateOpen');
expect(product).toHaveProperty('dateClose');
// 更多字段验证...
});
});
it('dates should be valid ISO strings', () => {
const data = require('./graveyard.json');
data.forEach(product => {
// 验证日期格式
expect(() => new Date(product.dateOpen)).not.toThrow();
expect(() => new Date(product.dateClose)).not.toThrow();
// 验证开放日期早于关闭日期
expect(new Date(product.dateOpen)).toBeLessThan(new Date(product.dateClose));
});
});
});
测试常见问题解决
类型错误
问题:Property 'xyz' does not exist on type 'Product'
解决方案:更新types/Product.ts定义,确保与JSON数据匹配
日期验证失败
问题:Expected date to be ISO string
解决方案:使用在线工具验证日期格式,如https://isodate.org/
描述格式错误
问题:Description should start with product name
解决方案:调整描述文本,确保以产品名称开头
API接口开发指南
产品API实现
// app/api/graveyard/route.ts
import { NextResponse } from 'next/server';
import slugify from 'slugify';
import { Product, ProductType } from '../../../types/Product';
export async function GET() {
// 加载产品数据
const data = await require('../../../graveyard.json');
// 配置slugify特殊字符处理
slugify.extend({
'+': '-plus',
'@': '-at',
});
// 处理数据,添加slug字段
const processedData = data.map((item: Product) => ({
...item,
type: item.type as ProductType,
slug: slugify(item.name, { lower: true }),
}));
// 返回JSON响应,设置缓存和CORS
return NextResponse.json(processedData, {
status: 200,
headers: {
'Cache-Control': 'max-age=3600, public',
'Access-Control-Allow-Origin': '*',
},
});
}
API使用示例
# 获取所有产品数据
curl https://killedbygoogle.com/api/graveyard
# 过滤硬件产品(使用jq)
curl https://killedbygoogle.com/api/graveyard | jq '.[] | select(.type == "hardware")'
API扩展建议
- 添加查询参数支持过滤
// 示例:添加类型过滤
export async function GET(request: Request) {
const { searchParams } = new URL(request.url);
const type = searchParams.get('type');
let data = require('../../../graveyard.json');
// 应用过滤
if (type) {
data = data.filter(item => item.type === type);
}
// ...后续处理
}
- 实现分页功能
// 示例:添加分页支持
const page = parseInt(searchParams.get('page') || '1');
const limit = parseInt(searchParams.get('limit') || '20');
const startIndex = (page - 1) * limit;
const endIndex = page * limit;
const paginatedData = data.slice(startIndex, endIndex);
部署与优化指南
本地预览
# 构建生产版本
pnpm build
# 本地预览
pnpm preview
部署选项对比
| 部署方式 | 难度 | 成本 | 适合场景 |
|---|---|---|---|
| Vercel | ⭐⭐⭐⭐⭐ | 免费(个人) | 快速演示、个人项目 |
| Netlify | ⭐⭐⭐⭐⭐ | 免费(个人) | 静态站点托管 |
| AWS Amplify | ⭐⭐⭐ | 按需付费 | 企业级部署 |
| 自托管服务器 | ⭐⭐ | 服务器成本 | 完全控制需求 |
性能优化建议
- 图片优化
// 使用Next.js Image组件
import Image from 'next/image';
// 替换<img>标签
<Image
src="/tombstone.svg"
alt="Tombstone"
width={80}
height={80}
priority={true}
/>
- 数据预取
// 在页面中预取数据
export async function getStaticProps() {
const products = require('../graveyard.json');
return {
props: { products },
revalidate: 3600 // 每小时重新生成
};
}
创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考



