fix: data structure error in redis storage adapter (#768)

* fix: redis storage adpater data error fixed

* ci: add changeset file

* test: modify test files

Author: JOU-amjs

.changeset/nine-zebras-watch.md

@@ -0,0 +1,5 @@
+---
+'@alova/storage-redis': patch
+---
+
+redis storage adpater data error fixed

examples/vue/src/api/methods.js

@@ -147,3 +147,6 @@ export const uploadFiles = ({ file, name }) => {
   formData.append(name, file);
   return alova.Post('/upload', formData);
 };
+
+// sse
+export const sseTest = () => alova.Get('https://sse.dev/test');

examples/vue/src/routes.js

@@ -220,6 +220,12 @@ export default [
         description: 'An easier way to complete serial request with useHook',
         doc: 'client/strategy/use-serial-request',
         component: () => import('./views/SerialRequest')
+      },
+      {
+        title: 'Server sent event',
+        description: 'Receive real-time data from server via SSE(Server Sent Event) protocol, with `fetch` in sse',
+        doc: 'client/strategy/use-sse',
+        component: () => import('./views/SSE')
       }
     ]
   }

examples/vue/src/views/SSE.vue

@@ -0,0 +1,27 @@
+<template>
+  <div>
+    <div>
+      {{ msgs }}
+    </div>
+    <div>{{ readyState }}</div>
+    <nord-button @click="close">Close connection</nord-button>
+  </div>
+</template>
+
+<script setup>
+import { useSSE } from 'alova/client';
+import { ref } from 'vue';
+import { sseTest } from '../api/methods';
+
+const msgs = ref([]);
+const { data, onMessage, error, readyState, close } = useSSE(sseTest, {
+  immediate: true,
+  interceptByGlobalResponded: false
+})
+  .onMessage(({ data }) => {
+    msgs.value.push(data);
+  })
+  .onError(err => {
+    console.error('SSE error', err);
+  });
+</script>

packages/client/src/hooks/sse/EventSourceFetch.ts

@@ -421,7 +421,8 @@ export default class EventSourceFetch implements EventTarget {
 
     if (this.readyState !== EventSourceFetch.CLOSED) {
       this.readyState = EventSourceFetch.CONNECTING;
-      // 如果 _reconnectTime 为 null，使用默认值 1000ms
+
+      // if _reconnectTime is null, use default value 1000ms
       const reconnectDelay = this._reconnectTime ?? 1000;
       setTimeoutFn(() => this._connect(), reconnectDelay);
     }

packages/server/src/hooks/captcha.ts

@@ -48,11 +48,13 @@ export interface CaptchaProviderOptions {
   codeSet?: CaptchaCodeSetType;
 }
 
-interface CaptchaData {
-  code: string;
-  expireTime: number;
-  resetTime: number;
-}
+type CaptchaData = [
+  {
+    code: string;
+    resetTs: number;
+  },
+  number
+];
 
 const defaultCodeChars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
 const defaultCodeLength = 4;
@@ -102,15 +104,15 @@ export const createCaptchaProvider = (options: CaptchaProviderOptions) => {
   const sendCaptcha = async (methodHandler: (code: string, key: string) => Method, { key }: { key: string }) => {
     const storeKey = getStoreKey(key);
     let now = getTime();
-    const storedData = await store.get<CaptchaData>(storeKey);
+    const [storedData, expireTs = 0] = (await store.get<CaptchaData>(storeKey)) || [];
 
     // Check if can resend
-    assert(!storedData || now >= storedData.resetTime, 'Cannot send captcha yet, please wait');
+    assert(!storedData || now >= storedData.resetTs, 'Cannot send captcha yet, please wait');
 
     // If resendFormStore is enabled and there's an unexpired captcha in storage,
     // use the stored captcha
     let code: string;
-    if (resendFormStore && storedData && now < storedData.expireTime) {
+    if (resendFormStore && storedData && now < expireTs) {
       code = storedData.code;
     } else {
       code = generateCode(codeSet);
@@ -121,12 +123,13 @@ export const createCaptchaProvider = (options: CaptchaProviderOptions) => {
 
     // Store captcha information
     now = getTime();
-    await store.set(storeKey, {
-      code,
-      expireTime: now + expireTime,
-      resetTime: now + resetTime
-    });
-
+    await store.set(storeKey, [
+      {
+        code,
+        resetTs: now + resetTime
+      },
+      now + expireTime
+    ] as CaptchaData);
     return response;
   };
 
@@ -137,9 +140,9 @@ export const createCaptchaProvider = (options: CaptchaProviderOptions) => {
    */
   const verifyCaptcha = async (code: string, key: string) => {
     const storeKey = getStoreKey(key);
-    const storedData = await store.get<CaptchaData>(storeKey);
+    const [storedData, expireTs = 0] = (await store.get<CaptchaData>(storeKey)) || [];
 
-    if (!storedData || getTime() > storedData.expireTime) {
+    if (!storedData || getTime() > expireTs) {
       await store.remove(storeKey);
       return false;
     }

packages/server/test/captcha.spec.ts

@@ -59,11 +59,11 @@ describe('captcha', () => {
 
     await sendCaptcha((code, key) => alovaInst.Post('/unit-test', { code, key }), { key: 'test' });
 
-    const storedData = await mockStorage.get('alova-captcha:test');
+    const [storedData, expireTs] = await mockStorage.get('alova-captcha:test');
     expect(storedData).toBeDefined();
     expect(storedData.code).toMatch(/^\d{4}$/);
-    expect(storedData.expireTime).toBe(currentTime + 300000);
-    expect(storedData.resetTime).toBe(currentTime + 60000);
+    expect(expireTs).toBe(currentTime + 300000);
+    expect(storedData.resetTs).toBe(currentTime + 60000);
   });
 
   test('should prevent resending within resetTime', async () => {
@@ -104,7 +104,7 @@ describe('captcha', () => {
 
     await sendCaptcha((code, key) => alovaInst.Post('/unit-test', { code, key }), { key: 'test' });
 
-    const storedData = await mockStorage.get('alova-captcha:test');
+    const [storedData] = await mockStorage.get('alova-captcha:test');
     expect(storedData.code).toMatch(/^[ABC]{4}$/);
   });
 
@@ -119,7 +119,7 @@ describe('captcha', () => {
 
     await sendCaptcha((code, key) => alovaInst.Post('/unit-test', { code, key }), { key: 'test' });
 
-    const storedData = await mockStorage.get('alova-captcha:test');
+    const [storedData] = await mockStorage.get('alova-captcha:test');
     expect(storedData.code).toMatch(/^[XYZ]{6}$/);
   });
 
@@ -131,7 +131,7 @@ describe('captcha', () => {
 
     await sendCaptcha((code, key) => alovaInst.Post('/unit-test', { code, key }), { key: 'test' });
 
-    const storedData = await mockStorage.get('alova-captcha:test');
+    const [storedData] = await mockStorage.get('alova-captcha:test');
     expect(storedData.code).toBe('1234');
   });
 

packages/storage-redis/src/RedisStorageAdapter.ts

@@ -1,3 +1,4 @@
+import { isArray, isNumber } from '@alova/shared';
 import { AlovaGlobalCacheAdapter } from 'alova';
 import Redis, { RedisOptions } from 'ioredis';
 
@@ -36,14 +37,17 @@ class RedisStorageAdapter implements AlovaGlobalCacheAdapter {
   }
 
   async set(key: string, value: any) {
-    const [data, expireTs] = value;
     const now = Date.now();
-    const dataToStore = JSON.stringify(data);
+    const redisKey = this._getKey(key);
+    let ttlArg: any[] | undefined;
+    if (isArray(value) && isNumber(value[1])) {
+      // if value is an array like [data, expireTimestamp], set the expire time according to the expireTimestamp
+      const expireTs = value[1];
+      ttlArg = ['PX', expireTs - now];
+    }
 
-    // Calculate the TTL in milliseconds
-    const ttl = expireTs - now;
-    if (ttl > 0) {
-      await this.client.set(this._getKey(key), dataToStore, 'PX', ttl);
+    if (!isArray(ttlArg) || ttlArg[1] > 0) {
+      await this.client.set(redisKey, JSON.stringify(value), ...(ttlArg || []));
     }
   }
 

packages/storage-redis/test/redis.spec.ts

@@ -1,13 +1,32 @@
 import RedisStorageAdapter from '@/RedisStorageAdapter';
+import { createAlova, queryCache } from 'alova';
+import adapterFetch from 'alova/fetch';
 import Redis from 'ioredis';
 import { Mock } from 'vitest';
 
 vi.mock('ioredis', () => {
+  const data: Record<string, string> = {};
+
   const RedisMock = vi.fn(() => ({
-    set: vi.fn().mockResolvedValue('OK'),
-    get: vi.fn().mockResolvedValue(null),
-    del: vi.fn().mockResolvedValue(1)
+    set: vi.fn((key: string, value: string) => {
+      data[key] = value;
+      return Promise.resolve('OK');
+    }),
+    get: vi.fn((key: string) => Promise.resolve(data[key] || null)),
+    del: vi.fn((key: string) => {
+      const count = key in data ? 1 : 0;
+      delete data[key];
+      return Promise.resolve(count);
+    }),
+    // 可选：添加一个清空所有数据的方法用于测试
+    flushAll: vi.fn(() => {
+      Object.keys(data).forEach(key => delete data[key]);
+      return Promise.resolve('OK');
+    }),
+    // 可选：添加一个获取所有数据的方法用于测试验证
+    getAll: vi.fn(() => Promise.resolve({ ...data }))
   }));
+
   return { default: RedisMock };
 });
 
@@ -44,7 +63,7 @@ describe('RedisStorageAdapter', () => {
 
     await adapter.set('test', [data, expireTs]);
 
-    expect(adapter.client.set).toHaveBeenCalledWith('alova:test', JSON.stringify(data), 'PX', 2000);
+    expect(adapter.client.set).toHaveBeenCalledWith('alova:test', JSON.stringify([data, expireTs]), 'PX', 2000);
     mockDate.mockRestore();
   });
 
@@ -69,7 +88,7 @@ describe('RedisStorageAdapter', () => {
   });
 
   test('get should return undefined when key does not exist', async () => {
-    const result = await adapter.get('test');
+    const result = await adapter.get('test_not_exist__');
     expect(result).toBeUndefined();
   });
 
@@ -87,4 +106,17 @@ describe('RedisStorageAdapter', () => {
     expect(adapter.client.del).not.toHaveBeenCalled();
     consoleError.mockRestore();
   });
+
+  test('name should return the adapter name', async () => {
+    const alova = createAlova({
+      baseURL: process.env.NODE_BASE_URL,
+      requestAdapter: adapterFetch(),
+      responded: response => response.json(),
+      l1Cache: new RedisStorageAdapter(mockOptions)
+    });
+
+    const method = alova.Get('/unit-test');
+    const res = await method;
+    await expect(queryCache(method)).resolves.toEqual(res);
+  });
 });