feat: add version check

This commit is contained in:
shinya
2025-07-28 00:48:44 +08:00
parent 54d2a548c5
commit f901f6a12f
7 changed files with 241 additions and 8 deletions

View File

@@ -1,4 +1,10 @@
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
# 生成版本号
pnpm gen:version
# 自动添加修改的版本文件
git add src/lib/version.ts
npx lint-staged

1
VERSION.txt Normal file
View File

@@ -0,0 +1 @@
20250728004740

View File

@@ -16,6 +16,7 @@
"format:check": "prettier -c .",
"gen:runtime": "node scripts/convert-config.js",
"gen:manifest": "node scripts/generate-manifest.js",
"gen:version": "node scripts/generate-version.js",
"postbuild": "echo 'Build completed - sitemap generation disabled'",
"prepare": "husky install",
"pages:build": "pnpm gen:runtime && pnpm gen:manifest && next build && npx @cloudflare/next-on-pages --experimental-minify"
@@ -88,4 +89,4 @@
]
},
"packageManager": "pnpm@10.12.4+sha512.5ea8b0deed94ed68691c9bad4c955492705c5eeb8a87ef86bc62c74a26b037b08ff9570f108b2e4dbd1dd1a9186fea925e527f141c648e85af45631074680184"
}
}

View File

@@ -0,0 +1,45 @@
#!/usr/bin/env node
/* eslint-disable */
const fs = require('fs');
const path = require('path');
// 获取当前时间并格式化为 YYYYMMDDHHMMSS 格式
function generateVersion() {
const now = new Date();
const year = now.getFullYear();
const month = String(now.getMonth() + 1).padStart(2, '0');
const day = String(now.getDate()).padStart(2, '0');
const hours = String(now.getHours()).padStart(2, '0');
const minutes = String(now.getMinutes()).padStart(2, '0');
const seconds = String(now.getSeconds()).padStart(2, '0');
const version = `${year}${month}${day}${hours}${minutes}${seconds}`;
return version;
}
// 生成版本号
const currentVersion = generateVersion();
// 读取现有的 version.ts 文件
const versionFilePath = path.join(__dirname, '..', 'src', 'lib', 'version.ts');
let fileContent = fs.readFileSync(versionFilePath, 'utf8');
// 使用正则表达式替换 CURRENT_VERSION 的值
const updatedContent = fileContent.replace(
/const CURRENT_VERSION = '.*?'/,
`const CURRENT_VERSION = '${currentVersion}'`
);
// 写入更新后的内容
fs.writeFileSync(versionFilePath, updatedContent, 'utf8');
// 将版本号写入根目录下的 VERSION.txt 文件
const versionTxtPath = path.join(__dirname, '..', 'VERSION.txt');
fs.writeFileSync(versionTxtPath, currentVersion, 'utf8');
console.log(`版本号已更新为: ${currentVersion}`);
console.log(`文件已更新: ${versionFilePath}`);
console.log(`VERSION.txt 已更新: ${versionTxtPath}`);

View File

@@ -5,9 +5,55 @@
import { useRouter, useSearchParams } from 'next/navigation';
import { Suspense, useEffect, useState } from 'react';
import { checkForUpdates, CURRENT_VERSION } from '@/lib/version';
import { useSite } from '@/components/SiteProvider';
import { ThemeToggle } from '@/components/ThemeToggle';
// 版本显示组件
function VersionDisplay() {
const [hasUpdate, setHasUpdate] = useState(false);
const [isChecking, setIsChecking] = useState(true);
useEffect(() => {
const checkUpdate = async () => {
try {
const updateAvailable = await checkForUpdates();
setHasUpdate(updateAvailable);
} catch (_) {
// do nothing
} finally {
setIsChecking(false);
}
};
checkUpdate();
}, []);
return (
<button
onClick={() =>
window.open('https://github.com/senshinya/MoonTV', '_blank')
}
className='absolute bottom-4 left-1/2 transform -translate-x-1/2 flex items-center gap-2 text-xs text-gray-500 dark:text-gray-400 transition-colors cursor-pointer'
>
<span className='font-mono'>v{CURRENT_VERSION}</span>
{!isChecking && hasUpdate && (
<div className='flex items-center gap-1.5 text-green-600 dark:text-green-400'>
<svg className='w-3.5 h-3.5' fill='currentColor' viewBox='0 0 20 20'>
<path
fillRule='evenodd'
d='M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z'
clipRule='evenodd'
/>
</svg>
<span className='font-semibold text-xs'></span>
</div>
)}
</button>
);
}
function LoginPageClient() {
const router = useRouter();
const searchParams = useSearchParams();
@@ -170,6 +216,9 @@ function LoginPageClient() {
)}
</form>
</div>
{/* 版本信息显示 */}
<VersionDisplay />
</div>
);
}

View File

@@ -8,6 +8,7 @@ import { useEffect, useState } from 'react';
import { createPortal } from 'react-dom';
import { getAuthInfoFromBrowserCookie } from '@/lib/auth';
import { checkForUpdates, CURRENT_VERSION } from '@/lib/version';
interface AuthInfo {
username?: string;
@@ -37,6 +38,9 @@ export const UserMenu: React.FC = () => {
const [passwordLoading, setPasswordLoading] = useState(false);
const [passwordError, setPasswordError] = useState('');
// 版本检查相关状态
const [hasUpdate, setHasUpdate] = useState(false);
// 确保组件已挂载
useEffect(() => {
setMounted(true);
@@ -104,6 +108,20 @@ export const UserMenu: React.FC = () => {
}
}, []);
// 版本检查
useEffect(() => {
const checkUpdate = async () => {
try {
const updateAvailable = await checkForUpdates();
setHasUpdate(updateAvailable);
} catch (error) {
console.warn('版本检查失败:', error);
}
};
checkUpdate();
}, []);
const handleMenuClick = () => {
setIsOpen(!isOpen);
};
@@ -375,6 +393,24 @@ export const UserMenu: React.FC = () => {
<LogOut className='w-4 h-4' />
<span className='font-medium'></span>
</button>
{/* 分割线 */}
<div className='my-1 border-t border-gray-200 dark:border-gray-700'></div>
{/* 版本信息 */}
<button
onClick={() =>
window.open('https://github.com/senshinya/MoonTV', '_blank')
}
className='w-full px-3 py-2 text-center flex items-center justify-center text-gray-500 dark:text-gray-400 hover:bg-gray-50 dark:hover:bg-gray-800/50 transition-colors text-xs'
>
<div className='flex items-center gap-1'>
<span className='font-mono'>v{CURRENT_VERSION}</span>
{hasUpdate && (
<div className='w-2 h-2 bg-yellow-500 rounded-full -translate-y-1'></div>
)}
</div>
</button>
</div>
</div>
</>
@@ -672,13 +708,18 @@ export const UserMenu: React.FC = () => {
return (
<>
<button
onClick={handleMenuClick}
className='w-10 h-10 p-2 rounded-full flex items-center justify-center text-gray-600 hover:bg-gray-200/50 dark:text-gray-300 dark:hover:bg-gray-700/50 transition-colors'
aria-label='User Menu'
>
<User className='w-full h-full' />
</button>
<div className='relative'>
<button
onClick={handleMenuClick}
className='w-10 h-10 p-2 rounded-full flex items-center justify-center text-gray-600 hover:bg-gray-200/50 dark:text-gray-300 dark:hover:bg-gray-700/50 transition-colors'
aria-label='User Menu'
>
<User className='w-full h-full' />
</button>
{hasUpdate && (
<div className='absolute top-[2px] right-[2px] w-2 h-2 bg-yellow-500 rounded-full'></div>
)}
</div>
{/* 使用 Portal 将菜单面板渲染到 document.body */}
{isOpen && mounted && createPortal(menuPanel, document.body)}

90
src/lib/version.ts Normal file
View File

@@ -0,0 +1,90 @@
/* eslint-disable no-console */
'use client';
const CURRENT_VERSION = '20250728004845';
// 远程版本检查URL配置
const VERSION_CHECK_URLS = [
'https://ghfast.top/raw.githubusercontent.com/senshinya/MoonTV/main/VERSION.txt',
'https://raw.githubusercontent.com/senshinya/MoonTV/main/VERSION.txt',
];
/**
* 检查是否有新版本可用
* @returns Promise<boolean> - true表示有新版本false表示当前版本是最新的
*/
export async function checkForUpdates(): Promise<boolean> {
try {
// 尝试从主要URL获取版本信息
const primaryVersion = await fetchVersionFromUrl(VERSION_CHECK_URLS[0]);
if (primaryVersion) {
return compareVersions(primaryVersion);
}
// 如果主要URL失败尝试备用URL
const backupVersion = await fetchVersionFromUrl(VERSION_CHECK_URLS[1]);
if (backupVersion) {
return compareVersions(backupVersion);
}
// 如果两个URL都失败返回false假设当前版本是最新的
return false;
} catch (error) {
console.error('版本检查失败:', error);
return false;
}
}
/**
* 从指定URL获取版本信息
* @param url - 版本信息URL
* @returns Promise<string | null> - 版本字符串或null
*/
async function fetchVersionFromUrl(url: string): Promise<string | null> {
try {
const controller = new AbortController();
const timeoutId = setTimeout(() => controller.abort(), 5000); // 5秒超时
const response = await fetch(url, {
method: 'GET',
signal: controller.signal,
headers: {
'Content-Type': 'text/plain',
},
});
clearTimeout(timeoutId);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const version = await response.text();
return version.trim();
} catch (error) {
console.warn(`${url} 获取版本信息失败:`, error);
return null;
}
}
/**
* 比较版本号
* @param remoteVersion - 远程版本号
* @returns boolean - true表示远程版本更新
*/
function compareVersions(remoteVersion: string): boolean {
try {
// 将版本号转换为数字进行比较
const current = parseInt(CURRENT_VERSION, 10);
const remote = parseInt(remoteVersion, 10);
return remote !== current;
} catch (error) {
console.error('版本比较失败:', error);
return false;
}
}
// 导出当前版本号供其他地方使用
export { CURRENT_VERSION };