一键部署你的ChatGPT Web网站


想要搭建自己的ChatGPT Web网站,我们只需要两个账号:

1.Github账号 -https://github.com/2.Vercel账号 -https://vercel.com/login

其实Vercel账号可以使用Github账号直接登录:

所以我们只需要注册一个Github账号即可。

开始

1. Github

我们首先先在Github上访问这个地址:https://github.com/Yidadaa/ChatGPT-Next-Web

然后点击右上角的Fork也就是克隆,然后点击Create Fork把这个仓库克隆到你的账号下

图片

这个时候就会把这个github 仓库克隆到你的个人账号下面。

Vercel

克隆之后我们去到Vercel平台。Vercel 使用刚才的Github账号登录并授权。

我们直接点击Add New->Project,然后找到我们的ChatGPT-next-web这个Github仓库,点击Import导入

图片

这个project name我们可以随便选,使用默认的即可。

我们唯一要注意的就是这个环境变量,我们需要把ChatGPT的API Key添加进来,然后部署。

这个API Key是为了验证你的身份,需要你有OpenAI账号。

![图片](data:image/svg+xml,%3C%3Fxml version=’1.0’ encoding=’UTF-8’%3F%3E%3Csvg width=’1px’ height=’1px’ viewBox=’0 0 1 1’ version=’1.1’ xmlns=’http://www.w3.org/2000/svg‘ xmlns:xlink=’http://www.w3.org/1999/xlink'%3E%3Ctitle%3E%3C/title%3E%3Cg stroke=’none’ stroke-width=’1’ fill=’none’ fill-rule=’evenodd’ fill-opacity=’0’%3E%3Cg transform=’translate(-249.000000, -126.000000)’ fill=’%23FFFFFF’%3E%3Crect x=’249’ y=’126’ width=’1’ height=’1’%3E%3C/rect%3E%3C/g%3E%3C/g%3E%3C/svg%3E)

API key

如果你不知道上面的API Key怎么获得,这个非常简单,我们打开openai的平台地址:https://platform.openai.com/

登录之后点击右上角的头像,点击Manage Account->API Keys->Create New Secret Key, 然后复制下来保存备用。

图片

部署

然后回到刚才的部署界面,在刚才的环境变量在Name里面输入 OEPNAI_API_KEY,然后Value就输入我们刚才复制的API Key

点击Add添加,然后我们点击Deploy部署。

当然如果你需要你的ChatGPT支持密码访问,可以添加一个新的环境变量,

-

Name: CODEValue: 你想要设置的密码

这个时候,我们的网站就会需要密码访问

我们点击Deploy,可以看到它就开始部署了 我们稍等一会就可以看到我们的网站就能部署成功了。

图片

使用

我们可以点击就可以进入到我们的ChatGPT 个人网站了。

图片

此时Vercel 给我们自动分配了域名,当然这个域名由于某些原因,在国内可能无法访问,你可能需要使用自己的域名。

我们在刚才的部署成功的页面点击右边的Add Domain添加域名,

图片

然后输入我们的域名,点击添加。我们选择默认的选项, 然后点击添加

图片

添加之后Vercel会提示我们需要添加两条记录,一条是A记录,一条是CNAME记录

图片

我们进入到我们的域名解析商,这里我使用cloudflare来解析我的域名。

我们在这里点击添加记录:

•首先我们添加A记录,记录类型是A,名称是@,然后ipv4地址就是刚才的ip地址•然后我们再添加一条 CNAME 记录,记录类型是CNAME,名称是www,值是刚才的值

图片

现在我们这两条记录,就已经添加成功了

我们再回到我们的 Vercel 托管平台,可以看到,我们的DNS记录已经设置成功了

图片

我们添加成功之后直接点击跳转,用我们自己的域名就可以访问ChatGPT Web网站了。

那我们可以开始在这里和ChatGPT进行聊天了。

角色扮演

我们也可以让ChatGPT来扮演各种角色,此时ChatGPT的回答会更具有专业性。

我们可以看到这里有非常多的角色,我们来让他帮我们扮演一个职业顾问,点击左下角新的聊天,找到职业顾问点击跳转新的聊天。

图片

然后我们问他问题:作为一个程序员,我以后的职业生涯应该怎么规划?

点击发送,可以看到作为一个职业顾问,他给我们详细列明了我们有很多职业道路可以选择,然后还给我们的职业生活也做了一些规划。

图片

如果不让它扮演职业顾问,它给的回答是怎么样的呢?

图片

可以看到,同样的问题,当我们不让他扮演任何角色的时候,他给我们的答案就相对专业性就没有那么强。

所以角色扮演在专业的问题上,ChatGPT能给到更好的回答,我们可以使用这个来获得更优秀的答案。

密码访问

同时这个ChatGPT网站也是支持密码访问的,想要支持密码访问非常简单,上面已经告诉你如何添加环境变量。

如果你之前没有添加,这里教你如何再次添加。

点击你的当前项目,找到settings设置项,然后找到左边的Environment Variables也就是环境变量。

图片

密码的环境变量的key是CODE,这个值你可以填写你的密码,比如说我填写techxiaofei,然后点击保存

现在我们环境已经添加成功了,添加成功之后我们重新编译一下,我们点击redeploy就是重编译。

图片

重新访问我们的ChatGPT网站,可以看到上面提示:现在是未授权状态,请点击左下角设置按钮输入访问密码。

图片

我们点击左下角的设置,然后找到访问密码,输入我们的访问密码,就可以正常和ChatGPT对话了。

图片

后记

这个ChatGPT Web网站可以解决在国内无法正常访问ChatGPT的问题

而且它也不需要云服务器,不需要你购买任何东西,完全免费,任何人都可以轻松一键部署,所以赶紧尝试一下吧。