环球今日讯！3小时！开发ChatGPT微信小程序
导读|上周OpenAI发布了对话语言模型ChatGPT，相关讨论引爆全网。你是否也迫不及待体验一番？本文特邀作...
2022-12-20环球今日讯！3小时！开发ChatGPT微信小程序
导读 |上周OpenAI发布了对话语言模型 ChatGPT，相关讨论引爆全网。你是否也迫不及待体验一番？本文特邀作者腾讯云开发者社区作者戴传友从开发环境准备、开发过程、服务器接口、腾讯API网关接入到部署，详细教你如何动手开发一个chatGPT微信小程序。
(资料图片)
{ "pages": [ "pages/chat/index", "pages/index/index", "pages/logs/logs" ], "window": { "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#fff", "navigationBarTitleText": "ChatGPT", "navigationBarTextStyle": "black" }, "style": "v2", "sitemapLocation": "sitemap.json", "useExtendedLib": { "weui": true }, "tabBar": { "color": "#1485EE", "selectedColor": "#FF514E", "list": [ { "pagePath": "pages/chat/index", "text": "ChatGPT概览" }, { "pagePath": "pages/index/index", "text": "我的创作" } ] }}值得注意的是，tabBar-list-pagePath的路径需要存在，否则编译器会报错。此处我把项目的工程目录截图公开，各位对比上下文配置信息更容易理解。3） 编写主界面规划的界面中只需要一个输入框及一个询问按钮。当用户点击询问按钮的时候，获取输入框中的值，去请求服务器的/ask接口获取结果。获取数据之后，再展示到页面中的结果展示中。确定了这个基本流程，接下来只要知道这些基本组件在微信小程序里面使用什么标签就好了。更多的细节可以访问 微信小程序的开发文档。4）绑定点击事件在form表单上绑定事件：然后在对应的js文件里面定义submitForm方法。submitForm: function (e) { //一般前置检查代码 ... const that = this wx.request({ url: "http://youdomain.com/api/xxxx", method: "post", header: {"content-type": "application/x-www-form-urlencoded"}, data: data, success(rsp) { console.log("ask result-----",rsp.data) that.setData({ result: rsp.data.data.rsp, disabled: false, loading: false, }) }, complete(d) { console.log(d) } }) console.info("form.submited") ....其他相关代码},值得注意的是，上面用到的url需要在小程序中进行域名白名单注册，否则无法被访问到。同时进行注册的域名，需要进行备案。配置地址：登录微信小程序管理后台，在开发管理-服务器域名中进行配置。如下图。async ask() { const { request, helper, axios, logger } = this.ctx const { message } = request.body logger.info("requset body===", request.body) logger.info("message===",message) ...其余相关代码 这里的token就是前面提到的在openai上申请到的token const config = { headers: { Authorization: `Bearer ${token}` } } const req = { model: "text-curie-001", prompt: message, max_tokens: 2000, temperature: 0.5 } console.log("req===",req) let text = "" const result = await axios.post("https://api.openai.com/v1/completions", req, { timeout: 300000, headers: { Authorization: "Bearer ${token}" } }) .then(rsp => { console.log("pdf file result", rsp) if (rsp.choices) { text = rsp.choices[0].text } }) .catch(err => { console.log("pdf file error", err) }) const data = { rsp: text } helper.success(data, "success")}这里的token就是前面提到的在openai上申请到的token ，注意不要泄漏。腾讯api网关接入及部署1）网关接入考虑到并发能力，频率限制，自动扩容等能力的接入，我选择了腾讯云api网关。如何把api通过腾讯云暴露到外网呢？首先，访问https://console.cloud.tencent.com/apigateway/service?rid=1。其次，新建一个service，并且选择https协议【微信要求https协议】。最后，新建接口ask并且映射到我们自己的服务器。1、算法工程师深度解构ChatGPT技术
2、耗时减半？腾讯云OCR只做了3件事
3、探秘微信业务优化：DDD从入门到实践
4、10分钟！从架构视角读懂K8s
标签：
