微信二次分享改变主标题副标题

** 刚来新公司，就丢给我个任务，说是APP分享出去的页面再次通过微信分享的话，标题都没了，相信很多朋友之后都会遇到这种问题，我就把自己写的分享一下。**

   我们先来看看之前分享出去的是什么造型：

再来看看改变后的造型：

话不多说，直接用代码说话吧，由于本人主要是做前端的，我就把前端代码展示一下吧：

配置接口域名，设置ip白名单什么的我就不多说了吧，有什么疑问留言即可，直接见代码吧：


1.创建一个Js文件，用来配置你的微信分享

import axios from 'axios';
import qs from 'qs'

const GET_SHARE_CONFIG_URL =' xxxxxxxxxxxxxxxxxxxxxx ' ;    //这里是后台给你的接口地址
let wxconfig = null;

//获取当前页面地址，这里有个坑，一定要截取#之前的，因为微信不识别#的 
let location_href = window.location.href.split('#')[0]
let sharUrl = location_href;


 // 初始化微信分享配置
 async function initConfig() {
  try {
    wxconfig = (await axios.post(GET_SHARE_CONFIG_URL,qs.stringify({url:sharUrl}),  //请求后台给你的接口，把刚才获取到的页面地址给他传过去
      {headers: {'Content-Type': 'application/x-www-form-urlencoded'}})).data.data; 
    wx.config({
      debug: false,      //开启调试模式位true后可以通过alert弹窗将公众号签名等结果反馈处理 
      appId: wxconfig.appId,  //必填，公众号唯一标识
      timestamp: wxconfig.timestamp,  //必填，生成签名的时间戳
      nonceStr: wxconfig.nonceStr,    //必填，生成签名的随机串 
      signature: wxconfig.signature,   //必填，签名
      jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage']    //分享给好友、朋友圈
    });
  } catch (e) {
    console.error(e);
  }
};
//
/**
 * 设置微信分享
 * @param opts
 */
export default {
  share(opts) {
    if (!wxconfig) {
      initConfig();
    }
    //  默认配置
    // opts.link = sharUrl;
    wx.ready(function() {
        //分享朋友圈
        wx.onMenuShareTimeline({
          title: opts.title,
          link: window.location.href,
          imgUrl: opts.imgUrl,
          success: opts.success()
        });

        //分享好友
        wx.onMenuShareAppMessage({
          title: opts.title,
          desc: opts.desc,
          link: window.location.href,
          imgUrl: opts.imgUrl,
          success: opts.success()
      });
    });
  }
}

上面就是配置微信分享的js代码了，直接复制改下路径即可

2.进入我们要分享的html页面

import wxshare from '@/api/wxshare'    //引入我们刚才配置的js文件
	export default {
    data() {
      return {
      }
    },
    created() {
      this.webshare();
    },
    methods: {
      webshare() {
        // 配置微信分享
        wxshare.share({
          title: '助力七夕土味情话，赢现金好礼！',           //分享的主标题
          desc: '点击助力，立得10元现金，乐享七夕5折礼券！',   //分享的副标题
          imgUrl: 'xxxxxxxxxxxxxxxxx',                          //分享的icon
          success: function() {
            console.log('已分享');
          }
        });
      }
    }
  }

以上就是本人做的微信二次分享了，有什么疑问欢迎大家提问。