3小时！开发ChatGPT微信小程序

　　导读  上星期OpenAI发布了对话言语模型 ChatGPT，相关谈论引爆全网。你是否也刻不容缓体会一番？本文特邀作者腾讯云开发者社区作者戴传友从开发环境预备、开发进程、服务器接口、腾讯API网关接入到布置，详细教你怎么着手开发一个chatGPT微信小程序。

　　》两篇文章中，咱们别离囊举了ChatGPT的丰厚玩法并解析其作业原理。假如你对相关内容感爱好，欢迎回溯围观～大众号的粉丝朋友们在谈论区畅想了更多ChatGP运用实践，也有粉丝表明想要亲身体会下其美妙之处。此次，咱们约请腾讯云开发者社区开发者由浅入深带你着手开发一个ChatGPT微信小程序，其间会详细介绍开发环境预备、项目完结、服务接口建立、腾讯API网关接入、布置等环节。

　　在微信中查找 ChatGPT相关的小程序，查看有哪些姓名未被占用。选好姓名并记载预备144px*144px尺度的logo，并在微信大众渠道官网主页恳求微信小程序。一般来说，大约3个小时左右就能够经过审阅。

　　OpenAI（ ）现在不在我国区域开展业务，国内不能正常的体会到openai供给的服务。账号的恳求和注册详细教程，各位阅读者能够自行查找。

　　恳求到账号之后，为了在代码中实对OpenAI 供给的 api ，咱们还需求恳求一个apiKey。这是经过代码拜访ChatGPT的关键所在。

　　账号恳求成功后，拜访页面生成apiKey。其间特别留意保存好key（不能再次查看，假如丢掉只能从头生成）。

　　至此，根本预备作业已悉数完结，接下来将为各位开发者叙述中心代码的开发流程。

　　其次，我个人主张新建小程序时挑选最简略的根底模版，并勾选运用微信云开发环境。去除冗杂的装备以便你能更快速的对微信小程序的代码结构有开始了解。我成文时，由于恳求的小程序还没有审阅经过，所以挑选下述测验号用来进行开发。

　　导出初始化项目之后，你会看到比较明晰的文件结构。小程序开发跟一般的html、css、js 三剑客用来开发网页没有实质的差异。在微信系统内，wxml、wxss、js 都是 html、css、js的子集。

　　页面的结构在wxml 中写，用到的款式在 wxss中界说；变量和函数以及网络恳求 等在 js 中履行。简略说来，小程序包括一个描绘全体程序的 app 和多个描绘各自页面的 page。这儿的 app 是指放在根目录的 app.js、app.json、app.wxss 这三个文件，他们首要担任全局性的逻辑、装备及款式。

　　pages 则是你行将编写的多个页面。多个 pages 之间能够经过官方供给的导航功用进行跳转。每个 page 页面由 page.js、page.json、page.wxml、page.wxss 四个文件组成。其间 WXML 页面相似 HTML 文件，首要担任页面的结构。

　　比较于 HTML而言，WXML 愈加简略。开发进程中，布局根本上是在运用view和text标签，以及其它官方文档上阐明的其他标签。可是各位在开发进程中，需求特别重视官方文档中有关组件的内容。

　　经过 useExtendedLib 扩展库 的方法引进。这种方法引进的组件将不会计入代码包巨细。

　　假如你在开发进程中不想花很多时刻研讨npm且希望快速完结看到作用，又或许受困于小程序商铺上架会约束到代码包巨细（可是useExtendedLib 扩展库不计入代码包巨细），个人主张挑选了榜首种方法。

　　假如你觉得一个页面展现的信息过于单调，能够在小程序中运用tabbar。依照微信官方供给的自界说tabbar指引，你能够轻松把代码复制到项目工程中。本文把中心过程代码公示出，更多细节有爱好能够拜访微信官方指引页，地址如下：

　　值得留意的是，tabBar-list-pagePath的途径需求存在，不然编译器会报错。此处我把项目的工程目录截图揭露，各位比照上下文装备信息更简单了解。

　　规划的界面中只需求一个输入框及一个问询按钮。当用户点击问询按钮的时分，获取输入框中的值，去恳求服务器的/ask接口获取成果。获取数据之后，再展现到页面中的成果展现中。

　　确认了这个根本流程，接下来只需知道这些根本组件在微信小程序里边运用什么标签就好了。更多的细节能够拜访 微信小程序的开发文档。

　　值得留意的是，上面用到的url需求在小程序中进行域名白名单注册，不然无法被拜访到。一起进行注册的域名，需求进行存案。

　　装备地址：登录微信小程序办理后台，在开发办理-服务器域名中进行装备。如下图。

　　到此，小程序部分装备完结。开发者能够用手机进行预览，或许真机调试。假如此刻没有装备域名，也能够经过疏忽掉域名强制查看。当然，假如是正式上线审阅的话，必须有一个经过存案的域名，且该域名在小程序后台中完结了装备。

　　上述内容建立完结后，下一步是装备服务器。本着快速开发的准则，能够借用“现成的轮子”，保证功率榜首。各位能够参阅现有的api-server脚手架（）。

　　之后装备接口姓名以及对应的handle。我界说了一个姓名叫做 /ask 的接口姓名，一起界说了处理ask接口的 handle函数如下。

　　这儿的token便是前面说到的在openai上恳求到的token ，留意不要走漏。

　　考虑到并发才能，频率约束，主动扩容等才能的接入，我挑选了腾讯云api网关。怎么把api经过腾讯云露出到外网呢？首要，拜访。其次，新建一个service，而且挑选https协议【微信要求https协议】。最终，新建接口ask而且映射到咱们自己的服务器。

　　在微信开发者东西里边进行代码上传，然后在微信小程序后台里边就能看到上传的版别。主张各位开发者提交审阅之前用真机扫描体会一下，有bug及时修正。