UniApp 内嵌 H5 调用扫码_uniapp h5扫码

首先，我要说明的是：H5不支持扫码！！！

首先，我要说明的是：H5不支持扫码！！！

首先，我要说明的是：H5不支持扫码！！！

    注：重要的事情说三遍（代码随附件上传）

---

前期踩坑

实现思路

    1、使用原生代码去调用扫码

    2、使用如zxing.js、QuaggaJS和Instascan第三方插件

    3、前端拍照上传至后台扫码，然后识别图片（拍照有很糊的阴影效果，识别不出来，别去试了除非弄高端点的人工智能识别之类的可以试试）

注：很遗憾上诉思路都是不行的，我全部全部都试过，包括你想到的和想不到的我都试过了，得出最后的结论H5不支持扫码！！！

原因

    图片上说的是插件都可以用但是不是https就会有安全策略问题，不好意思用不了，有些博主推荐可以配置google的配置修改一下就可以掉起（反正我试了没用处）

解决方案

    使用uniApp内嵌H5，用的是web-view调用的，所以我们可以通过uni的方法进行跳转及通信
    步骤：

            1、跳转到H5页面（一般是首页）

            2、销毁当前页面并且跳转到uni的指定路由页面下

            3、在此页面打开扫码

            4、拿到扫码内容后跳转至中间页面

            5、再次拿到内容跳转回刚才的页面（不是同一个路由，这个是点击扫码的页面）

跳转到H5页面

跳转到H5页面

销毁当前页面并且跳转到uni的指定路由页面下（一般是首页）

注意引用uni的js文件

跳转到uni的指定路由页面下

在此页面打开扫码

在此页面打开扫码

拿到扫码内容后跳转至中间页面

再次拿到内容跳转回刚才的页面（不是同一个路由，这个是点击扫码的页面）

拿到扫码内容后跳转至中间页面

自此就搞定了～

 

最后：感谢能看到最后的朋友，能看到这里的也确实是在这个问题上遇到问题了，真心希望该博客能够帮助到你，博主小开发一名，平时都是白嫖博客多一点，哪像现在还自己动手写这在以前是万万做不到的，但也确实是这次太坑了，自己淋过雨所以想给大家撑把伞，也希望给点个赞吧，你的支持是我前进的动力