01
Ffin cleient fach
Marciwch y modiwl sgwrsio rhyngweithiol yn unig gyda use client yn lle symud tudalen neu gynllun cyfan i'r porwr.
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
xBle 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.
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.
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.
- 1Gosodwch y pecyn npm a ffurfweddwch allwedd gyhoeddus wedi'i chyfyngu i darddleoedd.
- 2Crëwch gydran use client sy'n rheoli cyflwr negeseuon a sgyrsiau.
- 3Cyflwynwch y gydran o'ch tudalen wedi'i rendro ar y gweinydd heb droi'r llwybr cyfan yn gydran cleient.
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>;
}Archwiliwch nesaf
Mwy o ffyrdd i ddefnyddio ChattyBox
01
SDK sgwrsfot JavaScript
Adolygwch y pecyn sylfaenol a ffin y seilwaith a reolir.
Agored
02
SDK sgwrsfot React
Gweler patrymau cydrannau a chyflwr sy'n gyffredin i gymwysiadau React.
Agored
03
Cyfeirnod API yr SDK
Adolygwch feysydd ymateb, sgyrsiau dilynol a gwallau.
Agored
04
Teclyn Next.js lletyol
Defnyddiwch next/script a rhyngwyneb y teclyn a gynhelir ar gyfer profiad sgwrsio parod.
Agored
Cwestiynau cyffredin
Cwestiynau cyffredin
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.
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.
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.
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.