diff --git a/src/pages/playground/speech/hooks/use-non-stream-stt.ts b/src/pages/playground/speech/hooks/use-non-stream-stt.ts
index 7db28061..56ee857a 100644
--- a/src/pages/playground/speech/hooks/use-non-stream-stt.ts
+++ b/src/pages/playground/speech/hooks/use-non-stream-stt.ts
@@ -1,3 +1,4 @@
+import axios from 'axios';
 import { useCallback, useRef, useState } from 'react';
 import { speechToText } from '../../apis';
 import { extractErrorMessage } from '../../config';
@@ -52,15 +53,19 @@ export const useNonStreamSTT = (params?: UseNonStreamSTTParams) => {
         params?.onSuccess?.(result);
         return result;
       } catch (err: any) {
-        const res = err?.response?.data;
-        if (res?.error || (res?.status_code && res?.status_code !== 200)) {
-          const errorMessage = extractErrorMessage(res);
-          setError({
-            error: true,
-            errorMessage
-          });
-          params?.onError?.(errorMessage);
+        if (axios.isCancel(err)) {
+          return null;
         }
+        const res = err?.response?.data;
+        const errorMessage =
+          res?.error || (res?.status_code && res?.status_code !== 200)
+            ? extractErrorMessage(res)
+            : err?.response?.statusText || err?.message || 'Request failed';
+        setError({
+          error: true,
+          errorMessage
+        });
+        params?.onError?.(errorMessage);
         return null;
       } finally {
         setLoading(false);
diff --git a/src/pages/playground/speech/hooks/use-stream-stt.ts b/src/pages/playground/speech/hooks/use-stream-stt.ts
index e5d9305c..c1860f7e 100644
--- a/src/pages/playground/speech/hooks/use-stream-stt.ts
+++ b/src/pages/playground/speech/hooks/use-stream-stt.ts
@@ -52,7 +52,7 @@ export const useStreamSTT = (params?: UseStreamSTTParams) => {
         });
 
         if ('error' in result) {
-          const errorMessage = extractErrorMessage(result.data);
+          const errorMessage = extractErrorMessage(result);
           setError({
             error: true,
             errorMessage
diff --git a/src/pages/playground/speech/hooks/use-stream-tts.ts b/src/pages/playground/speech/hooks/use-stream-tts.ts
index 667bd5cc..333cbe94 100644
--- a/src/pages/playground/speech/hooks/use-stream-tts.ts
+++ b/src/pages/playground/speech/hooks/use-stream-tts.ts
@@ -220,7 +220,7 @@ export const useStreamTTS = (params?: UseStreamTTSParams) => {
       });
 
       if ('error' in result) {
-        const errorMessage = extractErrorMessage(result.data);
+        const errorMessage = extractErrorMessage(result);
         setError({
           error: true,
           errorMessage
diff --git a/src/pages/playground/speech/stt.tsx b/src/pages/playground/speech/stt.tsx
index 5ea5b7f0..5f63121e 100644
--- a/src/pages/playground/speech/stt.tsx
+++ b/src/pages/playground/speech/stt.tsx
@@ -103,7 +103,7 @@ const GroundSTT: React.FC<MessageProps> = forwardRef((props, ref) => {
     onError: (error) => {
       setTokenResult({
         error: true,
-        errorMessage: error
+        errorMessage: error?.message || _.toString(error)
       });
     }
   });