ChatGPT Lessons: Uploading Files to ChatGPT
Hello, everyone! Today, I’m going to show you how I created this submit file button for Chapter PT. When you click on the button, you will be prompted to upload a file, and the script will take the data of that file and submit it into ChatGPT. If it’s a large file, the script will break it into chunks and feed it into ChatGPT. Now, let’s take a look at the prompt.
In the first part of the prompt, we’re asking ChatGPT to create a button called “Submit File” and add it to an element on the webpage. We also want more information on how to design the button. Additionally, we asked ChatGPT to create another object representing the progress bar and specify its properties. Furthermore, we request ChatGPT to create an element that will receive various file formats, and if the files exceed 15,000 characters, they should be broken into chunks and submitted to ChatGPT.
A note: Chat should take a little bit over 15,000 characters at a time. However, when processing that much information, it might have a hard time digesting it, leading to less accurate results.
Moving on to the next part of the prompt, we provided some code for guidance on how to insert the information into ChatGPT. We also specified how we want the data to be submitted, including the part of the chunk being submitted and the file name. Finally, we asked ChatGPT to update the progress bar for each part it submits. Once all the data is submitted, the progress bar should turn blue.
Before we get started, here is our test file called “test.txt.” It contains a lot of code. Let’s take all the code in this file, copy it, and paste it into ChatGPT to see what happens.
As we see, we received an error message stating that the message we submitted was too long, and we need to reload the page to submit something shorter. Let’s find a solution for this. Let’s start a new chat and insert our prompt.
Now that we have our code, let’s copy it, right-click, select “Inspect,” then choose “Console.” We’ll clear any errors and paste the code inside here and hit “Enter.” This will inject the code into the webpage and add our button.
And there it is, our button. Let’s click on the “Submit File” button to see if it works, and indeed, it seems to be functioning. Now, let’s click on our “test.txt” file and load it up to see what happens.
ChatGPT loads the first 15,000 characters of the file and submits it, reflecting the progress in the progress bar. Once ChatGPT provides a summary of the data it received, it should then submit the next 15,000 characters.
It looks like the process just completed, and we received a quick summary of what it received. We can see the submitted sections and file names for each part.
Now, let’s take this code and turn it into a bookmarklet. To do this, we’ll copy the code, start a new chat session, and ask it to convert the code into a bookmarklet. Once we get the bookmarklet code, we’ll create a new bookmark in the browser using that code. The bookmarklet should add the button to the webpage.
We tested the bookmarklet, and it works as expected. Additionally, ChatGPT provided a tip on how to stop it from generating responses to speed up the process, but it may require adding a delay when clicking the stop button.
If we want to turn this into a Chrome plugin, ChatGPT provided us with the necessary files. We pasted our code into the content.js file and saved it. We then loaded the extension, and it works as intended.
Finally, ChatGPT advises that we can adjust the number of chunks fed to ChatGPT for more accuracy. If you have any questions or requests, feel free to leave them in the comments below. If you liked this content, hit the like button and subscribe. Until next time!
