Bridge API

调用前需要在页面引用 bridge 的js, 最新地址为

<script src="http://cdnst.immomo.com/momofes/js/mobile/momo_bridge.2.0.4.min.js"></script>

如果需要测试是否在陌陌客户端内,可以用如下功能:

/momoWebView/.test(window.navigator.userAgent)

获取权限

在页面通过sign获取权限

mm.invoke('initConfig' , {
   randomstr: 'keigaojkl3j48afefl32',  //随机串
   timestamp: 1433391148446,           //第三方应用服务器时间
   sign: '40B4A72E7ACB468AAF1B65C47CE9875AEB8B7D74',
                                   //签名,第三方应用通过ticket,timestamp,randomstr,url等参数,
                                   //按照签名规则之后的sha1值
   client_id: '925ef991ec30ccc0'   //第三方应用ID
   callback: 'callback.config'     //客户端执行完initConfig,调用callback, 是页面上的全局变量。
   error: 'mm.configError',        //调用其他invoke方法,没有权限时调用
 })

@return:

//callback返回
{
  status: 0         //状态  0-成功  1-失败
  message: '权限验证成功'
}
//error返回
{
  name:'doAlipay'     //方法名
  message: '没有权限'
}

唤起分享面板

配置

var shareConfig = {
    title: '陌陌官网',                   // 默认标题
    text: '总有新奇在身边',              // 默认内容详情
    url: 'http://www.immomo.com',        // 默认链接: 注意需要带上完整的protocal
    pic: 'http://chatst.immomo.com/webim/09/01/09016D25-8F82-434D-97C3-BD774F6E1C6A_L.jpg',
                                         // 默认分享图片,注意需要是外网可用的图片链接
    callback: '',                        // 回调函数
    apps: ['qzone', 'sina', 'momo_feed', 'momo_contacts', 'browser', 'qq', 'weixin', 'weixin_friend'],
                                         // Array: 页面分享时所需要显示的渠道
    configs: {                           // 页面分享的Apps的配置
                                         // 当分享时,相应渠道优先使用这里的配置。
                                         // 如果没有,则使用默认配置。
        momo_feed: {                     // 留言板单独配置
            title:'feed',
            text:'留言板',
            url:'http://www.immomo.com',
            pic:'http://www.immomo.com/static/w5/img/website/header-bg2.jpg',   //pic为空或者没有这个字段的话则不显示图片
            sdk: 1,                     // 用户可自定义分享文字
            resource:{
                title:"陌陌明信片",
                desc:"来自陌陌用户的祝福",
                icon: 'http://cdnst.momocdn.com/static/m4/img/citycard/share-icon.png', // 小尾巴图标
                link: 'http://m.immomo.com/inc/citycard/welcome/entry', // 小尾巴为链接时使用
                debug: 1,               // 当debug 存在且为1时,此动态不会分享到附近。

            }
        }
    }
}

初始化右上角分享按钮

mm.init({
            enable : {
                share : 0,
                ui_btn: 1
            },
            share:  shareConfig,
            ui_btn: {
                title: '',
                dropdown: 0,
                buttons: [{
                        'text': '分享',
                        'action': 1,
                        'param': shareConfig,
                }]
          }
})

直接调起分享面板

mm.invoke('callShare' , shareConfig)

返回值(从callback里面返回):

{
  status: 0,          // Int: 0成功,1-失败
  message: '分享成功'
}

检查app是否安装

我们可以用 bridge 提供的 checkGames 方法检查某个App是否安装:

需要先引入bridge,如 cdnst.immomo.com/momofes/js/mobile/momo_bridge.2.0.3.min.js

请下载后放到自己的domain下。

之后用如下代码进行检查

// 在陌陌客户端内且陌陌版本大于6.0
if (mm.is_webview && mm.momo_version >= 6.0 ){

   var app_list = {
       'xiami': { schema: 'xiami://music' }
    };

   mm.invoke('checkGames', {games:app_list}, function(resp){

       var data = JSON.parse(resp);
       // In iOS it's true/false
       if (data.games.xiami == 1) {
           alert('虾米已经安装')
       } else {
           alert('虾米没有安装')
           // 下载虾米
           if (mm.is_android) {
               location.href = 'http://download.taobaocdn.com/wireless/xiami-android-spark/latest/xiami-android-spark_10001593.apk'
           } else if ( mm.is_ios ){
               location.href = 'https://itunes.apple.com/cn/app/xia-mi-yin-le/id595594905?mt=8'
           } else {
               location.href = 'http://xiami.com'
           }
       }

   })
} else {
    alert('请下载最新陌陌客户端')
    location.href = 'http://immomo.com'
}

调用系统相机、相册

如果需要在页面上调用图片, 则需要调用一个bridge方法readImage

callback里面会获得图片的base64编码的data,页面获得后,可以直接显示,以及传给服务器进行保存。

@param

{
    id: id,                  // id 是会回传到callback的id
    method: method,          // method 可以是 0、1、2 ,分别指相册,拍摄,用户选择
    type: type,              // type是会回传到callback的type
    callback: 'CallBack'
}
<script src="http://cdnst.immomo.com/momofes/js/mobile/momo_bridge.2.0.4.min.js"></script>

<div>

    <a href="#" id='image_btn'>Read Image</a>

    <img src="" alt="" id='image'>

</div>

<script>

        image_btn.addEventListener('click', function(e){
            mm.invoke('readImage', {"id":'image', "method": 0, "type": "base64"},
                    function(id, data, size, type){
                        document.getElementById(id).src="data:image/jpeg;base64,"+data;
                    }
            )
        });

</script>

显示地理位置

获取网络类型

@return:

{
    network_type:'3g'  // String: 网络类型
                       //   android: 2g,3g,4g,wifi,none,unknow
                       //   ios: 2g,3g,4g,wifi,none,unknow   (>=v6.3c)
                       //   ios: wwan,wifi,none,unknow   (<v6.3c)
}

跳转到陌陌话题列表

使用前需要判断在陌陌客户端

mm.invoke('directGoto' , {
  param:'[|goto_topiclist|参数(话题id)]'  // String
})