Use the new GPT-4 api to build a chatGPT chatbot for multiple Large PDF files.
Tech stack used includes LangChain, Pinecone, Typescript, Openai, and Next.js. LangChain is a framework that makes it easier to build scalable AI/LLM apps and chatbots. Pinecone is a vectorstore for storing embeddings and your PDF in text to later retrieve similar docs.
The visual guide of this repo and tutorial is in the visual guide folder.
If you run into errors, please review the troubleshooting section further down this page.
- Make sure you have installed node and yarn
Yarn installation in your terminal after installing node
npm install -g yarn
Check that both are installed.
node -v
yarn -v
Node must be at least version 18.x.x
Clone the repo
- Install packages
yarn install
You should see a node_modules folder afterwards.
- In the
configfolder, replace thePINECONE_NAME_SPACEwith anamespacewhere you'd like to store your embeddings on Pinecone when you runnpm run ingestmanually or use theapi/ingestvia uploading on the frontend. This namespace will later be used for queries and retrieval.
Set up your .env file and insert credentials
- Copy
.env.exampleinto.envYour.envfile should look like this:
OPENAI_API_KEY=
PINECONE_API_KEY=
PINECONE_ENVIRONMENT=
PINECONE_INDEX_NAME=
- Visit openai to retrieve API keys and insert into your
.envfile. - Visit pinecone to create and retrieve your API keys, and also retrieve your environment and index name from the dashboard.
This repo can load multiple PDF files
-
Inside
docsfolder, add your pdf files or folders that contain pdf files. -
Run the script
npm run ingestto 'ingest' and embed your docs. If you run into errors troubleshoot below. -
Check Pinecone dashboard to verify your namespace and vectors have been added.
You can also manually ingest other file types by adding more loaders to the DirectoryLoader
Run npm run dev to load localhost:3000, then visit the Chatbot page to chat with your docs.
If you would prefer to use the UI upload in upload page, you don't need to .env file.
First, run npm run dev to load localhost:3000, then click on Add credentials to input your key credentials. Then click Save.
Drag or upload a file into the upload area and then click upload. You should then be redirected to the chatbot.
In utils/makechain.ts chain change the QA_PROMPT prompt for your own usecase. Change modelName in OpenAI to gpt-4, if you have access gpt-4 api.
General errors
- Make sure you're running the latest Node version. Run
node -v - Make sure you're using the same versions of LangChain and Pinecone as this repo.
- Check that you've created an
.envfile that contains your valid (and working) API keys, environment and index name. - If you change
modelNameinOpenAInote that you need access togpt-4for it to work. - Make sure you have access to
gpt-4if you decide to use it. Test your openAI keys outside the repo and make sure it works and that you have enough API credits. - Your pdf file is corrupted and cannot be parsed.
Pinecone errors
- Make sure your pinecone dashboard
environmentandindexmatches the one in thepinecone.tsand.envfiles. - Check that you've set the vector dimensions to
1536. - Make sure your pinecone namespace is in lowercase.
- Pinecone indexes of users on the Starter(free) plan are deleted after 7 days of inactivity. To prevent this, send an API request to Pinecone to reset the counter.
- Retry from scratch with a new Pinecone index and cloned repo.
config/fileuploadconfig.ts: Controls to the maxfilesize and maxnumberfiles allowed per upload. These settings are preconfigured for Vercel serveless function limits.
utils/extractTextFromFiles.ts: handles the logic for 'loading' various file types.
utils/manualPDFLoader.ts: this file is used for the manual ingest process run in ingest-data.ts
utils/customPDFLoader: The PDF 'loader' that parses the uploaded files into LangChain Documents. Modify the metadata as required.
utils/formidable.ts: Responsible for parsing uploading files.
utils/makechain.ts: Logic responsible for combining question to standalone question, retrieving relevant docs and then outputting a final result. Change the OpenAIChat modelName to gpt-3.5-turbo if you don't have access to gpt-4. Modify the QA_Prompt for your use case.
utils/pinecone-client.ts: The pinecone client that takes credentials from the UI.
utils/pinecone-local-client.ts: The pinecone client that uses the credentials from the .env file.
api/ingest.ts: Api route responsible for 'ingesting' the uploaded files.
api/ingest-url.ts: Api route responsible for 'ingesting' uploaded url.
api/delete-namespace.ts: Api route responsible for delete the specified namespace from the index. Use the pinecone-local-client.ts
api/chat.ts: Api route responsible for the 'chat' process, including retrieval of relevant documents.
pages/credentials.tsx: Main page for uploading credentials from the UI.
components/FileUploadArea.tsx: The file upload drop area. Modify the accepted files here as well the number of files allowed and max file size.
public: In the public folder you can change the default images of bot and user. Make sure to change the file names in the frontend components/chat.tsx as well:
For example:
<Image
key={index}
src="/bot-image.png" //change this to your new image name in public folder
Please note that eslint and typescript errors are ignored in the next.config.js file by default. If you would like to throw errors during production build remove these configs
There are a couple of high-level options for deploying your app:
a. Deploying to a VM or container Persistent filesystem means you can save and load files from disk Always-running process means you can cache some things in memory You can support long-running requests, such as WebSockets
b. Deploying to a serverless environment No persistent filesystem means you can load files from disk, but not save them for later Cold start means you can't cache things in memory and expect them to be cached between requests Function timeouts mean you can't support long-running requests, such as WebSockets Some other considerations include:
Options: