Initial commit

2025-07-31 17:05:07 +08:00
parent 8fab3b19cc
commit 24f21144ab
91 changed files with 16311 additions and 159 deletions
--- a/app/debug/s3-test/page.tsx
+++ b/app/debug/s3-test/page.tsx
@ -0,0 +1,130 @@
+"use client";
+
+import { useState } from "react";
+import AudioPlayer from "@/components/AudioPlayer";
+
+export default function S3TestPage() {
+  const [testUrl, setTestUrl] = useState("");
+  const [result, setResult] = useState<any>(null);
+  const [loading, setLoading] = useState(false);
+  const [showAudioPlayer, setShowAudioPlayer] = useState(false);
+
+  const testS3Access = async () => {
+    if (!testUrl) return;
+
+    setLoading(true);
+    try {
+      const response = await fetch(testUrl, {
+        method: "HEAD",
+      });
+
+      setResult({
+        status: response.status,
+        statusText: response.statusText,
+        headers: Object.fromEntries(response.headers.entries()),
+        accessible: response.ok,
+      });
+
+      if (response.ok) {
+        setShowAudioPlayer(true);
+      }
+    } catch (error) {
+      setResult({
+        error: error instanceof Error ? error.message : "未知错误",
+        accessible: false,
+      });
+      setShowAudioPlayer(false);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const testAudioPlayback = async () => {
+    if (!testUrl) return;
+
+    setLoading(true);
+    try {
+      const response = await fetch(testUrl);
+      const blob = await response.blob();
+
+      setResult({
+        ...result,
+        audioTest: {
+          blobSize: blob.size,
+          blobType: blob.type,
+          accessible: true,
+        },
+      });
+    } catch (error) {
+      setResult({
+        ...result,
+        audioTest: {
+          error: error instanceof Error ? error.message : "未知错误",
+          accessible: false,
+        },
+      });
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className="container mx-auto p-6 max-w-4xl">
+      <h1 className="text-2xl font-bold mb-6">S3 文件访问测试</h1>
+
+      <div className="space-y-4">
+        <div>
+          <label className="block text-sm font-medium mb-2">S3 文件 URL:</label>
+          <input
+            type="text"
+            value={testUrl}
+            onChange={(e) => setTestUrl(e.target.value)}
+            placeholder="https://your-bucket.s3.region.amazonaws.com/path/to/file.webm"
+            className="w-full p-3 border border-gray-300 rounded-lg dark:bg-gray-700 dark:border-gray-600"
+          />
+        </div>
+
+        <div className="flex gap-2">
+          <button
+            onClick={testS3Access}
+            disabled={loading || !testUrl}
+            className="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 disabled:opacity-50"
+          >
+            {loading ? "测试中..." : "测试访问"}
+          </button>
+
+          {result?.accessible && (
+            <button
+              onClick={testAudioPlayback}
+              disabled={loading}
+              className="px-4 py-2 bg-green-500 text-white rounded-lg hover:bg-green-600 disabled:opacity-50"
+            >
+              {loading ? "测试中..." : "测试音频播放"}
+            </button>
+          )}
+        </div>
+
+        {result && (
+          <div className="mt-6 p-4 bg-gray-100 dark:bg-gray-800 rounded-lg">
+            <h3 className="font-semibold mb-2">测试结果:</h3>
+            <pre className="text-sm overflow-auto">
+              {JSON.stringify(result, null, 2)}
+            </pre>
+          </div>
+        )}
+
+        {showAudioPlayer && testUrl && (
+          <div className="mt-6 p-4 bg-gray-100 dark:bg-gray-800 rounded-lg">
+            <h3 className="font-semibold mb-4">音频播放器测试:</h3>
+            <AudioPlayer
+              src={testUrl}
+              title="S3 测试音频"
+              duration={0}
+              recordingId="test-id"
+            />
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}