AutoGPT 圖形介面網頁版 AgentGPT：安裝教學、使用方法介紹

2023 年 4 月 20 日更新 HongWei AI 科技, ChatGPT 應用

在之前的文章中我們分大家分享了 AutoGPT 的使用、下載、安裝教學介紹，詳解了如何從 GitHub 安裝 AutoGPT 這套進階版的 GPT AI 聊天機器人。

不過原始版的 AutoGPT 是建立在終端機上的，所以很多都是文字命令，大部分的人可能看不習慣，今天我們就要跟大家分享另外一款的 AutoGPT，而且有提供比較親民、友善的圖形介面網頁版給打大家使用。

🤖️ 加入我們的 ChatGPT 應用分享社團，一起享受 AI 樂趣：點這邊

AgentGPT：AutoGPT 的圖形介面網頁版安裝教學

這款 AgentGPT 機器人主要的 AI 功能就是建立在原版的 AutoGPT 之上，然後再加上圖形介面，這樣閱讀起來比較容易也比較方便。

這裡我會按照 AgentGPT 官方所建議的步驟來一步一步教大家。

準備好 OpenAI API Key

跟之前一樣，你必須要先準備好 OpenAI 的 API Key，到時候把這組 API Key 提供給 AgentGPT 以後，你才可以使用 AgentGPT 網頁版介面下的 AutoGPT 功能。

你可以前往 OpenAI 的 API 頁面，過去的 API Key 你如果沒有記下來的話，這邊已經無法完整顯示了，所以你只能夠再重新建立一個新的 OpenAI API Key。

捷徑 API ChatGPT Siri 語音助理

然後記住好這一組 API Key 的內容，複製到其他地方先保存起來也可以，總之如果你沒有記好，那等一下要用的時候就得重新再來申請一次，畢竟你也不能查詢。

安裝 Nodejs 檔案

再來我們要安裝 Nodejs +18 這個檔案。這是為了建立一個能夠在伺服器端運行 JavaScript 的開放原始碼、跨平台執行環境。

我們選擇右邊 LTS 的版本下載、安裝。

複製 AgentGPT 檔案

再來你要先建立一個自己的 GitHub 帳號。填完資料以後驗證完信箱，這樣就可以建立 GitHub 帳號，很簡單。

建立自己 GitHub 帳號的主要用意，是要把 AgnetGPT 的內容在自己的 GitHub 內建立資料集，所以我們點選下方的連結把 AgentGPT 的 GitHub 檔案 fork 到我們的 GitHub 帳號下。

GitHub Fork 檔案系統：請點此

下面的設定你不需要更改，直接點選建立 fork 就可以了。

建立完以後，你會在你的 GitHub 帳號下看到 AgentGPT 的檔案內容，然後我們選擇右上角的「Code」符號下拉箭頭，把 https 網址複製起來。

接著打看 Mac 的終端機或是 Windows 的系統命令提示工具，在裡面輸入以下指令：

git clone https://github.com/你的 GitHub 使用者名稱/AgentGPT.git

看到最後顯示 100% 完成以後，我們來到「Mac → 使用者名稱」這個位置下面，會多出一個「AgentGPT」的資料。夾。

做到這個步驟基本上就已經把 AgentGPT 的檔案通通都抓到電腦上了。

安裝 AgentGPT

接著我們要在本機上安裝 AgentGPT 來執行 AutoGPT（真是饒舌….）

一樣在 Mac 的終端機或是 Windows 的命令提示工具裡面，先把位置切換到 AgentGPT 裡面，輸入：

cd AgentGPT

接著再輸入開始安裝 AgentGPT的指令：

npm install

接著在 AgentGPT 的資料夾內按下「shift + command + . 」把隱藏的檔案顯示出來以後，透過文字編輯器打開 .env 這個檔案。

在最下面的 OPENAI_API_KEY= 後面填上你的 OpenAI API Key。

執行 AgentGPT 介面的 AutoGPT

最後我們就要執行 AgentGPT 圖形介面的 AutoGPT 聊天機器人。

一樣透過 Mac 的終端機或是 Windows 的命令提示工具，輸入以下指令：

./prisma/useSqlite.sh

按下 Enter 以後應該什麼都不會發生，沒關係我們繼續輸入下一段指令：

npx prisma db push

這一段主要是建立資料庫的遷移，執行完畢後你會看到像是下列的內容，但也不會有什麼太明顯的變化，一直到這邊其實都還只是在做最後的設定。

最後（真的是最後了）再輸入一段指令，讓終端機開始啟動 AgentGPT 的 AutoGPT 來執行：

npm run dev

接著從下面的這一串文字中，找到 http://localhost:XXXX 的這一段，把這一整個網址複製下來貼到瀏覽器上。

然後你就可以看到 AutoGPT 透過 AgentGPT 以圖形介面的方式呈現出來。

使用 AgentGPT 圖形介面的 AutoGPT

第一次使用的話，AgentGPT 圖形介面的 AutoGPT 一樣會請你替 AI 機器人取名字，但不像初始版的 AutoGPT 會請你定義 AI 的規則、給出 5 個目標，這裡就是直接問你 AI 機器人的名字以及你要達到的目標。

輸入完以後按下方的 Deploy Agent，他就會開始自動執行。

檢視 AutoGPT 產生的內容

中間的對話框會詳細的顯示目前 AutoGPT 他在執行哪些工作、給了哪些建議、提示、下一步要怎麼做….等等的內容。右邊則是把這些內容簡化，告訴你他執行了哪些類型的步驟，例如分析、調查….等。

像是我問他關於投資的內容，他就會去股票市場中找一些比較穩定的項目出來，然後再繼續制定下一個步驟….等，而且不需要你同意他就會一直執行，所以這部分是需要注意一下的。

我們在《Auto-GPT 是什麼？完整的 Auto-GPT 安裝與使用方法詳細介紹》這篇文章中也介紹大家如何替 OpenAI 的 API 設定限制，才不會讓 AutoGPT 自動執行太多任務而造成費用爆掉的困擾。

保存 AutoGPT 產生的內容

這些內容也都可以輕易地保存，在中間的框框上面有三個按鈕，你可以把它存成 Image 圖片、Save 保存起來，獲釋 Copy 複製到剪貼不貼到其他地方。

重新開始 AutoGPT 任務

而且作者似乎打算弄的跟 ChatGPT 一樣，可以開啟多個聊天記錄來使用 AgentGPT 圖形介面的 AutoGPT，點擊左邊的「+ New Agent」就可以開新的 AgentGPT，但是這個功能目前還沒完成，所以按下去以後會清空當前 AgentGPT 的內容。

設定 GPT 模式與 OpenAI API Key

另外要注意的一點是，我們點選左下方的 Setting 選單，你會看到這裡的 API Key 是空的，雖然我們剛剛已經在 .env 檔案中設定過了，但他沒有帶進來，所以我們再填寫一次。

那如果如果你有 GPT-4 的 API 也可以在這裡輸入，AutoGPT 就會以 GPT-4 的模式執行。

當你輸入完 OpenAI API Key 以後，下面 Advanced Settings 打開，還可以選擇 Loops 的次數，這意味著 AutoGPT 可以執行幾次的自動任務而不需要你同意。

預設是 50 次，最低是 1 次最高是 100 次。

所以如果你的要求會讓他執行超過 100 個動作或是超過你設定的 Loop 數字，那麼你可能就得不到結果了，因為 AgentGPT 會以保護你的荷包為由，停止 AutoGPT 繼續運作。

AgentGPT 圖形介面網頁版的 AutoGPT：總結

整體來說，我覺得可以看到圖形介面網頁版的 AutoGPT 在使用上來說也對親民，也比較好懂，對於 AutoGPT 的回覆也比較有格式化，不會全部都是一句一句一直連貫下去的模式。

此外，AugenGTP 在安裝上看起來也比 AutoGPT 簡單一點點，也提供了 Loop 回答次數的設定，保護你的錢包不受到 AutoGPT 的鯨吞蠶食！

使用 AgentGPT 的圖形化網頁版 AutoGPT 介面要錢嗎？

AgentGPT 是開源軟體不需要費用，但是使用 AgentGPT 因為需要使用到 OpenAI API，所以會有 Token 的使用費。

AgentGPT 以及 AutoGPT 哪一個比較好？

基本上這兩者的本質都是 AutoGPT，只不是 AgentGPT 只是把 AutoGPT 加上圖形介面而已。

使用 AgentGPT 的圖形化網頁版 AutoGPT 比直接使用 AutoGPT 好嗎？

我自己是覺得圖形化介面的 AutoGPT (AgentGPT) 會比較好用。

AgentGPT 網頁版的資料夾一定要放在主目錄下嗎？

不一定，你可以先 cd 到你想要的目錄以後，再去執行 git clone 的動作。

可以不要 Fork GitHub 的內容，直接從原作者的 GitHub 中下載就好嗎？

原作者給出的安裝步驟中是建議 Fork 到自己的帳號下。

使用 AgentGPT 的圖形化網頁版 AutoGPT 有次數限制嗎？

單個任務中最多執行 100 次的動作。

沒有 OpenAI 的 API 可以使用嗎？

其實是可以的，但是會限制每次都只能進行 4 ~ 5 次的動作。

AgentGPT 支援中文輸入、中文顯示嗎？

AgentGPT 本質上還是 AutoGPT，之前我們有說過 AutoGPT 可以顯示中文、可以使用中文，所以 AgentGPT 也可以，但是多數的時候他還是以英文回覆你。

延伸閱讀》

更多 ChatGPT 相關應用技巧》

如果想知道更多關於 Apple 的消息、教學、小技巧或是科技新知，一定要點擊以下任一 LOGO，追蹤我們的 Facebook 粉絲團、訂閱 IG、YouTube 以及 Telegram。