├── ChatGPT_API.app ├── For_Chrome_browser.app ├── LICENSE.md ├── README.md ├── img ├── demo_ui.png ├── demo_ui2.jpg ├── demo_ui_updated_5Mar2023.jpg └── ui_13Mar2023.jpg └── ui.py /ChatGPT_API.app: -------------------------------------------------------------------------------- 1 | tell application "Terminal" 2 | do script "python3 /PATH/TO/ui.py" without waiting 3 | end tell 4 | 5 | delay 3 -- wait for 3 seconds 6 | 7 | tell application "System Events" 8 | set isRunning to (count of (every process whose name is "Safari")) > 0 9 | end tell 10 | 11 | if isRunning then 12 | tell application "Safari" 13 | activate 14 | tell window 1 to set current tab to (make new tab with properties {URL:"http://127.0.0.1:7860"}) 15 | end tell 16 | else 17 | tell application "Safari" 18 | activate 19 | open location "http://127.0.0.1:7860" 20 | end tell 21 | end if 22 | -------------------------------------------------------------------------------- /For_Chrome_browser.app: -------------------------------------------------------------------------------- 1 | tell application "Terminal" 2 | do script "python3 /PATH/TO/ui.py" without waiting 3 | end tell 4 | 5 | delay 3 -- wait for 3 seconds 6 | 7 | tell application "System Events" 8 | set isRunning to (count of (every process whose name is "Google Chrome")) > 0 9 | end tell 10 | 11 | if isRunning then 12 | tell application "Google Chrome" 13 | activate 14 | if (count of windows) > 0 then 15 | tell window 1 to make new tab with properties {URL:"http://127.0.0.1:7860"} 16 | else 17 | open location "http://127.0.0.1:7860" 18 | end if 19 | end tell 20 | else 21 | tell application "Google Chrome" 22 | activate 23 | open location "http://127.0.0.1:7860" 24 | end tell 25 | end if 26 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2023 ez61 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![New ui 13Mar2023](/img/ui_13Mar2023.jpg) 2 | 3 | # chatgpt_API_web 4 | Use ChatGPT API on the web 5 | 6 | Built my own web version of ChatGPT using its API, together with the latest (as of 03 March 2023) **gpt-3.5-turbo** model, on a Mac. 7 | Special thanks to **[OpsConfig](https://github.com/OpsConfig/OpenAI_Lab/tree/main/chatgpt)**, his demo code provides a foundation of this repository. 8 | 9 | ## Update history 10 | #### 13 March 2023 11 | - New & improved UI. 12 | ![New ui 13Mar2023](/img/ui_13Mar2023.jpg) 13 | 14 | #### 10 March 2023: 15 | - Now supports **Google Chrome** and **Brave Browser** if you are not using **Safari** browser as I initially built. Please check [For_Chrome_browser.app](https://github.com/ez61/chatgpt_API_web/blob/main/For_Chrome_browser.app) for **Google Chrome** browser users, or if you're using **Brave Browser**, just get the same file for Chrome, and replace **Google Chrome** with **Brave Browser** in the .app file. 16 | - Also when running the .app script, it will check if your preferred browser is active. If not, it will activate your chosen browser, go to the specified URL such as `http://127.0.0.1:7860`, and bring the UI to the front. 17 | 18 | #### 5 March 2023 19 | - Added a **Tokens Used** textbox on the right, to show the tokens consumed for this chat. 20 | ![demo of updated ui](/img/demo_ui_updated_5Mar2023.jpg) 21 | 22 | 23 | ## Ready to roll? 24 | 25 | #### Requirement 26 | - Installation of **[openai](https://pypi.org/project/openai/)** and **[gradio](https://pypi.org/project/gradio/)** 27 | - Mac (to use the **Script Editor** to build a **launcher** which actually opens the chat UI in a browser tab) 28 | - OpenAI **API key** 29 | 30 | 31 | #### Steps 32 | 33 | 1. Download `ui.py` to your computer, and **Replace** the text `Your API key here` with your own API key. 34 | 2. Open **Script Editor** on your Mac, `copy` the code from either `ChatGPT_API.app` (for *Safari browser*) or `For_Chrome_browser.app` (for *Google Chrome*), and paste it into your **Script Editor** 35 | 3. Update the `PATH/TO/ui.py` to the actual file path on your computer, then *Save* and choose `application` under *File format*. Your saved file will have a `.app` suffix. 36 | 4. Double-click on the newly created `.app` file and your chat UI will start. 37 | 38 | Sit back and enjoy! 39 | 40 | 41 | ## FAQ 42 | 43 | ##### 1. Can I still use this if I'm using Windows? 44 | 45 | The `ui.py` can still be used on Windows if you're using Jupyter Notebook. However, the `.app` files for either Safari or Chrome browsers are built for Mac OS users. Here, the `.app` file works as a **launcher** or **wrapper** to start your chat UI without the need to type code in the Terminal every time. 46 | 47 | ##### 2. What is URL used in the `.app` file? 48 | 49 | The default URL is `http://127.0.0.1:7860`. The first time you start your **launcher** your chat UI will be on the default URL. If you have an active chat UI, and you start the second chat UI, the URL will be different, e.g. with port 7861 etc. If you want to find out, head to your Terminal and you will see the URL. 50 | 51 | ##### 3. What if I'm using Brave Browser? 52 | 53 | Refer to **Update history** on 10 March 2023 listed above. 54 | 55 | ##### 4. My chat UI page cannot be reached? 56 | 57 | Refresh the page and you will be okay to go. This is because in the `.app` file, we first execute the `ui.py` file to prepare the running environment before the chat UI page can be shown correctly. If you are seeing this error in Safari, don't panic, refresh the page will fix this. If you're using Google Chrome or Brave Browser, the page will be automatically refreshed. -------------------------------------------------------------------------------- /img/demo_ui.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ez61/chatgpt_API_web/c1c064afe530f4a3f3c494854328c93a8d50032f/img/demo_ui.png -------------------------------------------------------------------------------- /img/demo_ui2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ez61/chatgpt_API_web/c1c064afe530f4a3f3c494854328c93a8d50032f/img/demo_ui2.jpg -------------------------------------------------------------------------------- /img/demo_ui_updated_5Mar2023.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ez61/chatgpt_API_web/c1c064afe530f4a3f3c494854328c93a8d50032f/img/demo_ui_updated_5Mar2023.jpg -------------------------------------------------------------------------------- /img/ui_13Mar2023.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ez61/chatgpt_API_web/c1c064afe530f4a3f3c494854328c93a8d50032f/img/ui_13Mar2023.jpg -------------------------------------------------------------------------------- /ui.py: -------------------------------------------------------------------------------- 1 | import openai 2 | import gradio as gr 3 | 4 | openai.api_key = "Your API key here" 5 | 6 | conversation=[{"role": "system", "content": "Here is our full conversation in case you need:"}] 7 | 8 | def format_message(message): 9 | role = message["role"] 10 | content = message["content"] 11 | if role == "system": 12 | return f'

Here is our Full Chat History in case you need:

' 13 | elif role == "user": 14 | return f'
{content}
' 15 | elif role == "assistant": 16 | return f'

{content}

' 17 | 18 | 19 | def chatbot(query): 20 | conversation.append({"role": "user", "content": query}) 21 | response = openai.ChatCompletion.create( 22 | model="gpt-3.5-turbo", 23 | messages = conversation, 24 | temperature=0.7, 25 | max_tokens=256, 26 | top_p=1, 27 | ) 28 | conversation.append({"role": "assistant", "content": response['choices'][0]['message']['content']}) 29 | return response['usage']['total_tokens'],response['choices'][0]['message']['content'], "\n\n".join([format_message(c) for c in conversation]) 30 | 31 | 32 | 33 | with gr.Blocks() as demo: 34 | 35 | gr.Markdown('') 36 | gr.Markdown("#### G'day") 37 | gr.Markdown("I'm your **Chat Assistant**, ask me any question") 38 | with gr.Row(): 39 | with gr.Column(): 40 | Query = gr.Text(placeholder="Ask me a question", label="Query") 41 | btn = gr.Button("Submit") 42 | with gr.Column(): 43 | Tokens = gr.Text(label="Tokens Used") 44 | Response = gr.Text(label="Current Response") 45 | 46 | with gr.Row(): 47 | History = gr.HTML(label="Full Chat") 48 | btn.click(chatbot, inputs=[Query], outputs=[Tokens, Response, History]) 49 | 50 | demo.launch() 51 | --------------------------------------------------------------------------------