在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/網(wǎng)絡(luò)營(yíng)銷(xiāo)  HTML/ reactjs環(huán)境下的微信分享問(wèn)題

reactjs環(huán)境下的微信分享問(wèn)題

各位大佬好,現(xiàn)在我遇到一個(gè)問(wèn)題,如題所示,就是react spa下的微信分享。

環(huán)境:react-router v4 history模式
業(yè)務(wù):微信菜單中,配置項(xiàng)目首頁(yè)面,是配置的后臺(tái)地址,后臺(tái)會(huì)去靜默授權(quán)等邏輯操作后,轉(zhuǎn)發(fā)到前端路由的頁(yè)面。
問(wèn)題:此時(shí),只要是后臺(tái)轉(zhuǎn)發(fā)過(guò)來(lái)的頁(yè)面,微信jssdk config可以成功,也能夠做一些隱藏不必要的右上角微信自帶菜單的功能,但是!微信分享配置失敗,如果用戶在后臺(tái)剛轉(zhuǎn)發(fā)進(jìn)來(lái)的頁(yè)面,進(jìn)行分享,會(huì)把原地址分享出去,而不是分享前端配置好的鏈接。
而如果,用戶在后臺(tái)轉(zhuǎn)發(fā)進(jìn)來(lái)的頁(yè)面,發(fā)生了url跳轉(zhuǎn),則此時(shí),微信分享就會(huì)生效。

請(qǐng)問(wèn)各位,有沒(méi)有遇到這樣的問(wèn)題,我快崩潰了,目前項(xiàng)目就差這一個(gè)bug。。。有經(jīng)驗(yàn)的大佬分享下解決方案。謝謝

回答
編輯回答
玩控

只要在前端做過(guò)授權(quán)(不是靜默授權(quán))的,分享都會(huì)有問(wèn)題

2017年2月15日 19:33
編輯回答
萢萢糖

放上我的代碼吧。我的環(huán)境還有模式跟你的類似。react-router v4 是hashrouter,也是用戶直接進(jìn)去后臺(tái)授權(quán)后跳轉(zhuǎn)到前端,但是不是靜默授權(quán)。不清楚你調(diào)用接口時(shí)候和后臺(tái)請(qǐng)求參數(shù)時(shí)候傳給后臺(tái)的路徑是不是帶#,因?yàn)?后邊的部分服務(wù)端不認(rèn)。所以會(huì)報(bào)錯(cuò)

    componentDidMount() {
        this.setState({
            //openId(document.cookie)
            thisGood: this.props.match.params.id,
        }, () => {
        //這個(gè)獲取商品詳細(xì)信息
            get(`${API}/detail/${this.state.thisGood}?openId=${this.state.openId}`)
                .then((res) => {
                    return res.json()
                })
                .then((data) => {
                //console.log(data)
                    this.setState({
                        detailGoodData: data,
                        collectionData:data.collection,
                        hasBeenBottom: true
                    },()=>{

                        //這個(gè)是獲取微信的一些參數(shù)的接口,這一段:需要往后臺(tái)傳當(dāng)前需要調(diào)用分享接口頁(yè)面的URL,我使用的HashRouter,#后邊的傳到后臺(tái)會(huì)丟失。所以用的問(wèn)號(hào)代替。后臺(tái)解析到問(wèn)號(hào)的時(shí)候再還原成#。
                        get(`${API}/weixin/fetchconfig?openId=${this.state.openId}&url=http://m.baobaofarm.com/?/detail/${this.props.match.params.id}`).then(res=>{
                            return res.json()
                        }).then(data=>{
                            wx.config({
                                debug: false, // 開(kāi)啟調(diào)試模式,調(diào)用的所有api的返回值會(huì)在客戶端alert出來(lái),若要查看傳入的參數(shù),可以在pc端打開(kāi),參數(shù)信息會(huì)通過(guò)log打出,僅在pc端時(shí)才會(huì)打印。
                                appId: data.objData.appId, // 必填,公眾號(hào)的唯一標(biāo)識(shí)
                                timestamp:data.objData.config_timestamp , // 必填,生成簽名的時(shí)間戳
                                nonceStr: data.objData.config_nonceStr, // 必填,生成簽名的隨機(jī)串
                                signature: data.objData.config_signature,// 必填,簽名,見(jiàn)附錄1
                                jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage'] // 必填,需要使用的JS接口列表,所有JS接口列表見(jiàn)附錄2
                            });

                            wx.onMenuShareTimeline({
                                    title: this.state.detailGoodData.goodsName, // 分享標(biāo)題
                                    link: data.objData.redirect_url, // 分享鏈接,該鏈接域名或路徑必須與當(dāng)前頁(yè)面對(duì)應(yīng)的公眾號(hào)JS安全域名一致
                                    imgUrl: this.state.detailGoodData.listImage, // 分享圖標(biāo)
                                    success: function () {
                                        //alert('已分享')
                                        //window.location.
                                    },
                                    cancel: function () {
                                        //alert('已取消')
                                        //window.location.
                                    }
                                });
                                //分享給朋友
                                wx.onMenuShareAppMessage({
                                    title: this.state.detailGoodData.goodsName, // 分享標(biāo)題
                                    desc: '好東西分享給你', // 分享描述
                                    link: data.objData.redirect_url, // 分享鏈接,該鏈接域名或路徑必須與當(dāng)前頁(yè)面對(duì)應(yīng)的公眾號(hào)JS安全域名一致
                                    imgUrl: this.state.detailGoodData.listImage, // 分享圖標(biāo)
                                    type: '', // 分享類型,music、video或link,不填默認(rèn)為link
                                    dataUrl: '', // 如果type是music或video,則要提供數(shù)據(jù)鏈接,默認(rèn)為空
                                    success: function () {
                                        // 用戶確認(rèn)分享后執(zhí)行的回調(diào)函數(shù)
                                        //alert('已分享')
                                        //window.location.
                                    },
                                    cancel: function () {
                                        // 用戶取消分享后執(zhí)行的回調(diào)函數(shù)
                                        //alert('已取消')
                                        //window.location.
                                    }
                                });
                        });
                    })
                })
        });

    }
2017年12月22日 21:47