tiktok-live-api 1.2.10 → 1.2.12

package/bin/demo.mjs

@@ -15,9 +15,9 @@ const REACT_TEMPLATE = [
   "",
   "export default function TikTokLiveComponent() {",
   "  const [events, setEvents] = useState([]);",
-  "  const [username, setUsername] = useState('aljazeeraenglish');",
+  "  const [username, setUsername] = useState('gbnews');",
   "  const [apiKey, setApiKey] = useState('demo_tiktokliveapi_public_2026');",
-  "  const [inputUsername, setInputUsername] = useState('aljazeeraenglish');",
+  "  const [inputUsername, setInputUsername] = useState('gbnews');",
   "  const [connected, setConnected] = useState(false);",
   "  const clientRef = useRef(null);",
   "",
@@ -59,7 +59,7 @@ const REACT_TEMPLATE = [
   "        <form onSubmit={handleConnect} style={{ display: 'flex', flexDirection: 'column', gap: '16px', marginBottom: '24px' }}>",
   "          <div>",
   "            <label style={{ display: 'block', fontSize: '0.875rem', fontWeight: 500, marginBottom: '6px' }}>TikTok Username</label>",
-  "            <input type=\"text\" value={inputUsername} onChange={(e) => setInputUsername(e.target.value)} style={{ width: '100%', padding: '8px 12px', borderRadius: '6px', border: '1px solid #d1d5db', boxSizing: 'border-box' }} placeholder=\"e.g. aljazeeraenglish\" />",
+  "            <input type=\"text\" value={inputUsername} onChange={(e) => setInputUsername(e.target.value)} style={{ width: '100%', padding: '8px 12px', borderRadius: '6px', border: '1px solid #d1d5db', boxSizing: 'border-box' }} placeholder=\"e.g. gbnews\" />",
   "          </div>",
   "          <div>",
   "            <label style={{ display: 'block', fontSize: '0.875rem', fontWeight: 500, marginBottom: '6px' }}>API Key</label>",
@@ -95,7 +95,7 @@ const VUE_TEMPLATE = [
   '      <form @submit.prevent="handleConnect" style="display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px">',
   "        <div>",
   '          <label style="display: block; font-size: 0.875rem; font-weight: 500; margin-bottom: 6px">TikTok Username</label>',
-  '          <input type="text" v-model="inputUsername" style="width: 100%; padding: 8px 12px; border-radius: 6px; border: 1px solid #d1d5db; box-sizing: border-box" placeholder="e.g. aljazeeraenglish" />',
+  '          <input type="text" v-model="inputUsername" style="width: 100%; padding: 8px 12px; border-radius: 6px; border: 1px solid #d1d5db; box-sizing: border-box" placeholder="e.g. gbnews" />',
   "        </div>",
   "        <div>",
   '          <label style="display: block; font-size: 0.875rem; font-weight: 500; margin-bottom: 6px">API Key</label>',
@@ -119,52 +119,52 @@ const VUE_TEMPLATE = [
   "</template>",
   "",
   "<script setup>",
-  "import { ref, watch, onMounted } from 'vue'",
+  "import { ref, onMounted, onUnmounted } from 'vue'",
   "",
-  "const inputUsername = ref('aljazeeraenglish')",
-  "const activeUsername = ref('aljazeeraenglish')",
+  "const inputUsername = ref('gbnews')",
+  "const activeUsername = ref('gbnews')",
   "const apiKey = ref('demo_tiktokliveapi_public_2026')",
+  "const connected = ref(false)",
   "const events = ref([])",
+  "let ws = null",
   "",
-  "let hook = null;",
-  "try { if (typeof useTikTokLive !== 'undefined') hook = useTikTokLive; } catch (e) { }",
-  "const tiktok = hook ? hook(activeUsername, { apiKey, autoConnect: false }) : { connected: ref(false), allEvents: ref([]) }",
-  "const connected = tiktok.connected",
-  "",
-  "watch(() => tiktok.allEvents.value, (all) => {",
-  "  if (all && all.length) {",
-  "    const last = all[all.length - 1];",
-  "    if (last.type === 'chat') addEvent(`💬 ${last.data.user.uniqueId}: ${last.data.comment}`)",
-  "    if (last.type === 'gift') addEvent(`🎁 ${last.data.user.uniqueId} sent ${last.data.giftName}`)",
-  "    if (last.type === 'like') addEvent(`❤️ ${last.data.user.uniqueId} liked`)",
-  "    if (last.type === 'member') addEvent(`👋 ${last.data.user.uniqueId} joined`)",
-  "    if (last.type === 'connected') addEvent('✅ Connected successfully!')",
-  "    if (last.type === 'disconnected') addEvent('❌ Disconnected from stream.')",
-  "  }",
-  "}, { deep: true })",
-  "",
-  "watch(() => tiktok.error ? tiktok.error.value : null, (e) => {",
-  "  if(e) addEvent('⚠️ Error: ' + e)",
-  "})",
-  "",
-  "const addEvent = (str) => {",
+  "function addEvent(str) {",
   "  events.value.push(str)",
-  "  if(events.value.length > 50) events.value.shift()",
+  "  if (events.value.length > 50) events.value.shift()",
   "}",
   "",
-  "const handleConnect = () => {",
-  "  if (tiktok.disconnect) tiktok.disconnect()",
+  "function connectStream() {",
+  "  if (ws) { ws.close(); ws = null }",
   "  events.value = []",
+  "  connected.value = false",
   "  activeUsername.value = inputUsername.value",
-  "  if (!activeUsername.value) return",
-  "  if (tiktok.connect) {",
-  "    tiktok.connect().catch(e => addEvent('⚠️ Failed: ' + e.message))",
+  "  const user = (activeUsername.value || '').replace(/^@/, '')",
+  "  if (!user) return",
+  "  const key = apiKey.value || ''",
+  "  try {",
+  "    ws = new WebSocket('wss://api.tik.tools?uniqueId=' + user + '&apiKey=' + key)",
+  "  } catch (e) { addEvent('⚠️ Connection failed: ' + e.message); return }",
+  "  ws.onopen = () => { connected.value = true; addEvent('✅ Connected to @' + user) }",
+  "  ws.onclose = () => { connected.value = false; ws = null; addEvent('❌ Disconnected') }",
+  "  ws.onerror = () => { addEvent('⚠️ WebSocket error') }",
+  "  ws.onmessage = (evt) => {",
+  "    try {",
+  "      const msg = JSON.parse(evt.data)",
+  "      const t = msg.event || ''",
+  "      const d = msg.data || {}",
+  "      const u = d.user ? d.user.uniqueId : ''",
+  "      if (t === 'chat') addEvent('💬 ' + u + ': ' + d.comment)",
+  "      else if (t === 'gift') addEvent('🎁 ' + u + ' sent ' + (d.giftName || 'a gift'))",
+  "      else if (t === 'like') addEvent('❤️ ' + u + ' liked')",
+  "      else if (t === 'member') addEvent('👋 ' + u + ' joined')",
+  "    } catch (e) {}",
   "  }",
   "}",
   "",
-  "onMounted(() => {",
-  "  handleConnect()",
-  "})",
+  "const handleConnect = () => { connectStream() }",
+  "",
+  "onMounted(() => { connectStream() })",
+  "onUnmounted(() => { if (ws) ws.close() })",
   "</script>"
 ].join('\n') + "\n";
 
@@ -260,10 +260,6 @@ function runScaffold(choice, targetDir, pm) {
     }
 
     if (isNuxt) {
-      console.log("\\n  " + B + "📦 Installing " + C.cyan + "tiktok-live-nuxt" + B + " Module..." + R + "\\n");
-      const nuxtInstallCmd = pm === 'npm' ? 'npm install tiktok-live-nuxt' : pm === 'yarn' ? 'yarn add tiktok-live-nuxt' : pm === 'pnpm' ? 'pnpm add tiktok-live-nuxt' : 'bun add tiktok-live-nuxt';
-      execSync(nuxtInstallCmd, { cwd: fullPath, stdio: 'inherit' });
-
       const isNuxt4 = fs.existsSync(path.join(fullPath, 'app', 'app.vue')) || !fs.existsSync(path.join(fullPath, 'app.vue'));
       const baseApp = isNuxt4 ? path.join(fullPath, 'app') : fullPath;
 
@@ -275,19 +271,12 @@ function runScaffold(choice, targetDir, pm) {
       fs.writeFileSync(appVue, [
         '<template>',
         '  <main style="min-height: 100vh; background: #f9fafb; padding-top: 40px;">',
-        '    <TikTokLive />',
+        '    <ClientOnly>',
+        '      <TikTokLive />',
+        '    </ClientOnly>',
         '  </main>',
         '</template>'
       ].join('\n') + '\n');
-
-      const nuxtConfig = path.join(fullPath, 'nuxt.config.ts');
-      if (fs.existsSync(nuxtConfig)) {
-        let config = fs.readFileSync(nuxtConfig, 'utf8');
-        if (config.includes('defineNuxtConfig({')) {
-          config = config.replace('defineNuxtConfig({', "defineNuxtConfig({\n  modules: ['tiktok-live-nuxt'],\n");
-          fs.writeFileSync(nuxtConfig, config);
-        }
-      }
     } else {
       console.log("\\n  " + B + "📦 Installing " + C.cyan + "tiktok-live-api" + B + " SDK..." + R + "\\n");
       execSync(installCmd, { cwd: fullPath, stdio: 'inherit' });
@@ -353,7 +342,7 @@ async function runDemo() {
   const WS_BASE = 'wss://api.tik.tools';
   const DEMO_KEY = 'demo_tiktokliveapi_public_2026';
   const CHANNELS = [
-    'aljazeeraenglish', 'cgtnofficial', 'france24_en',
+    'gbnews', 'cgtnofficial', 'france24_en',
     'weathernewslive', 'gbnews', 'bbcnews',
     'skynews', 'tv_asahi_news', 'abc7chicago', 'thairath_news',
   ];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tiktok-live-api",
-  "version": "1.2.10",
+  "version": "1.2.12",
   "description": "Unofficial TikTok LIVE API Client — Real-time chat, gifts, viewers, battles, and AI live captions from any TikTok livestream. Managed WebSocket API with 99.9% uptime.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",