Neidio i'r prif gynnwys
SDK Sgwrsfot Next.js

Ychwanegwch sgwrsfot AI personol at integreiddiad Next.js

Defnyddiwch @openstaticfish/chattybox o fewn ffin cleient benodol tra bo gweddill eich cymhwysiad App Router yn aros wedi'i rendro ar y gweinydd. Mae ChattyBox yn ymdrin ag adalw, dyfyniadau, sgyrsiau a graddio.

Crawls tudalennau dogfennau cyhoeddedig
Atebion ffynhonnell
Mewnosod gydag un sgript
Nid oes angen mudo dogfennau
Nid oes angen cerdyn credydMae eich cynnwys yn parhau'n eiddo i chi
Gofynnwch i ChattyBox
x
Ble ddylwn i ddechrau os oes angen ateb dibynadwy arnaf o'r wefan hon?
Dechreuwch trwy ychwanegu URL eich gwefan at ChattyBox. Mae'n cropian eich cynnwys, yn ateb o'r tudalennau y mae'n dod o hyd iddynt, ac yn dangos i ymwelwyr y ffynonellau y tu ôl i bob ymateb.
iFfynonellau3^
Platfform Next.js canllaw
chattybox.ai
Dadansoddeg
chattybox.ai
Cartref
chattybox.ai
Gofynnwch gwestiwn...
Wedi'i bweru gan ChattyBox
Adeiladwyd ar gyfer Timau Next.js App Router

Lansio chatbot a ddyfynnwyd yn ffynhonnell heb ailadeiladu eich pentwr dogfennau

Mae ChattyBox yn cropian eich dogfennaeth bresennol, yn mynegeio'r cynnwys i'w adalw, ac yn mewnosod chatbot sy'n ateb gan ddefnyddio'ch docs yn lle cof model generig.

Cadwch yr arwyneb sgwrsio rhyngweithiol mewn ffin use client fach.
Datgelwch allwedd teclyn gyhoeddus wedi'i chyfyngu i darddleoedd yn unig drwy newidynnau NEXT_PUBLIC.
Cyflwynwch atebion â dyfyniadau gyda'ch system ddylunio Next.js a chragen cymhwysiad bresennol.
Gadewch i ChattyBox reoli cropian, adalw, storio fectorau, cynhyrchu atebion a graddio.
Cam llif gwaith

Gosodwch @openstaticfish/chattybox yn y cymhwysiad Next.js.

Cam llif gwaith

Ychwanegwch allwedd API gyhoeddus y teclyn ac URL yr API fel newidynnau amgylchedd NEXT_PUBLIC.

Cam llif gwaith

Crëwch gydran cleient ar gyfer cyflwr y sgwrs a rhyngweithio'r porwr.

Cam llif gwaith

Mewnforiwch y gydran cleient honno o dudalen neu gynllun Cydran Gweinydd.

Lansiad tri cham

Gludwch eich URL Platfform Next.js, profwch yr atebion a ddyfynnir, yna gosodwch y teclyn.

Adeiladwch sgwrsfot Next.js
Integreiddio App Router

Ychwanegwch ryngweithio heb ildio rendro ar y gweinydd

Cadwch yr SDK ar ymyl y cleient lle mae'r sgwrs yn digwydd a chadwch Gydrannau Gweinydd ar gyfer gweddill y cymhwysiad.

01

Ffin cleient fach

Marciwch y modiwl sgwrsio rhyngweithiol yn unig gyda use client yn lle symud tudalen neu gynllun cyfan i'r porwr.

02

Eglurder allwedd gyhoeddus

Defnyddiwch allwedd prosiect sy'n ddiogel i'r porwr gyda tharddleoedd a ganiateir; peidiwch byth â datgelu manylion rheoli drwy newidynnau NEXT_PUBLIC.

03

Rhyngwyneb cynnyrch personol

Cyflwynwch negeseuon a dyfyniadau yn eich llywio, ardal cyfrif, cragen ddogfennau neu lif gwaith cymorth eich hun.

04

Dim gwasanaeth RAG personol

Peidiwch ag ychwanegu route handlers dim ond i ddirprwyo API porwr a reolir oni bai bod gan eich cynnyrch angen penodol ar ochr y gweinydd.

Gosod llwybr

Crëwch gleient sgwrsio Next.js App Router

Mae'r SDK yn defnyddio fetch a manylion prosiect sy'n weladwy i'r porwr, felly cychwynnwch ef mewn modiwl cleient. Peidiwch â rhoi cyfrinachau nac APIs rheoli mewn newidynnau NEXT_PUBLIC.

  1. 1Gosodwch y pecyn npm a ffurfweddwch allwedd gyhoeddus wedi'i chyfyngu i darddleoedd.
  2. 2Crëwch gydran use client sy'n rheoli cyflwr negeseuon a sgyrsiau.
  3. 3Cyflwynwch y gydran o'ch tudalen wedi'i rendro ar y gweinydd heb droi'r llwybr cyfan yn gydran cleient.
Adeiladwch sgwrsfot Next.js
app/components/chat.tsx
tsx
'use client';

import { useState } from 'react';
import { Chattybox } from '@openstaticfish/chattybox';

const chattybox = new Chattybox({
  apiKey: process.env.NEXT_PUBLIC_CHATTYBOX_API_KEY!,
  baseUrl: process.env.NEXT_PUBLIC_CHATTYBOX_API_URL!,
});

export function Chat() {
  const [answer, setAnswer] = useState('');

  async function ask(message: string) {
    const response = await chattybox.sendMessage({ message });
    setAnswer(response.message);
  }

  return <div aria-live="polite">{answer}</div>;
}
Cwestiynau cyffredin

Cwestiynau cyffredin

1

A yw SDK ChattyBox yn gweithio gydag App Router Next.js?

Ydy. Defnyddiwch ef mewn cydran cleient ar gyfer cyflwr sgwrsio rhyngweithiol a chyflwynwch y gydran honno o dudalen neu gynllun App Router.

2

A oes angen route handler Next.js arnaf ar gyfer ChattyBox?

Nac oes ar gyfer yr integreiddiad porwr arferol. Mae allweddi teclyn cyhoeddus wedi'u cynllunio ar gyfer defnydd cleient a gellir eu cyfyngu i darddleoedd cymeradwy.

3

A yw allweddi ChattyBox NEXT_PUBLIC yn gyfrinachau?

Mae allwedd gyhoeddus y teclyn yn adnabod prosiect ond nid yw'n fanylyn rheoli. Cyfyngwch hi i'ch tarddleoedd cynhyrchu a rhagolwg, a pheidiwch byth â datgelu cyfrinachau gweinyddol.

4

A allaf ddefnyddio teclyn lletyol ChattyBox gyda Next.js?

Gallwch. Mae'r canllaw gosod lletyol yn dangos y llwybr next/script pan fyddwch yn dewis rhyngwyneb a gynhelir yn lle rhyngwyneb SDK personol.

Dechreuwch am ddim

Nid oes angen cerdyn credyd. Ni ddefnyddir eich cynnwys i hyfforddi modelau.

Creu chatbot am ddim

Haen am ddim. Dim angen cerdyn.