前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >用 SwiftUI 实现 AI 聊天对话 app - iChatGPT

用 SwiftUI 实现 AI 聊天对话 app - iChatGPT

原创
作者头像
37手游iOS技术运营团队
修改2022-12-09 16:08:52
1.5K0
修改2022-12-09 16:08:52
举报
文章被收录于专栏:37手游iOS技术运营团队

一、前言

关于 ChatGPT 的话题,大家都不陌生,我们直入话题,因为 ChatGPT 目前限制中国访问服务,所以如果直接使用 ChatGPT 网页进行对话,还是不太方便。通过 ChatGPT SessionToken 就可以不限制网络访问,所以大家发挥想象力实现各种的聊天机器人、小程序,而原生 app 可能体验更好!所以就有了 iChatGPT!一款用 SwiftUI 实现的开源 ChatGPT app,欢迎大家关注和提 PR。

二、iChatGPT

GitHub 开源地址:https://github.com/37iOS/iChatGPT

目前 v1.0.0,实现 ChatGPT 基本聊天功能:

  • 可以直接与 ChatGPT 对话,并且保留上下文;
  • 可以复制问题和回答内容;
  • 可以快捷重复提问等

支持系统:

  • iOS 14.0+
  • iPadOS 14.0+
  • macOS 11.0+

三、App 使用介绍

iChatGPT-02.jpeg
iChatGPT-02.jpeg

首先,需要点击 app 右上角图标,添加 ChatGPT SessionToken 密钥才能使用,否则无法请求。

iChatGPT-03.jpeg
iChatGPT-03.jpeg

获取 SessionToken 的方法很多,其中浏览器方法:

  1. 登录 https://chat.openai.com/chat
  2. 按 F12 打开控制台(macOS 可以用快捷键 command + option + I
  3. 切换到 Application(应用) 选项卡,找到 Cookies (Safari 浏览器是 储存空间 选项卡)
  4. 复制 __Secure-next-auth.session-token 的值,添加到 app 后确认。
iChatGPT-04.jpeg
iChatGPT-04.jpeg

操作的界面如下:

iChatGPT-05.jpeg
iChatGPT-05.jpeg

四、App 实现介绍

使用 SwiftUI 大概几个小时就完成所有的工作,方便跟苹果生态实现。实现的难点就可能就是模拟 ChatGPT 请求过程。目前是根据 A-kirami/nonebot-plugin-chatgpt 项目中的 python 实现,用 Swift 重写了一次,而 ChatGPT 登陆暂时没有实现,大家可以提 pr。

最后封装的网络请求类 ChatGPT.swift

代码语言:swift
复制
class Chatbot {
	
	let apUrl = "https://chat.openai.com/"
	let sessionTokenKey = "__Secure-next-auth.session-token"
	let timeout = 30
	var sessionToken: String
	var authorization = ""
	var conversationId = ""
	var parentId = ""
	let  id = ""
	
	init(sessionToken: String) {
		self.sessionToken = sessionToken
	}
	
	func headers() -> [String: String] {
		return [
			"Host": "chat.openai.com",
			"Accept": "text/event-stream",
			"Authorization": "Bearer \(self.authorization)",
			"Content-Type": "application/json",
			"User-Agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.1 Safari/605.1.15",
			"X-Openai-Assistant-App-Id": "",
			"Connection": "close",
			"Accept-Language": "en-US,en;q=0.9",
			"Referer": "https://chat.openai.com/chat",
		]
	}
	
	func getPayload(prompt: String) -> [String: Any] {
		var body = [
			"action": "next",
			"messages": [
				[
					"id": "\(UUID().uuidString)",
					"role": "user",
					"content": ["content_type": "text", "parts": [prompt]],
				]
			],
			"parent_message_id": "\(self.parentId)",
			"model": "text-davinci-002-render",
		] as [String: Any]
		if !self.conversationId.isEmpty {
			body["conversation_id"] = self.conversationId
		}
		return body
	}
	
	func refreshSession() async {
		let cookies = "\(sessionTokenKey)=\(self.sessionToken)"
		let url = self.apUrl + "api/auth/session"
		let userAgent = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.1 Safari/605.1.15"
		var request = URLRequest(url: URL(string: url)!)
		request.httpMethod = "GET"
		request.addValue(userAgent, forHTTPHeaderField: "User-Agent")
		request.addValue(cookies, forHTTPHeaderField: "Cookie")
		do {
			let (data, response) = try await URLSession.shared.data(for: request)
			let json = try JSONSerialization.jsonObject(with: data, options: [])
			if let dictionary = json as? [String: Any] {
				// Use the dictionary here
				if let accessToken = dictionary["accessToken"] as? String {
					authorization = accessToken
				}
			}
			guard let response = response as? HTTPURLResponse,
				  let cookies = HTTPCookieStorage.shared.cookies(for: response.url!) else {
				// handle error
				print("刷新会话失败: <r>HTTP:\(response)")
				return
			}
			for cookie in cookies {
				if cookie.name == sessionTokenKey {
					self.sessionToken = cookie.value
                    UserDefaults.standard.set(cookie.value, forKey: ChatGPTSessionTokenKey)
				}
			}
		}
		catch {
			print("刷新会话失败: <r>HTTP:\(error)")
		}
	}
	
	func getChatResponse(prompt: String) async -> String {
		if  self.authorization.isEmpty {
			await refreshSession()
		}
		
		let url = self.apUrl + "backend-api/conversation"
		var request = URLRequest(url: URL(string: url)!)
		request.httpMethod = "POST"
		request.allHTTPHeaderFields = headers()
		let dict = getPayload(prompt: prompt)
		do {
			let jsonData = try JSONSerialization.data(withJSONObject: dict, options: [])
			request.httpBody = jsonData
			let (data, response) = try await URLSession.shared.data(for: request)
			guard let response = response as? HTTPURLResponse else {
				let err = "非预期的响应内容:  <r>HTTP:\(response)"
				print(err)
				return err
			}
			
			if response.statusCode == 429 {
				return "请求过多,请放慢速度"
			}
			
            guard let text = String(data: data, encoding: .utf8) else {
                return "非预期的响应内容: 内容读取失败~"
            }
            
            if response.statusCode != 200 {
                let err = "非预期的响应内容:  <r>HTTP:\(response.statusCode)</r> \(text)"
                print(err)
                return err
            }
            
			let lines = text.components(separatedBy: "\n")
			// 倒数第四行,第6个字符后开始
			let str = lines[lines.count - 5]
            #if DEBUG
			print(str)
            #endif
			let jsonString = str.suffix(from: str.index(str.startIndex, offsetBy: 6))
			guard let jsondata = jsonString.data(using: .utf8) else {
				return ""
			}
			let json = try JSONSerialization.jsonObject(with: jsondata, options: [])
			guard let dictionary = json as? [String: Any],
					let conversation_id = dictionary["conversation_id"] as? String,
					let message = dictionary["message"] as? [String: Any],
					let parent_id = message["id"] as? String,
					let content = message["content"] as? [String: Any],
					let texts = content["parts"] as? [String],
					let parts = texts.last
					else {
				return "解析错误~"
			}
			self.parentId = parent_id
			self.conversationId = conversation_id
			return parts
		}
		catch {
			return "异常:\(error)"
		}
	}
}

唯一可以说说的就是,ChatGPT 的 backend-api/conversation 接口返回的内容,为了实现一个连接打开的效果,返回了一堆的数据。例如一个回答是 "我无法确定全球当前的人口数量,因为我没有浏览网页的能力。",返回的内容是这样:

代码语言:javascript
复制
data: {"message": {"id": "xxxx", "role": "assistant", "user": null, "create_time": null, "update_time": null, "content": {"content_type": "text", "parts": ["我"]}, "end_turn": null, "weight": 1.0, "metadata": {}, "recipient": "all"}, "conversation_id": "xxxx", "error": null}

data: {"message": {"id": "xxxx", "role": "assistant", "user": null, "create_time": null, "update_time": null, "content": {"content_type": "text", "parts": ["我无"]}, "end_turn": null, "weight": 1.0, "metadata": {}, "recipient": "all"}, "conversation_id": "xxxx", "error": null}

data: {"message": {"id": "xxxx", "role": "assistant", "user": null, "create_time": null, "update_time": null, "content": {"content_type": "text", "parts": ["我无法"]}, "end_turn": null, "weight": 1.0, "metadata": {}, "recipient": "all"}, "conversation_id": "xxxx", "error": null}

中间省略xxxx行
中间省略xxxx行
中间省略xxxx行

data: {"message": {"id": "xxxx", "role": "assistant", "user": null, "create_time": null, "update_time": null, "content": {"content_type": "text", "parts": ["我无法确定全球当前的人口数量,因为我没有浏览网页的能力"]}, "end_turn": null, "weight": 1.0, "metadata": {}, "recipient": "all"}, "conversation_id": "xxxx", "error": null}

data: {"message": {"id": "xxxx", "role": "assistant", "user": null, "create_time": null, "update_time": null, "content": {"content_type": "text", "parts": ["我无法确定全球当前的人口数量,因为我没有浏览网页的能力。"]}, "end_turn": null, "weight": 1.0, "metadata": {}, "recipient": "all"}, "conversation_id": "xxxx", "error": null}

所以,需要按行分割,然后取倒数第四行的内容,再去掉 data: 字符才是我们想要的 json 内容。

代码语言:txt
复制
let lines = text.components(separatedBy: "\n")
// 倒数第四行,第6个字符后开始
let str = lines[lines.count - 5]

当然,目前 ChatGPT 还是 beta 阶段,所以暂时没有开放 API,后续如果提供 API,就会更加方便!

五、ChatGPT 的一些问题

是否收费

目前 ChatGPT 是 beta 免费使用阶段,未来 API 请求会收费,具体可参考 https://openai.com/blog

修改头像

ChatGPT 对话的个人头像,大家发现无法有 https://openai.com 上进行修改。因为目前使用的是 Gravatar 服务。

Gravatar,全称 Globally Recognized Avatar。翻译成中文叫:全球通用头像。

Gravatar 的概念首先是在国外的独立 WordPress 博客中兴起的,当你到任何一个支持Gravatar的网站留言时,这个网站都会根据你所提供的Email地址为你显示出匹配的头像。当然,这个头像,是需要你事先到 Gravatar 的网站注册并上传的,否则,在这个网站上,就只会显示成一个默认的头像。

简单来说,就是头像链接为 https://s.gravatar.com/avatar/xxx,其中 xxx 就是你登陆邮箱的 MD5 值,只要在 Gravatar 注册验证了这个邮箱,你就可以更新头像,或者任何人都可以获取你的头像,只要知道你的邮箱。详细可以参考:Image Requests - Globally

有趣的对话

写一首诗,庆祝 iChatGPT app 开源:

iChatGPT-06.jpeg
iChatGPT-06.jpeg
代码语言:txt
复制
咦,知道 iChatGPT 

它酷炫极了,支持语言模型交互

它开源了,人人可用

快来下载,体验它的强大

它可以帮助你,完成复杂任务

不论是写文章,还是做研究

它是程序员的好帮手

让工作更高效,更愉快

啦啦啦,iChatGPT 

开源了,万岁!

直呼牛~

六、总结

目前 iChatGPT 开源地址:https://github.com/37iOS/iChatGPT 。还有很多功能没有实现,比如:

  • 保存对话
  • 显示个人头像
  • 代码没有高亮
  • 请求失败重试等等

欢迎大家提 PR !

另外,我们近期也会更新 AppleParty,更新苹果批量上传内购商品功能,敬请期待~

最后,大家觉得 ChatGPT 解决了什么痛点?有什么期待吗

欢迎大家评论区一起讨论交流~

欢迎关注我们,了解更多 iOS 和 Apple 的动态~

参考引用

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、前言
  • 二、iChatGPT
  • 三、App 使用介绍
  • 四、App 实现介绍
  • 五、ChatGPT 的一些问题
    • 是否收费
      • 修改头像
        • 有趣的对话
        • 六、总结
        • 参考引用
        相关产品与服务
        API 网关
        腾讯云 API 网关(API Gateway)是腾讯云推出的一种 API 托管服务,能提供 API 的完整生命周期管理,包括创建、维护、发布、运行、下线等。
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档