今天在做隐藏微信右上角的分享按钮

今天在做隐藏微信右上角的分享按钮

现在使用的写法是

1

2

3

wx.hideMenuItems({

                menuList: ["menuItem:share:timeline""menuItem:copyUrl""menuItem:share:appMessage""menuItem:share:qq""menuItem:share:weiboApp""menuItem:favorite""menuItem:share:facebook""menuItem:share:QZone""menuItem:editTag""menuItem:delete""menuItem:copyUrl""menuItem:originPage""menuItem:readMode""menuItem:openWithQQBrowser""menuItem:openWithSafari""menuItem:share:email""menuItem:share:brand"// 要隐藏的菜单项,只能隐藏“传播类”和“保护类”按钮

            });

 微信API中的附录三

复制代码

附录3-所有菜单项列表

基本类

举报: "menuItem:exposeArticle"

调整字体: "menuItem:setFont"

日间模式: "menuItem:dayMode"

夜间模式: "menuItem:nightMode"

刷新: "menuItem:refresh"

查看公众号(已添加): "menuItem:profile"

查看公众号(未添加): "menuItem:addContact"

传播类

发送给朋友: "menuItem:share:appMessage"

分享到朋友圈: "menuItem:share:timeline"

分享到QQ: "menuItem:share:qq"

分享到Weibo: "menuItem:share:weiboApp"

收藏: "menuItem:favorite"

分享到FB: "menuItem:share:facebook"

分享到 QQ 空间/menuItem:share:QZone

保护类

编辑标签: "menuItem:editTag"

删除: "menuItem:delete"

复制链接: "menuItem:copyUrl"

原网页: "menuItem:originPage"

阅读模式: "menuItem:readMode"

在QQ浏览器中打开: "menuItem:openWithQQBrowser"

在Safari中打开: "menuItem:openWithSafari"

邮件: "menuItem:share:email"

一些特殊公众号: "menuItem:share:brand"

复制代码

 

百度查到的一串代码,挺好用的

复制代码

<!--禁用微信分享按钮-->
    <script>
        function onBridgeReady() {
            WeixinJSBridge.call('hideOptionMenu');
        }

        if (typeof WeixinJSBridge == "undefined") {
            if (document.addEventListener) {
                document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
            } else if (document.attachEvent) {
                document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
                document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
            }
        } else {
            onBridgeReady();
        }
    </script>

复制代码


也看了一下别的

查到一篇文章:http://www.2cto.com/weixin/201511/451592.html

作者:人在钱途

为防找不到,就干脆拷贝了一份。

以下为文章中的内容:

 

之前写了一篇关于这个WeixinJSBridge API的文章,文章地址 ,于是有很多网友都在过来咨询这个API的使用,在这里有必要跟大家再说一下:这个API在以前公布的部分接口被官方和谐掉很久 了, 比如一键关注、分享给好友、分享到朋友圈等。当然,你可能会发现微信官方推送的一些文章还能使用这些功能,粗略估计,官方是对这个API增加了白名单控 制,判断Referer,如果是微信官方的地址、或者是有合作的商家地址,则允许调用,否则,返回“access denied”!

截止目前,笔者还没用发现还有什么办法能继续使用它!不过,官方和谐掉这个API其实也是说得过去的,因为在整个WebView的右上角,官方做了一个Navtive的按钮,点开以后,包括分享给好友、分享到朋友圈这样的功能都有,所以,官方也是在做一些引导。

当然,WeixinJSBridge这个API也并不是所有功能都被和谐掉了,相反,有好几个功能还是相当有用的,可以正常使用,比如:

1、隐藏微信网页右上角的按钮(...按钮):开发者可以用这个功能来禁止当前页面被分享

2、隐藏微信网页底部的导航栏(比如前进后退和刷新):这个导航栏会占用一定的区域,开发者可以认为用户不会用到它,将其隐藏掉

3、在微信网页中获取用户的网络状态:开发者可以利用这个API获得用户的网络状态,并提供不同的服务,比如视频类,在wifi下提供高清视频流,在2g网络下提供普通清晰视频流等等

下面分别通过简单的几行代码,说明这几个API的用法:

1、隐藏微信网页右上角的按钮

1

2

3

4

5

6

7

8

9

document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {

    // 通过下面这个API隐藏右上角按钮

    WeixinJSBridge.call('hideOptionMenu');

});

             

document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {

    // 通过下面这个API显示右上角按钮

    WeixinJSBridge.call('showOptionMenu');

});

2、隐藏微信网页底部的导航栏

1

2

3

4

5

6

7

8

9

document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {

    // 通过下面这个API隐藏底部导航栏

    WeixinJSBridge.call('hideToolbar');

});

            

document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {

    // 通过下面这个API显示底部导航栏

    WeixinJSBridge.call('showToolbar');

});

3、在微信网页中获取用户的网络状态

1

2

3

4

WeixinJSBridge.invoke('getNetworkType',{},function(e){

    // 在这里拿到e.err_msg,这里面就包含了所有的网络类型

    alert(e.err_msg);

 });

e.err_msg的取值如下所示:

network_type:wifi wifi网络 2 network_type:edge 非wifi,包含3G/2G 3 network_type:fail 网络断开连接 4 network_type:wwan 2g或者3g

 

********************************************************************************此处分割线 *******************************************************************************

 

在微信JSSDK说明文档中有关于按钮屏蔽使用等的说明:http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html

左边菜单点击【微信网页开发】,点击下面的二级菜单【微信JS-SDK说明文档】,然后就能看到一系列关于JS-SDK的说明。目录10.界面操作就是需要的地方,只不过火狐大概点击不了或者根本没做页面点击,所以直接页面CTRL+F搜【菜单】两个字,往下找就是了

 

第十条界面操作则是对于按钮的处理

1

 

在附录三中有所有涉及的菜单项列表

wx.hideMenuItems({
    menuList: [] // 要隐藏的菜单项,只能隐藏“传播类”和“保护类”按钮,所有menu项见附录3
});

使用方式,直接将项隐藏的菜单项
  • 发送给朋友: "menuItem:share:appMessage"
  • 分享到朋友圈: "menuItem:share:timeline"
  • 分享到QQ: "menuItem:share:qq"
  • 分享到Weibo: "menuItem:share:weiboApp"
  • 收藏: "menuItem:favorite"
  • 分享到FB: "menuItem:share:facebook"
  • 分享到 QQ 空间/menuItem:share:QZone

放入到menuList:[]括号中,具体拼接方式,大概是","

fighting

### 微信SDK自定义分享按钮无效的原因分析与解决方案 在微信开发过程中,当使用微信JS-SDK实现自定义分享功能时,可能会遇到自定义分享按钮无法正常使用的情况。以下是可能原因及其对应的解决方案。 #### 原因一:`wx.config` 配置错误 如果 `wx.config` 的参数配置不正确,可能导致整个 JS-SDK 功能不可用。特别是在 iOS 端,URL 参数的处理尤为严格[^1]。 - **解决方法**:确保传递给 `wx.config` 的 URL 是当前页面的实际地址,并且包含所有的查询字符串。可以通过以下方式获取完整的 URL: ```javascript var url = encodeURIComponent(location.href.split('#')[0]); ``` 随后将此 URL 作为参数传递至后端签名接口,用于生成签名所需的 `timestamp`, `nonceStr`, 和 `signature`。 --- #### 原因二:未调用 `wx.ready` 方法 `wx.config` 成功执行后,需通过 `wx.ready` 注册回调函数来启用后续的功能。如果没有注册该回调,则即使配置成功也无法触发任何 SDK 功能[^2]。 - **解决方法**:确保在 `wx.config` 后立即调用 `wx.ready` 并在此处初始化自定义分享逻辑。例如: ```javascript wx.ready(function () { wx.onMenuShareAppMessage({ title: '自定义标题', // 分享标题 desc: '这是我的描述', // 分享描述 link: 'http://example.com', // 分享链接 imgUrl: 'http://example.com/image.jpg', // 分享图标 success: function() { console.log('分享成功'); }, cancel: function() { console.log('取消分享'); } }); }); ``` --- #### 原因三:权限验证失败 如果服务器返回的 `jsapi_ticket` 或其他必要字段过期或无效,也可能导致自定义分享功能失效。这通常发生在签名计算阶段出现问题时[^4]。 - **解决方法**:确认后端服务能够及时更新并提供有效的 `jsapi_ticket`,同时重新校验签名算法是否正确无误。可参考官方文档中的签名流程说明进行调试。 --- #### 原因四:iOS 特殊行为影响 某些特定场景下(如隐藏复制按钮),iOS 设备可能存在兼容性问题,从而干扰自定义菜单的行为表现。 - **解决方法**:针对 iOS 用户单独调整相关设置,或者尝试简化 HTML 结构以减少潜在冲突因素的影响。 --- ### 完整代码示例 以下是一个典型的微信 JS-SDK 初始化脚本实例,适用于大多数情况下的自定义分享需求: ```javascript // 获取后台生成的 config 数据 function getConfigData(callback) { $.get('/wechat/config?url=' + encodeURIComponent(location.href.split('#')[0]), callback); } getConfigData(function (data) { var appId = data.appId; var timestamp = data.timestamp; var nonceStr = data.nonceStr; var signature = data.signature; wx.config({ debug: false, appId: appId, timestamp: timestamp, nonceStr: nonceStr, signature: signature, jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage'] }); wx.ready(function () { // 自定义分享到朋友圈 wx.onMenuShareTimeline({ title: '分享到朋友圈', link: 'http://example.com', imgUrl: 'http://example.com/image.jpg' }); // 自定义分享给好友 wx.onMenuShareAppMessage({ title: '分享给好友', desc: '这是一个测试描述', link: 'http://example.com', imgUrl: 'http://example.com/image.jpg' }); }); wx.error(function (res) { console.error('Config failed:', res.errMsg); }); }); ``` ---
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值