首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

微信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>

微信WeixinJSBridge API使用实例

- Author -

junjie

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
一直复略了的一个问题，关于表单重复提交
Feb 15 Javascript
JavaScript初学者应注意的七个细节小结
Jan 30 Javascript
javascript正则表达式参数/g与/i及/gi的使用指南
Aug 27 Javascript
JS组件系列之Bootstrap table表格组件神器【终结篇】
May 10 Javascript
浅谈window.onbeforeunload() 事件调用ajax
Jun 29 Javascript
完美的js div拖拽实例代码
Sep 24 Javascript
javascript实现一个网页加载进度loading
Jan 04 Javascript
AngularJS实现的回到顶部指令功能实例
May 17 Javascript
了解VUE的render函数的使用
Jun 08 Javascript
解决antd日期选择组件,添加value就无法点击下一年和下一月问题
Oct 29 Javascript
vue 公共列表选择组件,引用Vant-UI的样式方式
Nov 02 Javascript
JavaScript实现页面高亮操作提示和蒙板
Jan 04 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
Xception(1) Lifecycle(1) ResNet50(1) Seaborn(1) PostMapping(1) 内存泄露(1) tensorflow(2) Inception(2) yolo3(1) Spring(9)
You might like
php中通过smtp发邮件的类,测试通过
2007/01/22 PHP
thinkPHP简单遍历数组方法分析
2016/05/16 PHP
php组合排序简单实现方法
2016/10/15 PHP
javascript hashtable实现代码
2009/10/13 Javascript
jQuery Clone Bug解决代码
2010/12/22 Javascript
页面定时刷新(1秒刷新一次)
2013/11/22 Javascript
js select option对象小结
2013/12/20 Javascript
Angularjs制作简单的路由功能demo
2015/04/14 Javascript
JQuery查找DOM节点的方法
2015/06/11 Javascript
jQuery实现的类似淘宝网站搜索框样式代码分享
2015/08/24 Javascript
详解Vue-基本标签和自定义控件
2017/03/24 Javascript
jQuery简介_动力节点Java学院整理
2017/07/04 jQuery
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
2018/08/28 jQuery
使vue实现jQuery调用的两种方法
2019/05/12 jQuery
Vue的生命周期操作示例
2019/09/17 Javascript
微信小程序实现多图上传
2020/06/19 Javascript
Vue 列表页带参数进详情页的操作(router-link)
2020/11/13 Javascript
Pandas探索之高性能函数eval和query解析
2017/10/28 Python
python八大排序算法速度实例对比
2017/12/06 Python
python模块之paramiko实例代码
2018/01/31 Python
tensorflow中next_batch的具体使用
2018/02/02 Python
Python 字符串转换为整形和浮点类型的方法
2018/07/17 Python
python set内置函数的具体使用
2019/07/02 Python
python使用正则表达式（Regular Expression）方法超详细
2019/12/30 Python
Django更新models数据库结构步骤
2020/04/01 Python
美国知名玩具品牌：Melissa & Doug
2016/08/16 全球购物
百思买加拿大：Best Buy Canada
2018/03/20 全球购物
艺术设计专业个人求职信
2014/04/10 职场文书
我爱我家教学反思
2014/05/01 职场文书
2014幼儿园教师师德师风演讲稿
2014/09/10 职场文书
银行竞聘报告范文
2014/11/06 职场文书
小学生毕业评语
2014/12/26 职场文书
大学毕业论文致谢词
2015/05/14 职场文书
大学生暑假实习总结
2015/07/13 职场文书
《日月潭》教学反思
2016/02/20 职场文书
HTML5 语义化标签(移动端必备)
2021/08/23 HTML / CSS