微信WeixinJSBridge API使用实例


Posted in Javascript onMay 25, 2015

注意:请在微信中测试

<!DOCTYPE html>
<html>
 <head>
 <title>微信WeixinJSBridge API</title> 
 <meta charset="utf-8" /> 
 <script type="text/javascript">
(function(){
var a=document.getElementsByTagName("html")[0];
window.Session={appDomain:a.getAttribute("data-app-domain")||"",staticDomain:a.getAttribute("data-static-domain")||""}
})();
 
window.registNS=function(fullNS,isIgnorSelf){
var reg=/^[_$a-z]+[_$a-z0-9]*/i;var nsArray=fullNS.split(".");
var sEval="";
var sNS="";
var n=isIgnorSelf?nsArray.length-1:nsArray.length;
for(var i=0;i<n;i++){
  if(!reg.test(nsArray[i])){throw new Error("Invalid namespace:"+nsArray[i]+"");
  return
  }
  if(i!=0){sNS+="."}
  sNS+=nsArray[i];
  sEval+="if(typeof("+sNS+")=='undefined') "+sNS+"=new Object();
  else "+sNS+";"
}
if(sEval!=""){
return eval(sEval)
}
return{}
 
};
 
</script> 
 </head> 
 <body>
 <section class="mod-page-body"> 
  <div class="mod-page-main wordwrap clearfix"> 
  <div class="mod-pageheader"></div> 
  <div class="mod-pagecontent"> 
   <div class="mod-weixinjsapi"> 
   <div class="x-desc">
    微信客户端自带的Js Api:WeixinJSBridge
   </div> 
   <div id="WeixinJsApi"> 
    <input type="button" id="imagePreview" value="图片预览" /> 
    <input type="button" id="profile" value="查看profile" /> 
    <a href="weixin://profile/gh_412d74fbb474">企业微信小助手</a> 
    <input type="button" id="shareWeibo" value="分享微博" /> 
    <input type="button" id="shareFB" value="分享facebook" /> 
    <input type="button" id="addContact" value="添加联系人" /> 
    <input type="button" id="scanQRCode" value="扫描二维码" /> 
    <input type="button" id="jumpToBizProfile" value="跳转到指定公众账号页面" /> 
    <input type="button" id="toggleMenuBtn" value="隐藏右上角按钮" /> 
    <input type="button" id="toggleToolbar" value="隐藏底部导航栏" /> 
    <input type="button" id="getNetType" value="获取网络状态" /> 
    <input type="button" id="closeWindow" value="关闭" /> 
    <input type="button" id="getBrandWCPayRequest" value="发起公众号微信支付" /> 
    <input type="button" id="setPageState" value="设置页面状态" /> 
    <input type="button" id="sendEmail" value="发邮件" /> 
    <input type="button" id="openSpecificView" value="微信团队打开webView,跳到指定页面" /> 
    <input type="button" id="getCanIAPPay" value="getCanIAPPay" /> 
    <input type="button" id="getBrandIAPPayRequest" value="发起公众号IAP支付" /> 
    <input type="button" id="openUrlByExtBrowser" value="用safari打开指定链接" /> 
    <input type="button" id="openProductView" value="跳转微信商品页" /> 
    <input type="button" id="openLocation" value="查看地理位置" /> 
    <input type="button" id="timelineCheckIn" value="朋友圈签到" /> 
    <input type="button" id="getBrandWCPayCreateCreditCardRequest" value="开通微信信用卡" /> 
    <input type="button" id="geoLocation" value="获取地理位置" /> 
    <input type="button" id="getInstallState" value="获取某app是否安装" /> 
    <input type="button" id="editAddress" value="公众号编辑收货地址" /> 
    <input type="button" id="getLatestAddress" value="公众号获取最近的收货地址" /> 
    <input type="button" id="launch3rdApp" value="启动第三方APP" /> 
    <input type="button" id="jumpWCMall" value="跳转微信商品购买界面" /> 
    <input type="button" id="addEmoticon" value="添加表情" /> 
    <input type="button" id="cancelAddEmoticon" value="取消下载某表情" /> 
    <input type="button" id="hasEmoticon" value="查询是否存在某表情" /> 
   </div> 
   </div> 
  </div> 
  </div> 
 </section> 
 <script>
function onBridgeReady() {
  WeixinJSBridge.on('menu:share:appmessage', function(argv) 
  {
    WeixinJSBridge.invoke('sendAppMessage',{
          "link":"http://m.exmail.qq.com/",
          "desc":"desc",
          "title":"title for WeiXinJsBridge"
    }, function(res) {
      WeixinJSBridge.log(res.err_msg);
    });
  });
  WeixinJSBridge.on('menu:share:timeline', function(argv) 
  {
  WeixinJSBridge.invoke("shareTimeline",{
    "link":"http://m.exmail.qq.com",
    "img_url":"http://rescdn.qqmail.com/bizmail/zh_CN/htmledition/images/bizmail/v3/logo1ca3fe.png",
    "img_width":"172",
    "img_height":"40",
    "desc":"i am description",
    "title":"just test from WeixinJsBridge"
    },
    function(e){
    alert(e.err_msg);
    })
  });
}
 
if (typeof WeixinJSBridge === "undefined"){
  if (document.addEventListener){
    document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
  }
}else{
  onBridgeReady();
}
 
  var menuHidden=!1,toolbarHidden=!1,netType={"network_type:wifi":"wifi网络","network_type:edge":"非wifi,包含3G/2G","network_type:fail":"网络断开连接","network_type:wwan":"2g或者3g"};
  document.addEventListener("WeixinJSBridgeReady",function(){
      document.getElementById("imagePreview").addEventListener(
      "click",function(){
                WeixinJSBridge.invoke("imagePreview",{
        "urls":[
        "http://rescdn.qqmail.com/bizmail/zh_CN/htmledition/images/bizmail/v3/logo1ca3fe.png",
        "http://rescdn.qqmail.com/bizmail/zh_CN/htmledition/images/bizmail/v3/icons_features1ca3fe.png",
        "http://rescdn.qqmail.com/bizmail/zh_CN/htmledition/images/bizmail/v3/icons_workStyle1ca3fe.png"
        ],
        "current":"http://rescdn.qqmail.com/bizmail/zh_CN/htmledition/images/bizmail/v3/icons_features1ca3fe.png"
        })
            },!1),
    document.getElementById("profile").addEventListener(
      "click",function(){
        alert("profile clicked");
        WeixinJSBridge.invoke("profile",{
          "username":"gh_412d74fbb474",
          "nickname":"企业微信小助手"  
        })
      },!1),
    document.getElementById("shareWeibo").addEventListener(
      "click",function(){
        WeixinJSBridge.invoke("shareWeibo",{
          "type":"link",
          "link":"http://m.exmail.qq.com"
        },
        function(e){
          alert(e.err_msg);
        })
      },!1),
    document.getElementById("shareFB").addEventListener(
      "click",function(){
        WeixinJSBridge.invoke("shareFB",{
          "link":"http://m.exmail.qq.com"
        })
      },!1),
    document.getElementById("scanQRCode").addEventListener(
      "click",function(){
        WeixinJSBridge.invoke("scanQRCode",{
        })
      },!1),
    document.getElementById("addEmoticon").addEventListener(
      "click",function(){
        WeixinJSBridge.invoke("addEmoticon",{
          "url":"http://rescdn.qqmail.com/bizmail/zh_CN/htmledition/images/bizmail/v3/icons_features1ca3fe.png",
          "thumb_url":"http://rescdn.qqmail.com/bizmail/zh_CN/htmledition/images/bizmail/v3/logo1ca3fe.png"
 
        },
        function(e){
                    alert(e.err_msg);
                })
      },!1),
    document.getElementById("cancelAddEmoticon").addEventListener(
      "click",function(){
        WeixinJSBridge.invoke("cancelAddEmoticon",{
          "url":"http://rescdn.qqmail.com/bizmail/zh_CN/htmledition/images/bizmail/v3/icons_features1ca3fe.png"
 
        },
        function(e){
                    alert(e.err_msg);
                })
      },!1),
    document.getElementById("hasEmoticon").addEventListener(
      "click",function(){
        WeixinJSBridge.invoke("hasEmoticon",{
          "url":"http://rescdn.qqmail.com/bizmail/zh_CN/htmledition/images/bizmail/v3/icons_features1ca3fe.png"
 
        },
        function(e){
                    alert(e.err_msg);
                })
      },!1),
    document.getElementById("addContact").addEventListener(
      "click",function(){
        WeixinJSBridge.invoke("addContact",{
          "webtype":"1",
          "username":"gh_412d74fbb474"
        },
        function(e){
          alert(e.err_msg);
        })
      },!1),
    document.getElementById("jumpToBizProfile").addEventListener(
      "click",function(){
        WeixinJSBridge.invoke("jumpToBizProfile",{
          "tousername":"gh_2248a2ade13e"
        },
        function(e){
          alert(e.err_msg);
        })
      },!1),
    document.getElementById("toggleMenuBtn").addEventListener(
      "click",function(){
        menuHidden?
        (WeixinJSBridge.call("showOptionMenu"),menuHidden=!1,this.value="隐藏右上角按钮")
        :
        (WeixinJSBridge.call("hideOptionMenu"),menuHidden=!0,this.value="显示右上角按钮")
      },!1),
    document.getElementById("toggleToolbar").addEventListener(
      "click",function(){
        toolbarHidden?
        (WeixinJSBridge.call("showToolbar"),toolbarHidden=!1,this.value="隐藏底部导航栏")
        :
        (WeixinJSBridge.call("hideToolbar"),toolbarHidden=!0,this.value="显示底部导航栏")
      },!1),
    document.getElementById("getNetType").addEventListener(
      "click",function(){
        WeixinJSBridge.invoke("getNetworkType",{},
          function(e){
            alert(netType[e.err_msg])
          })
      },!1),
     document.getElementById("closeWindow").addEventListener(
            "click",function(){
                WeixinJSBridge.invoke("closeWindow",{},function(e){})
            },!1),
    document.getElementById("getBrandWCPayRequest").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("getBrandWCPayRequest",{
        "appId" : "wxf8b4f85f3a794e77", //公众号名称,由商户传入
        "timeStamp" : "189026618", //时间戳 这里随意使用了一个值
        "nonceStr" : "adssdasssd13d", //随机串
        "package" :
        "body=xxx&fee_type=1&input_charset=GBK¬ify_url=http&out_trade_no=16642817866003386000&partner=1900000109&return_url=http&spbill_create_ip=127.0.0.1&total_fee=1&sign=273B7EEEE642A8E41F27213D8517E0E4", //扩展字段,由商户传入
        "signType" : "SHA1", //微信签名方式:sha1
        "paySign" : "b737015b5b1eabe5db580945a07eac08c7bb55f8" //微信签名
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("setPageState").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("setPageState",{
        "state" : "1"
        })
      },!1),
 
    document.getElementById("sendEmail").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("sendEmail",{
        "title" : "title!",
        "content" : "i am an Email!", //时间戳 这里随意使用了一个值
        },
        function(e){
    //     alert(e.err_msg)
        })
      },!1),
    document.getElementById("openSpecificView").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("openSpecificView",{
        "specificview" : "contacts"
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("getCanIAPPay").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("getCanIAPPay",{ },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("getBrandIAPPayRequest").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("getBrandIAPPayRequest",{
        "appId" : "wxf8b4f85f3a794e77", //公众号名称,由商户传入
        "timeStamp" : "189026618", //时间戳 这里随意使用了一个值
        "nonceStr" : "adssdasssd13d", //随机串
        "package" : "bankType=CITIC_CREDIT&bankName=%e4%b8%ad%e4%bf%a1%e9%93%b6%e8%a1%8c&sign=CF8922F49431FFE8A1834D0B32B25CE3",
        //扩展字段,由商户传入
        "signType" : "SHA1", //微信签名方式:sha1
        "paySign" : "1e6f13f78ca0ec43fbb80899087f77568af66987" //微信签名
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("openLocation").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("openProductView",{  
        "latitude" : 23.113, //纬度
        "longitude" : 113.23, //经度
        "name" : "TIT创意园", //POI名称
        "address" : "广州市海珠区新港中路397号", //地址
        "scale" : 14, //地图缩放级别
        "infoUrl" : "http://weixin.qq.com/", //查看位置界面底部的超链接        
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("timelineCheckIn").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("timelineCheckIn",{  
        "img_url": "http://mmsns.qpic.cn/mmsns/RLllkTm3DUdV24xbZnKicx9jJWxXI0Bq84zzbtibGuRyk/0", // 分享到朋友圈的缩略图
        "img_width": "640", // 图片的长度
        "img_height": "640", // 图片高度
        "link": "http://news.qq.com/zt2012/cxkyym/index.htm", // 连接地址
        "desc": "这个是描述啊啊", // 描述
        "title": "朝鲜称中国渔船越界捕捞", // 分享标题
        "latitude" : 23.113, //纬度
        "longitude" : 113.23, //经度
        "poiId" : "dianping_2331037", //商户id
        "poiName" : "TIT创意园", //POI名称
        "poiAddress" : "广州市海珠区新港中路397号", //地址
        "poiScale" : 14, //地图缩放级别
        "poiInfoUrl" : "http://weixin.qq.com/" //查看位置界面底部的超链接
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("geoLocation").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("geoLocation",{  
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("getBrandWCPayCreateCreditCardRequest").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("getBrandWCPayCreateCreditCardRequest",{ 
        "appId" : "wxf8b4f85f3a794e77", //公众号名称,由商户传入
        "timeStamp" : "189026618", //时间戳 这里随意使用了一个值
        "nonceStr" : "adssdasssd13d", //随机串
        "package" : "bankType=CITIC_CREDIT&bankName=%e4%b8%ad%e4%bf%a1%e9%93%b6%e8%a1%8c&sign= CF8922F49431FFE8A1834D0B32B25CE3",
        //扩展字段,由商户传入
        "signType" : "SHA1", //微信签名方式:sha1
        "paySign" : "1e6f13f78ca0ec43fbb80899087f77568af66987" //微信签名
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("getInstallState").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("getInstallState",{  
          "packageUrl":"teamcircle://"
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("openProductView").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("openProductView",{  
          "productInfo":"json"
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("getLatestAddress").addEventListener(
        "click",function(){
        WeixinJSBridge.invoke("getLatestAddress",{ 
          "appId" : "wxf8b4f85f3a794e77", //公众号名称,由商户传入
          "timeStamp" : "189026618", //时间戳 这里随意使用了一个值
          "nonceStr" : "adssdasssd13d", //随机串
          "signType" : "SHA1", //微信签名方式:sha1
          "addrSign" : "b737015b5b1eabe5db580945a07eac08c7bb55f8", //微信签名
          "scope"  : "snsapi"
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("editAddress").addEventListener(
        "click",function(){
        WeixinJSBridge.invoke("editAddress",{  
          "appId" : "wxf8b4f85f3a794e77", //公众号名称,由商户传入
          "timeStamp" : "189026618", //时间戳 这里随意使用了一个值
          "nonceStr" : "adssdasssd13d", //随机串
          "signType" : "SHA1", //微信签名方式:sha1
          "addrSign" : "b737015b5b1eabe5db580945a07eac08c7bb55f8", //微信签名
          "scope"  : "snsapi"
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("launch3rdApp").addEventListener(
        "click",function(){
        WeixinJSBridge.invoke("launch3rdApp",{ 
          "appId" : "wx5823bf96d3bd56c7", //公众号名称,由商户传入
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("jumpWCMall").addEventListener(
        "click",function(){
        WeixinJSBridge.invoke("jumpWCMall",{  
          "appId" : "wx5823bf96d3bd56c7", //公众号名称,由商户传入
          "funcId":"1000"
        },
        function(e){
          alert(e.err_msg)
        })
      },!1),
    document.getElementById("openUrlByExtBrowser").addEventListener(
      "click",function(){
      WeixinJSBridge.invoke("openUrlByExtBrowser",{
        "url" : "http://m.exmail.qq.com"
        },
        function(e){
          alert(e.err_msg)
        })
      },!1)
    }
  );
</script> 
 </body>
</html>
Javascript 相关文章推荐
JavaScript中的style.cssText使用教程
Nov 06 Javascript
JavaScript设计模式之原型模式(Object.create与prototype)介绍
Dec 28 Javascript
jQuery实现可展开合拢的手风琴面板菜单
Sep 15 Javascript
Bootstrap每天必学之按钮
Nov 26 Javascript
JQuery 获取多个select标签option的text内容(实例)
Sep 07 jQuery
vue双向数据绑定知识点总结
Apr 18 Javascript
浅谈Angular HttpClient简单入门
May 04 Javascript
webpack4+Vue搭建自己的Vue-cli项目过程分享
Aug 29 Javascript
使用pkg打包Node.js应用的方法步骤
Oct 19 Javascript
mockjs+vue页面直接展示数据的方法
Dec 19 Javascript
Vue侦测相关api的实现方法
May 22 Javascript
利用 JavaScript 实现并发控制的示例代码
Dec 31 Javascript
jquery.validate使用时遇到的问题
May 25 #Javascript
微信内置浏览器私有接口WeixinJSBridge介绍
May 25 #Javascript
微信浏览器内置JavaScript对象WeixinJSBridge使用实例
May 25 #Javascript
JS中的THIS和WINDOW.EVENT.SRCELEMENT详解
May 25 #Javascript
jQuery实现表格行上移下移和置顶的方法
May 22 #Javascript
jquery控制表单输入框显示默认值的方法
May 22 #Javascript
jQuery实现自动滚动到页面顶端的方法
May 22 #Javascript
You might like
PHP 替换模板变量实现步骤
2009/08/24 PHP
PHP常用技巧总结(附函数代码)
2012/02/04 PHP
实例介绍PHP的Reflection反射机制
2014/08/05 PHP
PHP中提问频率最高的11个面试题和答案
2014/09/02 PHP
Laravel框架表单验证详解
2014/09/04 PHP
PHP连接Nginx服务器并解析Nginx日志的方法
2015/08/16 PHP
php实现mysql数据库连接操作及用户管理
2015/11/08 PHP
javascript 页面只自动刷新一次
2009/07/10 Javascript
window.showModalDialog参数传递中含有特殊字符的处理方法
2013/06/06 Javascript
JavaScript设置首页和收藏页面的小例子
2013/11/11 Javascript
解析JSON对象与字符串之间的相互转换
2013/12/18 Javascript
JS中判断null、undefined与NaN的方法
2014/03/24 Javascript
jQuery leonaScroll 1.1 自定义滚动条插件(推荐)
2016/09/17 Javascript
JS实现的系统调色板完整实例
2016/12/21 Javascript
vue.js的安装方法
2017/05/12 Javascript
nodejs+websocket实时聊天系统改进版
2017/05/18 NodeJs
VUE2.0+Element-UI+Echarts封装的组件实例
2018/03/02 Javascript
vuex存取值和映射函数使用说明
2020/07/24 Javascript
Python cookbook(数据结构与算法)筛选及提取序列中元素的方法
2018/03/19 Python
Django如何将URL映射到视图
2019/07/29 Python
Python读写文件模式和文件对象方法实例详解
2019/09/17 Python
Python : turtle色彩控制实例详解
2020/01/19 Python
质检的岗位职责
2013/11/17 职场文书
工作的心得体会
2013/12/31 职场文书
商业活动邀请函
2014/02/04 职场文书
少年闰土教学反思
2014/02/22 职场文书
《王二小》教学反思
2014/02/27 职场文书
教师年度考核评语
2014/04/28 职场文书
升旗仪式演讲稿
2014/05/08 职场文书
2014年服装销售工作总结
2014/11/27 职场文书
2015年医院护理部工作总结
2015/04/23 职场文书
2015年教师党员承诺书
2015/04/27 职场文书
投诉书范文
2015/07/02 职场文书
Oracle笔记
2021/04/05 Oracle
vue Element-ui表格实现树形结构表格
2021/06/07 Vue.js
springboot 多数据源配置不生效遇到的坑及解决
2021/11/17 Java/Android