Skip to content

การตั้งค่า

ใช้หน้านี้สำหรับการตั้งค่า Web SDK เบื้องต้น @sorisdk/web-audio ทำงานใน เบราว์เซอร์ โดยความแตกต่างหลักคือคุณจะติดตั้งผ่านตัวจัดการแพ็กเกจ หรือจะใช้ ชุดสคริปต์แบบสแตนด์อโลนในภายหลัง

ขณะนี้ Web SDK อยู่ในสถานะ เบต้า ดังนั้นรายละเอียดการตั้งค่าอาจเปลี่ยนแปลง ตามการพัฒนาของแพ็กเกจ

การตั้งค่าด้วยตัวจัดการแพ็กเกจ

bash
npm install @sorisdk/web-audio
bash
yarn add @sorisdk/web-audio
bash
pnpm add @sorisdk/web-audio
bash
bun add @sorisdk/web-audio

ตัวโหลด Wasm สำหรับแอปที่ใช้เฟรมเวิร์ก

หากคุณใช้เฟรมเวิร์กที่ทำงานบน Vite เช่น React, Vue, Svelte หรือ Nuxt ให้เพิ่ม vite-plugin-wasm และลงทะเบียน wasm() ในการกำหนดค่าของเฟรมเวิร์ก

bash
npm install -D vite-plugin-wasm
ts
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import wasm from "vite-plugin-wasm";

export default defineConfig({
  plugins: [react(), wasm()]
});
ts
import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import wasm from "vite-plugin-wasm";

export default defineConfig({
  plugins: [vue(), wasm()]
});
ts
import { defineConfig } from "vite";
import { svelte } from "@sveltejs/vite-plugin-svelte";
import wasm from "vite-plugin-wasm";

export default defineConfig({
  plugins: [svelte(), wasm()]
});
ts
import wasm from "vite-plugin-wasm";

export default defineNuxtConfig({
  vite: {
    plugins: [wasm()]
  }
});

การตั้งค่าเบราว์เซอร์ขั้นต่ำ

ts
import { AudioRecognizer } from "@sorisdk/web-audio";

const recognizer = new AudioRecognizer({
  appId: "YOUR_APP_ID",
  ephemeralKey: async () => {
    const response = await fetch("/api/ephemeral-key", {
      method: "POST"
    });

    if (!response.ok) {
      throw new Error(`Ephemeral key request failed: HTTP ${response.status}`);
    }

    const { ephemeral_key } = await response.json();
    return ephemeral_key;
  }
});

recognizer.on("campaign", (event) => {
  console.log(event.campaign);
});

await recognizer.start();

ดูรูปแบบการออกและส่งต่อคีย์ได้ที่ คีย์ชั่วคราว

หมายเหตุ

  • @sorisdk/web-audio ต้องทำงานในโค้ดฝั่งเบราว์เซอร์ ไม่ใช่ในรันไทม์ Node.js
  • โดยทั่วไป แอป Node.js ใช้สำหรับการติดตั้ง การบันเดิล SSR และตรรกะการส่งต่อที่เป็นทางเลือก
  • AudioRecognizer จัดการพื้นที่จัดเก็บเซสชันและการแคชแพ็กภายใน
  • รูปแบบที่แนะนำคือส่ง ephemeralKey เป็นสตริงหรือตัวจัดการแบบอะซิงโครนัส
  • แอปเฟรมเวิร์กที่ทำงานบน Vite ควรกำหนดค่า vite-plugin-wasm ก่อนนำเข้า SDK

แท็กสคริปต์แบบสแตนด์อโลน

เร็ว ๆ นี้