添加广告时间控制功能

- 创建环境变量配置示例文件 .env.example
- 添加广告配置工具函数,支持时间控制和链接配置
- 修改广告组件,根据环境变量控制显示
- 支持以下环境变量:
  - NEXT_PUBLIC_AD_END_TIME: 广告结束时间
  - NEXT_PUBLIC_AD_ENABLED: 是否启用广告
  - NEXT_PUBLIC_AD_LINK: 广告跳转链接

使用方法:
1. 复制 .env.example 为 .env.local
2. 设置广告结束时间,超过该时间广告自动下线
3. 可通过 NEXT_PUBLIC_AD_ENABLED=false 立即关闭广告

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
zihanjian
2025-07-04 17:40:57 +08:00
parent c6cd15040d
commit c5d9ffff2b
3 changed files with 46 additions and 2 deletions

View File

@@ -1,11 +1,18 @@
'use client';
import { isAdEnabled, getAdLink } from '@/utils/adConfig';
export default function HorizontalBanner() {
// 如果广告未启用或已过期,不显示
if (!isAdEnabled()) {
return null;
}
return (
<div className="w-full bg-gray-100">
{/* 横向 Banner - 7:1 比例 */}
<a
href="https://www.google.com"
href={getAdLink()}
target="_blank"
rel="noopener noreferrer"
className="block relative w-full bg-gray-200 overflow-hidden hover:opacity-90 transition-opacity duration-300 cursor-pointer"

View File

@@ -2,11 +2,17 @@
import { useState, useEffect } from 'react';
import { X } from 'lucide-react';
import { isAdEnabled, getAdLink } from '@/utils/adConfig';
export default function VerticalAd() {
const [isVisible, setIsVisible] = useState(false);
useEffect(() => {
// 检查广告是否应该显示
if (!isAdEnabled()) {
return;
}
// 延迟显示广告,避免影响首屏加载
const timer = setTimeout(() => {
setIsVisible(true);
@@ -35,7 +41,7 @@ export default function VerticalAd() {
{/* 广告内容 - 3:5 比例(宽:高) */}
<a
href="https://www.google.com"
href={getAdLink()}
target="_blank"
rel="noopener noreferrer"
className="block relative bg-gray-200 rounded-lg overflow-hidden shadow-xl hover:shadow-2xl transition-shadow duration-300 cursor-pointer"

31
utils/adConfig.ts Normal file
View File

@@ -0,0 +1,31 @@
// 广告配置工具函数
export function isAdEnabled(): boolean {
// 检查是否启用广告
const enabled = process.env.NEXT_PUBLIC_AD_ENABLED;
if (enabled === 'false') {
return false;
}
// 检查广告结束时间
const endTimeStr = process.env.NEXT_PUBLIC_AD_END_TIME;
if (!endTimeStr) {
// 如果没有设置结束时间,默认显示广告
return true;
}
try {
const endTime = new Date(endTimeStr);
const now = new Date();
// 如果当前时间超过了结束时间,则不显示广告
return now <= endTime;
} catch (error) {
console.error('Invalid ad end time format:', endTimeStr);
return true; // 时间格式错误时默认显示广告
}
}
export function getAdLink(): string {
return process.env.NEXT_PUBLIC_AD_LINK || 'https://www.google.com';
}