【5+App】第三方分享的思路

newsning發表於2019-03-19
APP

大家好

2016-12-25 聖誕節這天 我失戀了

現實

1）App能分享一篇文章，能分享一個活動等，到第三方平臺
2）展示相應的標題、內容以及連結
3）進入相應的連結可以喚醒App，不存在客戶端時展示App下載頁
4）被喚醒App後，展示相應的分享詳細內容

1

利用5+的第三方分享，可以把想分享的資訊傳送到第三方平臺
相關文章：
分享外掛開發指南
在Dcould社群搜尋【分享】相關文章

我也簡單的寫過一個es6版本share

let __shares = (function () {
    let shares
    return newShares => {
        if (newShares) {
            shares = newShares
        }
        return shares
    }
})()

let __shareKv = {
    wxhy: 'WXSceneSession',     //微信好友
    wxpyq: 'WXSceneTimeline',   //微信朋友圈
    qq: 'qq',                   //QQ好友
    sinaweibo: 'sinaweibo',     //新浪微博
}



class Share {

    constructor(type, fn, op, context) {
        this.config = {
            type, //分享平臺
            fn, //結果回撥
            op, //需要分享的內容配置
            context, //上下文
        }
        this._initCallback()
        this.start()
    }

    _initCallback() {
        this.ShareCallBack = function (...arg) {
            return this.config.fn.apply(this.config.context, arg)
        }
    }

    start() {
        this.getService(this.config.type, (idShare) => {
            this.sendShare(idShare, () => {
                this.ShareCallBack(null, idShare)
            })
        })
    }

    sendShare(share, sendCallBack) {
        let message = this._getShareInfo(share)
        share.send(message, () => {
            sendCallBack()
        }, (err) => {
            this.ShareCallBack(err, share)
        })
    }

    //分享資訊
    _getShareInfo(share) {

        let op = {
            extra: {
                scene: __shareKv[this.config.type]
            },
            href: this.config.op.href,
            title: this.config.op.title, //
            content: this.config.op.content, //

            pictures: [this.config.op.img],
            thumbs: [this.config.op.img],
        }

        if (!op.href) {
            delete op.title
            delete op.content
        }
        return op
    }


    //獲取授權
    _getAuth(share, authCallBack) {
        if (!share.authenticated) {
            share.authorize(() => {
                authCallBack()
            }, (...err) => {
                return this.ShareCallBack.apply(null, err)
            });
        } else {
            authCallBack()
        }
    }

    //透過id 獲取服務
    _getService(id, CallBack) {
        if(!!~id.toString().indexOf('wx')){
            id = 'weixin'
        } 
        let shares = __shares()
        for (let i in shares) {
            console.log(JSON.stringify(shares[i]))
            if (id === shares[i].id) {
                CallBack && CallBack(shares[i])
                return shares[i]
            }
        }
    }


    //獲取服務  
    getService(id, Callback) {
        if (__shares()) {
            return this._getService(id, Callback)
        }
        this._getHtml5PlusServices((data) => {
            __shares(data)
            this._getService(id, Callback)
        })
    }


    //獲取裝置分享服務列表
    _getHtml5PlusServices(CallBack) {
        plus.share.getServices((services) => {
            CallBack(services)
        }, (err) => {
            this.ShareCallBack(err, null)
        })
    }

}

var sendShare = function (...arg) {
    return new Share(...arg)
}

export {
    sendShare
}

2

大概這樣用

                    //qq wxhy(微信好友) wxpyq(微信朋友圈) sinaweibo
                    sendShare('qq',function(err, data){
                        if(err){
                            data = err
                        }
                        console.log(JSON.stringify(data))
                    },{
                        img: '_www/img/vhp.png',//圖片地址
                        href: 'https://github.com/zhaomenghuan/vue-html5plus',//分享的超連結
                        title: '分享標題',//當且僅當href存在時有效
                        content: '分享內容'//當且僅當href存在時有效
                    })

ok，在這裡我並沒有配置分享的appkey，因為我用HBuilder的真機測試，大家如果打包釋出時請一一填補

clipboard.png

3

分享出去的資訊，如果才能喚醒App呢？
鴿了。

2019-03-19
筆者因為工作原因沒有太多時間更新該系列文章，技術棧也有所變化，且近來Dcloud的中心到放到了uni-app之上，所以希望大家能堅持初心，且適應變化。開頭還寫了我失戀了，沒想到都快過了3年了，誒

相關文章