message-verify 0.0.47-beta.0 → 0.0.49-beta.0

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+export declare const getFingerprint: () => Promise<string>;
 export type ModalConfig = {
     data: string;
     onClose?: () => void;

package/dist/index.js

@@ -1,6 +1,20 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import ReactDOM from 'react-dom/client';
 import VerifyModal from './verify-modal.js';
+import Fingerprint2 from 'fingerprintjs2';
+export const getFingerprint = () => {
+    return new Promise((resolve) => {
+        Fingerprint2.get(function (components) {
+            const includeKeys = ['userAgent', 'deviceMemory', 'cpuClass', 'hardwareConcurrency', 'platform'];
+            const values = components
+                .filter(component => includeKeys.includes(component.key))
+                .map(component => component.value)
+                .join('###');
+            const fingerprint = Fingerprint2.x64hash128(values, 31);
+            resolve(fingerprint);
+        });
+    });
+};
 let modalRoot = null;
 export const createMessageVerifyModal = (modalProps) => {
     const container = document.createElement('div');

package/dist/resource.js

@@ -45,6 +45,6 @@ const api = {
     urlPrefix,
     getCaptchaKey: customPost('captcha/key'),
     reSendCode: customPost('sms/send'),
-    getCaptchaImgUrl: (captchaKey) => { return `/admin/captcha/image/${captchaKey}`; },
+    getCaptchaImgUrl: (captchaKey) => { return `captcha/image/${captchaKey}`; },
 };
 export default assign(api);

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "message-verify",
-  "version": "0.0.47-beta.0",
+  "version": "0.0.49-beta.0",
   "type": "module",
   "main": "dist/index.js",
   "dependencies": {
     "@yqg/resource": "^1.3.8",
+    "fingerprintjs2": "^2.1.4",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },

package/src/index.tsx

@@ -1,5 +1,20 @@
 import ReactDOM from 'react-dom/client'
 import VerifyModal from './verify-modal.js'
+import Fingerprint2 from 'fingerprintjs2';
+
+export const getFingerprint = (): Promise<string> => {
+    return new Promise((resolve) => {
+        Fingerprint2.get(function (components) {
+            const includeKeys = ['userAgent', 'deviceMemory', 'cpuClass', 'hardwareConcurrency', 'platform'];
+            const values = components
+                .filter(component => includeKeys.includes(component.key))
+                .map(component => component.value)
+                .join('###');
+            const fingerprint = Fingerprint2.x64hash128(values, 31);
+            resolve(fingerprint);
+        });
+    });
+};
 
 export type ModalConfig = {
     data: string;

package/src/resource.ts

@@ -51,7 +51,7 @@ const api = {
 
     getCaptchaKey: customPost('captcha/key'),
     reSendCode: customPost('sms/send'),
-    getCaptchaImgUrl: (captchaKey: string) => {return `/admin/captcha/image/${captchaKey}`},
+    getCaptchaImgUrl: (captchaKey: string) => {return `captcha/image/${captchaKey}`},
 };
 
 export default assign(api);

package/src/verify-modal.tsx

@@ -2,23 +2,7 @@ import { useEffect, useState } from 'react'
 import { Modal, Input, Button, message } from './compoments/index.js'
 import Api from './resource.js'
 import t from './utils/i18n.js'
-// import Fingerprint2 from 'fingerprintjs2';
 
-// Fingerprint2.get(
-//     { }, // 用 as any 绕过类型检查
-//     function(components) {
-//       console.log('components', components);
-//       const excludeKeys = ['screenResolution', 'colorDepth', 'availableScreenResolution'];
-//       const values = components
-//         .filter(component => !excludeKeys.includes(component.key)) // 排除多个 key
-//         .map(component => component.value)
-//         .join('###');
-//     //   const values = components.map(function (component) { return component.value }).join('###');
-//         // 生成 hash 指纹码
-//         const fingerprint = Fingerprint2.x64hash128(values, 31);
-//         console.log('fingerprint', fingerprint);
-//     }
-//   );
 type ModalConfig = {
     data: string;
     onClose?: () => void;
@@ -51,7 +35,7 @@ const CreateMessageVerifyModal = ({ props }: { props: ModalConfig }) => {
         const res = await Api.getCaptchaKey();
         const { body: key } = res.data || {};
         setCaptchaKey(key);
-        if(key) {
+        if (key) {
             const image = Api.getCaptchaImgUrl(key) as unknown;
             setCaptchaImage(image as string);
         }
@@ -72,60 +56,60 @@ const CreateMessageVerifyModal = ({ props }: { props: ModalConfig }) => {
         };
     }, [visible, countdown]);
 
-    const handleResend = async() => {
+    const handleResend = async () => {
         setCountdown(60);
-        const res = await Api.reSendCode({captchaKey, captcha: captchCode});
+        const res = await Api.reSendCode({ captchaKey, captcha: captchCode });
         console.log('handleResend=>res', res);
         message.success(t('sendSuccess', lang));
     }
-  
+
     return (
-      <Modal
-        width={420}
-        visible={visible}
-        onClose={() => {
-          setVisible(false);
-          props.onClose?.();
-        }}
-      >
-        <div style={{ fontSize: 14, color: '#666' }}>{t('alreadySend', lang, {  phone: mobile})}</div>
-        
-        <div style={{ display: 'flex', alignItems: 'center', gap: 8, marginTop: 12 }}>
-            <Input.OTP 
-                length={6} 
-                value={otp}
-                onChange={(val) => {
-                    setOtp(val);
-                    if(val.length === 6) {
-                        http.defaults.headers.common['sms-code'] = val as string;
-                        http.defaults.headers.common['sms-code-key'] = verifyCodeKey as string;
-                        http(config);
-                        setVisible(false);
-                    }
-                }} />
-            <Button
-                disabled={countdown > 0 || !captchCode}
-                onClick={handleResend}
-                style={{ padding: '8px' }}
-            >
-                {countdown > 0 ? t('countDownSecound', lang, { countdown }) : t('reSend', lang)}
-            </Button>
-        </div>
-        {countdown > 0 ? null : 
-            <div style={{ marginTop: 12, display: 'flex', alignItems: 'center' }}>
-                <Input 
-                    placeholder={t('pleaseEnterPicVerifyCode', lang)}
-                    onChange={(e) => {
-                        setCaptchCode(e as string)
-                    }}
-                    style={{ width: 300 }}
-                />
-                
-                {captchaImage && <img src={captchaImage} alt={t('verifyCode', lang)} style={{ width: 100, height: 30, marginLeft: 8 }} onClick={getKey} />}
-            </div>}
-        {(countdown > 0 || captchCode) ? null : <div style={{ fontSize: 14, color: 'red' }}>{t('pleaseEnterAndSend', lang)}</div>}
-      </Modal>
+        <Modal
+            width={420}
+            visible={visible}
+            onClose={() => {
+                setVisible(false);
+                props.onClose?.();
+            }}
+        >
+            <div style={{ fontSize: 14, color: '#666' }}>{t('alreadySend', lang, { phone: mobile })}</div>
+
+            <div style={{ display: 'flex', alignItems: 'center', gap: 8, marginTop: 12 }}>
+                <Input.OTP
+                    length={6}
+                    value={otp}
+                    onChange={(val) => {
+                        setOtp(val);
+                        if (val.length === 6) {
+                            http.defaults.headers.common['sms-code'] = val as string;
+                            http.defaults.headers.common['sms-code-key'] = verifyCodeKey as string;
+                            http(config);
+                            setVisible(false);
+                        }
+                    }} />
+                <Button
+                    disabled={countdown > 0 || !captchCode}
+                    onClick={handleResend}
+                    style={{ padding: '8px' }}
+                >
+                    {countdown > 0 ? t('countDownSecound', lang, { countdown }) : t('reSend', lang)}
+                </Button>
+            </div>
+            {countdown > 0 ? null :
+                <div style={{ marginTop: 12, display: 'flex', alignItems: 'center' }}>
+                    <Input
+                        placeholder={t('pleaseEnterPicVerifyCode', lang)}
+                        onChange={(e) => {
+                            setCaptchCode(e as string)
+                        }}
+                        style={{ width: 300 }}
+                    />
+
+                    {captchaImage && <img src={captchaImage} alt={t('verifyCode', lang)} style={{ width: 100, height: 30, marginLeft: 8 }} onClick={getKey} />}
+                </div>}
+            {(countdown > 0 || captchCode) ? null : <div style={{ fontSize: 14, color: 'red' }}>{t('pleaseEnterAndSend', lang)}</div>}
+        </Modal>
     );
-  };
+};
 
 export default CreateMessageVerifyModal;

package/vite.config.ts

@@ -8,7 +8,7 @@ export default defineConfig({
   server: {
     port: 5174, // 你的端口
     proxy: {
-      '/messageVerify': {
+      '/admin': {
         target: 'https://chidori-admin-test.yangqianguan.com',
         changeOrigin: true,
         headers: {