把网页分享到微信，如何定制标题、内容、图片？

需求概述

网页链接可以直接在微信转发，用户可以和朋友、朋友圈、QQ等分享。在微信浏览器右上角打开它们后在微信内置浏览器中。但如果直接分享，用户看到的只是一个链接，没有任何图文内容。

如下图所示，图1展示了别人分享的链接效果，图2展示了我分享的效果。这两个方案的用户体验，我觉得不用多说了。我一眼就能看到他们。

方案实现

要达到上图自定义文案和图标的效果，必须使用微信提供的JS-SDK，这是微信公众平台为网页开发者提供的基于微信的网页开发工具包。请参考微信JS-SDK文档。(如果不懂技术或者没有认证的微信官方账号，使用wecard工具也可以达到相关效果。)

具体步骤：

1.准备一个已归档的域名和空间，并将域名绑定到该空间。

2.登录微信公众平台，进入“微信官方账号设置”功能设置，填写js界面安全域名。这是你的微信浏览器要打开的域名地址，不能添加IP地址。

3.引入js文件，在需要调用js接口的页面上访问JS文件。

http://res.wx.qq.com/open/js/jweixin-1.2.0.js4,通过config接口注入权限，验证配置(这一步是整个过程中最关键的一步，JS-SDK只能用正确的配置信息调用。)

wx . config({ debug 3360 true，//开启调试模式，所有被调用API的返回值都会在客户端告警时发出。要查看传入的参数，可以在pc端打开，参数信息会通过log打印出来，只在pc端打印。AppId: ' '，//必选，微信官方账号唯一标识timestamp://必选，时间戳nonceStr: ' '，//必选，随机字符串signature: ' '，//必选，签名，见附录1 jsaplist :[]///必选详细访问代码

(currentLink.indexOf('？') -1 ?(' u=' '${u！t=' ' $ { t！}' 'o=' '${o！s=' ' $ { s！}') : ('?u=' '${u！t=' ' $ { t！}' 'o=' '${o！s=' ' $ { s！}'));共享链接=共享链接（共享链接。索引属于(？)) -1 ?("城市="深圳') : ('?城市=' '深圳'));var shareImgUrl='${IMGPATH！}/图像/横幅2。png '；var shareGid=wx . ready(function(){//分享给朋友wx。onmenusharappmessage({ title : share title，desc: shareDesc，link: shareLink，imgUrl: shareImgUrl，success : function(RES){ shared(share link，' friend '，share GID)；}，fail:函数(RES){ alert(JSON。stringify(RES))；} });//分享到朋友圈wx。onmenusharedimeline({ title : share title，desc: shareDesc，link: shareLink，imgUrl: shareImgUrl，success : function(RES){ shared(share link，‘Timeline’，share GID)；}，fail:函数(RES){ alert(JSON。stringify(RES))；} });//分享到QQ wx。OnMenushareQQ({ title : share title，desc: shareDesc，link: shareLink，imgUrl: shareImgUrl，success : function(RES){ share link(share link，' QQ '，share GID)；}，fail:函数(RES){ alert(JSON。stringify(RES))；} });//分享到腾讯QQ wx。onmenu share Weibo({ title : share title，desc: shareDesc，link: shareLink，imgUrl: shareImgUrl，success : function(RES){ share(share link，‘Weibo’，share GID)；}，fail:函数(RES){ alert(JSON。stringify(RES))；} });//分享到QZone wx。onmenushareqzone({ title : share title，desc: shareDesc，link: shareLink，imgUrl: shareImgUrl，success : function(RES){ share(share link，' qzone '，share GID)；}，fail:函数(RES){ alert(JSON。stringify(RES))；} });});函数共享(网址，类型，GID){ var RuRL=BasePath '/share/add？type=' type ' URL=' encodeURI(URL)；if(！GID){ RuRL=' GID=' GID；} $.ajax({ type: 'GET '，url: rUrl，dataType: 'json '，success:函数(rs){ //alert('分享成功');} });} ' _ue_custom_node_='true '以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。