From e947c78a739a6a6564efba8ebcfdf9d2e0823480 Mon Sep 17 00:00:00 2001 From: ybc <2483488988@qq.com> Date: Thu, 22 Jan 2026 14:42:09 +0800 Subject: [PATCH] =?UTF-8?q?=E6=94=B9=E8=BF=9B=E7=9F=AD=E9=93=BE=E6=8E=A5?= =?UTF-8?q?=E8=BD=AC=E6=8D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../{Shorturlchange.js => Shorturlchange.jsx} | 77 +++++++++++-------- src/views/accounts/ShorturlConversion.jsx | 72 ++++++----------- 2 files changed, 69 insertions(+), 80 deletions(-) rename src/components/{Shorturlchange.js => Shorturlchange.jsx} (63%) diff --git a/src/components/Shorturlchange.js b/src/components/Shorturlchange.jsx similarity index 63% rename from src/components/Shorturlchange.js rename to src/components/Shorturlchange.jsx index cf03f36..e740515 100644 --- a/src/components/Shorturlchange.js +++ b/src/components/Shorturlchange.jsx @@ -1,6 +1,8 @@ -import { message } from 'antd'; +import { useCallback } from 'react'; +import { notification } from 'antd'; -const Shorturlchange = async (longUrl) => { +const useShortUrlChange = () => { + const apiPrefix = { "japanhighlights.com": "https://www.japanhighlights.com/index.php", "chinahighlights.com": "https://www.chinahighlights.com/guide-use.php", @@ -29,50 +31,65 @@ const Shorturlchange = async (longUrl) => { } }; - const urlConversion = async (longUrl) => { + const urlBase64 = (longUrl) => { + try { + const extracted1 = longUrl.match(/^https?:\/\/[^\/]*/)?.[0] || ''; + const extracted2 = longUrl.match(/https:\/\/www\.([^\/]+)/)?.[1] || ''; + + const encoder = new TextEncoder(); + const utf8Bytes = encoder.encode(longUrl); + const base64Url = btoa(String.fromCharCode(...utf8Bytes)); + + return { base64Url, extracted1, extracted2 }; + } catch (error) { + notification.error({ + message: '错误', + description: '转换失败,请检查输入的URL是否正确', + }); + console.error('URL转换错误:', error); + return { base64Url: '', extracted1: '', extracted2: '' }; + } + }; + + const convertUrl = useCallback(async (longUrl) => { if (!longUrl.trim()) { - message.error('不是有效的长链接'); + notification.error({ + message: '错误', + description: '不是有效的长链接', + }); return null; } const { base64Url, extracted1, extracted2 } = urlBase64(longUrl); - if (base64Url && extracted1 && extracted2) { - const apiUrl = apiPrefix[extracted2]; + if (base64Url && extracted1) { + const apiUrl = apiPrefix[extracted2] || apiPrefix["chinahighlights.com"]; const data = await fetchNowConversationsitems(base64Url, apiUrl); if (data) { const resultShortUrl = extracted1 + data.isl_link; - message.success('转换成功!'); + notification.success({ + message: '成功', + description: '转换成功!', + }); return resultShortUrl; } else { - message.error('转换失败,请检查输入的URL是否正确'); + notification.error({ + message: '错误', + description: '转换失败,请检查输入的URL是否正确', + }); return null; } } else { - message.error('URL格式不正确,请输入完整的URL'); + notification.error({ + message: '错误', + description: 'URL格式不正确,请输入完整的URL', + }); return null; } - }; - - const urlBase64 = (longUrl) => { - try { - const extracted1 = longUrl.match(/^.*?com/)?.[0] || ''; - const extracted2 = longUrl.match(/https:\/\/www\.([^\/]+)/)?.[1] || ''; - - const encoder = new TextEncoder(); - const utf8Bytes = encoder.encode(longUrl); - const base64Url = btoa(String.fromCharCode(...utf8Bytes)); - - return { base64Url, extracted1, extracted2 }; - } catch (error) { - message.error('转换失败,请检查输入的URL是否正确'); - console.error('URL转换错误:', error); - return { base64Url: '', extracted1: '', extracted2: '' }; - } - } + }, []); - return await urlConversion(longUrl); -} + return { convertUrl }; +}; -export default Shorturlchange; \ No newline at end of file +export default useShortUrlChange; \ No newline at end of file diff --git a/src/views/accounts/ShorturlConversion.jsx b/src/views/accounts/ShorturlConversion.jsx index bb31d52..7798fa9 100644 --- a/src/views/accounts/ShorturlConversion.jsx +++ b/src/views/accounts/ShorturlConversion.jsx @@ -1,40 +1,17 @@ -import { Input, Button, Space, message, Typography } from 'antd' -import { CopyOutlined, LinkOutlined } from '@ant-design/icons' -import Shorturlchange from '@/components/Shorturlchange' +import { Input, Button, Space, Typography } from 'antd' +import { LinkOutlined } from '@ant-design/icons' +import useShortUrlChange from '@/components/Shorturlchange' import { useState } from 'react' -const { Title, Text } = Typography +const { Title, Text, Paragraph } = Typography function ShorturlConversion() { const [longUrl, setLongUrl] = useState('') const [shortUrl, setShortUrl] = useState('') - - function copyToClipboard(text) { - const textarea = document.createElement('textarea'); - textarea.value = text; - // 隐藏文本域(避免页面闪烁) - textarea.style.position = 'fixed'; - textarea.style.opacity = 0; - document.body.appendChild(textarea); - // 选中并复制 - textarea.select(); - try { - const successful = document.execCommand('copy'); - if (successful) { - message.success('已复制'); - } else { - throw new Error('复制失败'); - } - } catch (err) { - message.error('复制失败,请手动复制'); - } finally { - // 移除临时文本域 - document.body.removeChild(textarea); - } - } + const { convertUrl } = useShortUrlChange() const handleConvert = async () => { - const result = await Shorturlchange(longUrl); + const result = await convertUrl(longUrl); if (result) { setShortUrl(result); } @@ -43,9 +20,9 @@ function ShorturlConversion() { return (
- 长链接: + 长链接: setLongUrl(e.target.value)} prefix={} @@ -54,30 +31,25 @@ function ShorturlConversion() {
-
- 短链接: - } - onClick={() => copyToClipboard(shortUrl)} - /> - ) - } - size="large" - /> -
+ {shortUrl && ( +
+ 转换后的短链接: + + {shortUrl} + +
)}
); }