web新手之使用easyAR实现WebAR
为了方便AR开发交流,博主建立了一个群 :891555732,欢迎一起讨论
easyAR出了webAR,正好是老板感兴趣的内容,可是我一个学unity不懂网页的人要去研究,初始难度就感觉不是一般的大,本文中记录我的研究史
2019.1.23补充默认打开后置摄像头
感谢群中 . 大佬的贡献
更改APP.js
8.22补充新版本更改内容 :
时间过去良久,老板才要做示例程序,此时easyAR的webAR示例程序也更改了,因此将最新的更改同步更新上来
首先从Github下载的demo解压后目录如下: https://github.com/gentwolf-shen/EasyAR-WebAR-Demo
可能会有一些童鞋找不到配置文件,以下是recognize.php所在目录:
因此要将此文件拷贝到,然后再进行下面的配置 :
另外补充评论区童鞋的一点,不知道为什么新的官方demo会忘记加recognize的后缀名:
1.three.js学习
大学接触过网页,因此还是有点点前端的基础,里面水还是太深,我决定先看加载模型的three.js,在此贴上中文学习网站:http://www.hewebgl.com/article/articledir/1
2.官方教程
http://forum.easyar.cn/portal.php?mod=view&aid=27
3.官方示例程序:
完整的反正是看不太懂啦,找到关键的地方替换就成
第一步:替换recognize.php中的东西,根据你图库的key等三个值进行替换
第二步:更改模型的位置
找到app.js,我是使用本地加载模型的,从服务器加载的就没研究啦
第三步:安装apache并启动(请跳过看第四步,此处只为记录安装apache)
安装apache参考:https://www.cnblogs.com/jave1ove/p/5486427.html(从下载到安装,非常全,亲测有效)
启动期间遇上的问题解决:https://blog.csdn.net/liuensong/article/details/6738041
在html运行php文件参考:https://blog.csdn.net/guyuealian/article/details/50556906
记得将整个项目Copy到DocumentRoot指定的目录下
第四步:访问
满怀希望的开始访问:https://localhost:8080/SimpleThreeJsExample/index.html
可是还是不能识别,请教大佬说要用集成的apache环境
下载链接:https://www.apachefriends.org/zh_cn/download.html
- 首先先卸载之前安装的apache,记得要根据service.msc中apache名字进行卸载,网上大多数是sc delete apache,但是最后这个apache是你服务中的名字,具体卸载过程请自行百度
- 再解决80端口被占用的问题,关闭IIS,具体也请百度
- 安装好下载的XAMPP
- 启动apache
- 将项目放入htdocs
- 访问
中间又遇上了个坑,因为默认端口就是80,所以访问地址不用加端口号,虽然不太理解为什么加了端口号访问不了,哈,能用就行啦
访问地址:https://电脑ip/SimpleThreeJsExample/index.html(注意没有s就没办法打开摄像头)
注意事项:模型路径asset前面和recognize.php路径不要加/,会访问不到模型和recognize.php(网页运行按F12可以看错误输出等)
与模型互动使用three.js
- 例子网址:https://threejs.org/examples/?q=inter#webgl_interactive_cubes_gpu
- 调整光源网址:https://www.cnblogs.com/amy2011/p/5761174.html
- 移除模型:
①.首先引入jqury
<script type="text/javascript" src="asset/js/jquery-3.3.1.min.js"></script>
②.模型加载出来的时候,页面上会多一个canvas 标签,删除这个标签就可以了
$('canvas').remove();
4.webGL系列学习:
https://www.cnblogs.com/xulei1992/tag/webGL/
5.显示与隐藏模型 : https://blog.csdn.net/niuge8905/article/details/80860497
6.three.js笔记 : https://blog.csdn.net/qq_30100043/article/category/7003591
7.three.js光源详解:http://www.hangge.com/blog/cache/detail_1812.html
问题记录:
1.识别成功模型加载不出来
报错如下图所示:
原因:
模型贴图没有加载到
2.网络错误
看看key等三个参数有没有正确填写,比如没有去掉尖括号
web新手之使用easyAR实现WebAR相关推荐
- easyAR中webAR部分使用问题与解决方案汇总
easyAR中webAR部分使用问题与解决方案汇总 Web AR使用方面 threejs使用方面 Web AR使用方面 1.开始识别后,程序每隔一段时间向服务器post一次数据请求,导致对识别图库的调 ...
- 攻防世界——web新手题
攻防世界----web新手题 1. robots 打开题目场景,发现与robots协议有关,上网搜索robots协议的内容: Robots协议(也称为爬虫协议.机器人协议等)的全称是"网络爬 ...
- 2021-06-24CTF-攻防世界-WEB新手练习区(12题入门题)
CTF-攻防世界-WEB新手练习区(12题入门题) 01-view_source 02-robots 03-backup 04-cookie 05-disabled_button 06-weak_au ...
- CTF-攻防世界web新手入门篇
CTF-攻防世界web新手入门(全) 攻防世界网址 1.view_source 2.robots 3.backup 4.cookie 5.disabled_button 6.weak_auth 7.s ...
- 攻防世界-web新手区wp
攻防世界-web新手区wp view source robots backup cookie disabled_button weak auth simple php get_post xff_ref ...
- 攻防世界web新手练习 -unseping
攻防世界web新手练习 -unseping 新版攻防世界的这个题目有点给力,从今天开始刷题刷题 本题的知识点很多,总结出来以下几点 php代码审计 php反序列化 命令执行的绕过方式 空格绕过 空环境 ...
- 攻防世界——web新手区(全解)
当前网络安全形式越来越严重,我国也越来越重视,现在国内乃至国际上各个网络攻防大赛层出不穷,但是练习平台却还是很稀缺,可以说目前网上能够练习的平台也就只有几家,大多数的院校它们有自己的练习平台但并不公开 ...
- XCTF攻防世界Web新手入门题大全
XCTF攻防世界Web之WriteUp无图版 (Tips:有图版本,请移步我的资源,自行下载doc文档) 0x00 准备 [内容] 在xctf官网注册账号,即可食用. [目录] 目录 0x01 vie ...
- 攻防世界web新手区(来自小白)*-*
鄙人是个纯纯的小白,这个博客也是给小白写的,不过大佬们也不会来查这些题的wp吧 拍飞 文章目录 攻防世界WEB新手区(1--11) 第一题view_source 第二题robots 第三题backup ...
- 给学习java web新手们的建议和推荐一些书籍
经常有人问我新手应该看哪些书籍,怎么样才行学好J2EE.其实各人都各人的学习方法,一个人的不一定适合另一个人,我在这里就我的学习路径,给大家列举一下,希望能提供一些参考.(申明:这里我不谈首先学习什么 ...
最新文章
- 从经典问题开始教你如何入门计算机视觉!贴心!
- python多张图片合并拼接,python制作sprite图、雪碧图
- HTTP精简教程一:Web网络基础
- suse软件管理程序zypper
- 笔记-高项案例题-2014年下-计算题
- 最佳的七十五个网络分析和安全工具
- hihocoder offer收割编程练习赛8 B 拆字游戏
- linux下生成coredump文件
- idal 创建springboot 项目_SpringBoot教程:Maven方式创建SpringBoot项目
- 集结号!四大国产开源数据库共聚申城,共话未来技术演进
- java 单选按钮怎么重置_单选框-复选框重置的方法
- 小程序支付完整过程。足够详细!
- C#Winform预览PDF
- 学科前沿讲座 文本分类TextClassfication
- android华为登录云服务,华为云服务登录网页版
- Scrapy抓取新浪微博
- python非线性最小二乘拟合_非线性函数的最小二乘拟合——兼论Jupyter notebook中使用公式 [原创]...
- java精尽面试题MySQL面试高频一百问(工程师方向)
- 192.168.1.10/27,后面的27是什么意思,这样写限制的网络是哪些?
- 在php中ceil是什么意思,PHP ceil()函数
热门文章
- OA系统如何助力企业行政管理?
- 计算机网络数据吞吐量,计算机网络的性能指标
- 第一次破解unity3d安卓游戏笔记+IL指令集合
- 计算机删除程序后不能上网,把所有驱动程序全部卸载后电脑还能用吗?还能 – 手机爱问...
- 如何判断自己的手机是山寨机?如何判断山寨机的芯片型号和平台?
- java visual foxpro_从Java访问Visual FoxPro数据库
- 为你写诗(LSTM 诗歌生成器)
- java项目打包windows服务
- SPSS典型相关分析(Canonical Correlation Analysis)案例(SPSS25最新版)
- CSS3与CSS的区别有哪些?