今天说说微商城项目中用到的扫一扫这个功能,分享一下,希望对各位有所帮助。

前提:要有公众号,和通过微信认证,绑定域名,得到相应信息,appid,appsecret等。

微信开发文档:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115

来看看效果图:

1:引入JS文件

2:config接口注入权限验证配置

<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript"></script>
wx.config({
debug: false,
appId: appid,
timestamp: timestamp,
nonceStr: noncestr,
signature: signature,
jsApiList: [
'scanQRCode'//使用的JS接口
]
});

注:所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次,对于变化url的SPA的web app可在每次url变化时进行调用,

目前Android微信客户端不支持pushState的H5新特性,所以使用pushState来实现web app的页面会导致签名失败,此问题会在Android6.2中修复)。

在Html中添加一个Button按钮,添加扫一扫点击事件调用扫一扫功能

   $(function () {
$("#qrscan").click(function () {
wx.scanQRCode({
// 默认为0,扫描结果由微信处理,1则直接返回扫描结果
needResult : 1,
scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码,默认二者都有
success : function(res) {
//扫码后获取结果参数赋值给Input
var result = res.resultStr;
layer.success('扫码成功'+result);
$("#qrcodevalue").text(result);//扫码后结果显示在页面上
}
});
}); });

注:我用到的参数  appid,appsecret等信息在php代码中。

PHP--------微信网页开发实现微信扫码功能的更多相关文章

  1. 微信网页开发调用微信jssdk接口遇到的坑以及最终解决方法 (持续更新)

    1.微信网页开发调用jssdk时报permission denied 大致是两个原因 (1)首先注册时未将你所调用的接口名字添加至jsApiList (2)第二个就是你的这个公众号没有权限使用这个ap ...

  2. 微信小程序实现连续扫码功能(uniapp)

    注:本文使用的是 uniapp 语法. 微信小程序提供了扫码API:wx.scanCode,但它只能扫一次码,想要实现连续扫码,需要借用 camera 组件.camera 组件不仅能拍照,还具有扫码功 ...

  3. 10天学会phpWeChat——第十天:phpWeChat的会员注册、登录以及微信网页开发

    通过前面的系列教程,我们系统的讲解了phpWeChat从视图端.控制器端到模型端的操作流程:熟悉了phpWeChat的目录结构:掌握了视图端模板如何创建一个丰富的表单和模型端如何操作数据库.这一切都是 ...

  4. 【原创分享·微信支付】 C# MVC 微信支付教程系列之扫码支付

    微信支付教程系列之扫码支付                  今天,我们来一起探讨一下这个微信扫码支付.何为扫码支付呢?这里面,扫的码就是二维码了,就是我们经常扫一扫的那种二维码图片,例如,我们自己添 ...

  5. C# 微信支付教程系列之扫码支付

    微信支付教程系列之扫码支付            今天,我们来一起探讨一下这个微信扫码支付.何为扫码支付呢?这里面,扫的码就是二维码了,就是我们经常扫一扫的那种二维码图片,例如,我们自己添加好友的时候 ...

  6. 微信开发+百度AI学习:微信网页开发环境搭建

    参考微信官方文档:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 两步即可获取微信网页开发能力 STEP1: ...

  7. 手把手实现微信网页授权和微信支付,附源代码(VUE and thinkPHP)

    wechat github 手把手实现微信网页授权和微信支付,附源代码(VUE and thinkPHP) 概述 公众号开发是痛苦的,痛苦在好多问题开发者文档是没有提到的,是需要你猜的. 在开发过程中 ...

  8. Canvas与Image互相转换示例以及利用该技术实现微信长按自动识别二维码功能

    现在扫描二维码已经很普遍,微信扫一扫即可,但是如果二维码是在自己的手机上呢?那就要用到微信里的一个功能了,手指长按二维码,会弹出自动识别的选项,点确定就可以看到二维码的内容了.那么怎么通过前端实现这个 ...

  9. VueJs单页应用实现微信网页授权及微信分享功能

    在实际开发中,无论是做PC端.WebApp端还是微信公众号等类型的项目的时候,或多或少都会涉及到微信相关的开发,最近公司项目要求实现微信网页授权,并获取微信用户基本信息的功能及微信分享的功能,现在总算 ...

  10. ionic3 实现扫码功能

    ionic3 通过插件phonegap-plugin-barcodescanner,调用机器硬件摄像头实现扫码功能. 首先当然先了解下 phonegap-plugin-barcodescanner,这 ...

随机推荐

  1. 热词统计以及Quartz.net的简单使用

    一.热词统计 方案一: 设计一个表:ID       KeyWord     Count 当用户再输入框中查询的时候,我们就往表中插入数据,在插入之前首先判断是否已经存在keyword,存在的话,让C ...

  2. hdu2196 Computer【树形DP】【换根法】

    Computer Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Su ...

  3. 奇怪的Visual Studio 2013停止响应问题

    昨天开始遭遇这个问题,今天再次遭遇. 疑似问题发生在写代码的窗口中复制/粘贴时(有待进一步确认触发条件),突然停止响应,出现下面的对话框: 对话框中的文字为: Waiting for a requir ...

  4. 40个DBA日常维护的SQL脚本

    1.查询碎片程度高的表 条件为什么block>100,因为一些很小的表,只有几行数据实际大小很小,但是block一次性分配就是5个(11g开始默认一次性分配1M的block大小了,见create ...

  5. Python开发【模块】:PyMySQL

    PyMySQL 1.安装 [root@localhost ~]# pip install PyMySQL 2.初识 创建数据表结构: mysql> CREATE TABLE `users` ( ...

  6. Python开发【数据结构】:算法(一)

    算法基础 1.什么是算法? 算法(Algorithm):一个计算过程,解决问题的方法 2.复习:递归 递归的两个特点: 调用自身 结束条件 两个重要递归函数的对比: # 由大到小 def func3( ...

  7. OC发送短信

    - (IBAction)sendMessage1:(id)sender { UIAlertView *alert = [[UIAlertView alloc]initWithTitle:@" ...

  8. [golang grpc] 框架介绍

    官方网站 http://www.grpc.io/ http://www.grpc.io/docs/quickstart/go.html grpc安装 • go安装 目前grpc需要go 1.5以上版本 ...

  9. cocos代码研究(18)Widget子类Slider学习笔记

    理论基础 滑动条控件. 代码实践 实例: // Create the slider Slider* slider = Slider::create(); slider->loadBarTextu ...

  10. curl基本使用

    curl简介 linux curl是一个利用URL规则在命令行下工作的文件传输工具.它支持文件的上传和下载. curl可以使用URL的语法模拟浏览器来传输数据,因为它是模拟浏览器,因此它同样支持多种协 ...