reactjs环境下的微信分享问题

Question

各位大佬好，现在我遇到一个问题，如题所示，就是react spa下的微信分享。

环境：react-router v4 history模式
业务：微信菜单中，配置项目首页面，是配置的后台地址，后台会去静默授权等逻辑操作后，转发到前端路由的页面。
问题：此时，只要是后台转发过来的页面，微信jssdk config可以成功，也能够做一些隐藏不必要的右上角微信自带菜单的功能，但是！微信分享配置失败，如果用户在后台刚转发进来的页面，进行分享，会把原地址分享出去，而不是分享前端配置好的链接。
而如果，用户在后台转发进来的页面，发生了url跳转，则此时，微信分享就会生效。

请问各位，有没有遇到这样的问题，我快崩溃了，目前项目就差这一个bug。。。有经验的大佬分享下解决方案。谢谢

Answer 1

放上我的代码吧。我的环境还有模式跟你的类似。react-router v4 是hashrouter,也是用户直接进去后台授权后跳转到前端，但是不是静默授权。不清楚你调用接口时候和后台请求参数时候传给后台的路径是不是带#，因为#后边的部分服务端不认。所以会报错

    componentDidMount() {
        this.setState({
            //openId(document.cookie)
            thisGood: this.props.match.params.id,
        }, () => {
        //这个获取商品详细信息
            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
                    },()=>{

                        //这个是获取微信的一些参数的接口，这一段：需要往后台传当前需要调用分享接口页面的URL，我使用的HashRouter,#后边的传到后台会丢失。所以用的问号代替。后台解析到问号的时候再还原成#。
                        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, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                                appId: data.objData.appId, // 必填，公众号的唯一标识
                                timestamp:data.objData.config_timestamp , // 必填，生成签名的时间戳
                                nonceStr: data.objData.config_nonceStr, // 必填，生成签名的随机串
                                signature: data.objData.config_signature,// 必填，签名，见附录1
                                jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
                            });

                            wx.onMenuShareTimeline({
                                    title: this.state.detailGoodData.goodsName, // 分享标题
                                    link: data.objData.redirect_url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                                    imgUrl: this.state.detailGoodData.listImage, // 分享图标
                                    success: function () {
                                        //alert('已分享')
                                        //window.location.href = 'http://test.baobaofarm.com/'
                                    },
                                    cancel: function () {
                                        //alert('已取消')
                                        //window.location.href = 'http://test.baobaofarm.com/'
                                    }
                                });
                                //分享给朋友
                                wx.onMenuShareAppMessage({
                                    title: this.state.detailGoodData.goodsName, // 分享标题
                                    desc: '好东西分享给你', // 分享描述
                                    link: data.objData.redirect_url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
                                    imgUrl: this.state.detailGoodData.listImage, // 分享图标
                                    type: '', // 分享类型,music、video或link，不填默认为link
                                    dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
                                    success: function () {
                                        // 用户确认分享后执行的回调函数
                                        //alert('已分享')
                                        //window.location.href = 'http://test.baobaofarm.com/'
                                    },
                                    cancel: function () {
                                        // 用户取消分享后执行的回调函数
                                        //alert('已取消')
                                        //window.location.href = 'http://test.baobaofarm.com/'
                                    }
                                });
                        });
                    })
                })
        });

    }

Answer 2

只要在前端做过授权（不是静默授权）的，分享都会有问题