web端，分享到微信，怎么实现？（文章分享到朋友圈，点击分享按钮，弹出二维码）

Question

不要用百度分享等分享工具，这样做的目的是为了能自定义分享按钮的样式。类似于36kr 的分享到微信的功能，点击按钮，弹出该文章的二维码。

研究了蛮久，没懂

求高人指教！

Answer 1

以下回答参考 皆我百晓生、券券喵儿 等免费微信小程序相关内容作答，并由本人整理回复。

要实现将网页上的内容分享到微信的朋友圈，可以使用微信官方提供的API来进行操作。以下是基本步骤和示例代码：

1. 首先，你需要在你的项目中安装微信开发包，如果你还没有安装，请访问微信开发者官网下载并安装：https://developers.weixin.qq.com/doc/offiaccount/Develop_Resources/Getting_Started_with_WXSDK_for_WeChat_Apps/02-Install_the_Developer_Suite.html

2. 安装完成后，打开你的项目，在app.js文件中添加以下代码以获取微信API密钥：

var Wx = require('wechat-miniprogram');
Wx.config({
  debug: false, // 开启调试模式, 调试时可用
  appId: 'your_app_id', // 必填，公众号的唯一标识
  timestamp: Math.random(), // 必填，生成签名的时间戳
  nonceStr: '', // 必填，生成签名的随机串
  signature: '', // 必填，签名
  jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage'] // 必填，需要使用的JS接口列表
});

注意：你需要替换上面的 'your_app_id' 为你自己的微信公众号ID。

1. 在你的页面上，你可以通过以下方式调用上述API来分享到微信：

<script>
  Wx.ready(function () {
    // 调用分享功能
    wx.onMenuShareTimeline({
      title: "我的标题",
      desc: "我的描述",
      link: "http://www.example.com",
      imgUrl: "http://img.example.com"
    });
    wx.onMenuShareAppMessage({
      title: "我的标题",
      desc: "我的描述",
      link: "http://www.example.com",
      imgUrl: "http://img.example.com",
      type: "link", // 分享类型，可选值包括：link, event, picture, video, music, service
      dataUrl: "data:image/jpeg;base64," + "Q29yZS5jbHVyYXRpb24uZW1iZWQgMjAyMDI=",
      success: function () {
        console.log("成功");
      },
      fail: function () {
        console.log("失败");
      }
    });
  });
</script>

<!-- 其他HTML代码 -->

这段代码会自动触发分享，并且会在分享成功或失败时显示相应的提示信息。

请注意，这只是一个简单的示例，实际使用时可能需要根据具体需求进行调整。例如，你可能想要控制分享的具体行为，比如只分享给特定的人群或者指定的内容。