EasyAR WebAR 开发微信小程序记录

此篇文章写于2019年7月，距今太久，可能已经失去时效性，大家可以选择性查看，无法保证和现在的技术一致。另外，因个人原因，疫情期间没有登录CSDN，很多人的评论和私信都没有回复，感到万分抱歉。

                                                                                                                             ——2023年9月

一、准备：

                1.EasyAR官网阅读《EasyAR WebAR 快速入门》并下载EasyAR-WebAR-Demo。

                2.EasyAR官网阅读《EasyAR WebAR 微信小程序 快速入门》并下载EasyAR-miniprogram-WebAR-Demo。

                3.EasyAR官网开通云识别图库服务（限时免费），上传需扫描的图片，获取token备用。

                4.微信公众平台注册个人开发者账号，下载微信小程序开发者工具，阅读小程序开发相关内容。

二、原理：

                1.微信小程序页面打开摄像头后扫描图片，上传到EasyAR服务器与云识别图库中已上传的图片进行对比，成功后返回并执行success方法。

                2.扫描成功后，在success方法中跳转到新的小程序页面，新页面只有一个web-view组件，该组件用于嵌套自己服务器上显示模型的网页。

                3.网页显示3D模型需要用到Three.js的知识，但Three.js无法在小程序网页上使用，因此需要通过小程序的web-view组件嵌套网页来显示3D模型。这一步应先用Three.js制作能够显示3D模型的网页，然后将该网页部署到自己的服务器上，最后再用web-view嵌套该网页。

三、流程：

                1.使用微信web开发者工具导入EasyAR-miniprogram-WebAR-Demo，目录结构如下：

Demo中有3个页面，index、recognition、show，效果显示如下：