[5+App] third party sharing ideas

Keywords: Javascript JSON github Vue

Hello everyone

On December 25, 2016, Christmas day, I was lovelorn

reality

1) App can share an article, an activity, etc. to a third-party platform
2) display the corresponding title, content and links
3) enter the corresponding link to wake up the App, and display the App download page when there is no client
4) after being woken up, display the corresponding sharing details

1

With 5 + third-party sharing, you can send the information you want to share to the third-party platform
Related articles:
Sharing plug-in development guide
Search for [share] related articles in Dcould community

I also wrote a simple es6 version of share

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

let __shareKv = {
    wxhy: 'WXSceneSession',     //WeChat friends
    wxpyq: 'WXSceneTimeline',   //Wechat circle of friends
    qq: 'qq',                   //QQ friends
    sinaweibo: 'sinaweibo',     //Sina micro-blog
}



class Share {

    constructor(type, fn, op, context) {
        this.config = {
            type, //Sharing platform
            fn, //Result callback
            op, //Content configuration to share
            context, //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)
        })
    }

    //Share information
    _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
    }


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

    //Get service by 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]
            }
        }
    }


    //Access services  
    getService(id, Callback) {
        if (__shares()) {
            return this._getService(id, Callback)
        }
        this._getHtml5PlusServices((data) => {
            __shares(data)
            this._getService(id, Callback)
        })
    }


    //Get device sharing service list
    _getHtml5PlusServices(CallBack) {
        plus.share.getServices((services) => {
            CallBack(services)
        }, (err) => {
            this.ShareCallBack(err, null)
        })
    }

}

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

export {
    sendShare
}

2

About this

                    //QQ wxhy (wechat friend) wxpyq (wechat friend circle) sinaweibo
                    sendShare('qq',function(err, data){
                        if(err){
                            data = err
                        }
                        console.log(JSON.stringify(data))
                    },{
                        img: '_www/img/vhp.png',//Picture address
                        href: 'https://github.com/zhaomenghuan/vue-html5plus', / / shared hyperlink
                        title: 'Share title',//Valid if and only if the href exists
                        content: 'Share content'//Valid if and only if the href exists
                    })

ok, I don't configure the shared appkey here, because I use the real machine test of HBuilder. If you want to package and publish, please fill in one by one

3

What if we can wake up the App with the shared information?
Pigeons.

2019-03-19
I haven't had much time to update this series of articles because of my work, and the technology stack has also changed. Recently, the center of Dcloud has been put on uni app, so I hope you can stick to your original intention and adapt to the changes. At the beginning, I also wrote that I was lovelorn, but it's almost three years, eh

Posted by portrower8 on Sat, 30 Nov 2019 19:53:43 -0800