微信分享与录音

最新推荐文章于 2024-09-16 08:47:17 发布
最新推荐文章于 2024-09-16 08:47:17 发布
阅读量101 收藏
点赞数
文章标签： json 移动开发
原文链接：http://www.cnblogs.com/mbyund/p/6908888.html
版权 
<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>title</title>
    <script src="http://s0.ifengimg.com/static/js/jquery-1.7.2.min_c4de8813.js"></script>
    <style>
        .recording{background: #0000ff;}
    </style>
</head>
<body>
<a class="ting" href="">听</a>
<a class="element comp_wechat_play" style="width: 180px; height: 40px;display: block; background: #ff0000;margin-bottom: 10px;">播放</a>
<a class="element comp_wechat_hear" style="width: 180px; height: 40px;display: block;background: #ff0000">按住 说话</a>
<p id="upt"></p>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
    /*分享与录音*/
//    var site = "3066";
    var shareID=5;
    var wxData = {
        "imgUrl": 'http://s0.ifengimg.com/2017/04/25/share_b47557b8.png',
        "link": window.location.href,
        "desc": "达康书记别低头，GDP会掉！叫上小伙伴，快来帮达康书记守住！礼金不断，就等你来！",
        "title": "守护达康书记的GDP，喊你加入！"
    };

    var shareWXData,peopleWXConfig;
    shareWXData = function() {
        peopleWXConfig.debug = false; //关闭调试模式
        peopleWXConfig.jsApiList = [    //需要用到的接口
            'checkJsApi',//分享
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
            'onMenuShareQQ',
            'onMenuShareWeibo',
            'startRecord',//录音
            'stopRecord',
            'onVoiceRecordEnd',
            'playVoice',
            'onVoicePlayEnd',
            'pauseVoice',
            'stopVoice',
            'uploadVoice',
            'downloadVoice'
        ];
        wx.config(peopleWXConfig);
        wx.ready(function() {
            /* **************分享******************** */
            wx.onMenuShareTimeline({ //分享到朋友圈
                title: wxData.title, // 分享标题
                link: wxData.link, // 分享链接
                imgUrl: wxData.imgUrl, // 分享图标
                success: function() {
                    // 用户确认分享后执行的回调函数
                    //alert(wxData.link + "|" + wxData.imgUrl);
                    if(addNames){
                        addNames();
                    }
                },
                cancel: function() {
                    // 用户取消分享后执行的回调函数
                },
                trigger: function() { // 用戶触发分享事件后的回调函数
                    this.title = wxData.title;
                }
            });
            wx.onMenuShareAppMessage({ //分享给朋友
                title: wxData.title, // 分享标题
                link: wxData.link, // 分享链接
                imgUrl: wxData.imgUrl, // 分享图标
                desc: wxData.desc, // 分享描述
                type: '', // 分享类型,music、video或link，不填默认为link
                dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
                success: function() {
                    // 用户确认分享后执行的回调函数
                    // alert(wxData.link + "|" + wxData.imgUrl);
                    if(addNames){
                        addNames();
                    }
                },
                cancel: function() {
                    // 用户取消分享后执行的回调函数
                },
                trigger: function() { // 用戶触发分享事件后的回调函数
                    this.title = wxData.title;
                }
            });
            wx.onMenuShareQQ({ //分享到QQ
                title: wxData.title, // 分享标题
                link: wxData.link, // 分享链接
                imgUrl: wxData.imgUrl, // 分享图标
                desc: wxData.desc, // 分享描述
                success: function() {
                    // 用户确认分享后执行的回调函数
                },
                cancel: function() {
                    // 用户取消分享后执行的回调函数
                },
                trigger: function() { // 用戶触发分享事件后的回调函数
                    this.title = wxData.title;
                }
            });
            wx.onMenuShareWeibo({ //分享到腾讯微博
                title: wxData.title, // 分享标题
                link: wxData.link, // 分享链接
                imgUrl: wxData.imgUrl, // 分享图标
                desc: wxData.desc, // 分享描述
                success: function() {
                    // 用户确认分享后执行的回调函数
                },
                cancel: function() {
                    // 用户取消分享后执行的回调函数
                },
                trigger: function() { // 用戶触发分享事件后的回调函数
                    this.title = wxData.title;
                }
            });

            /* **************录音******************** */
            new Audio().init();
        });
        wx.error(function(res) {
            alert('验证出错:' + JSON.stringify(res));
            // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
        });
    };

    //音频
    function Audio(){
        this.voicePanel = null;
        this.calculateTime = null;//录音时间计算器
        this.second = null;//录音时间秒
        this.serverId = null;//微信服务器音频ID
        this.localId = null;//本地音频ID
    }
    Audio.prototype = {
        init: function(){
            var me = this;
            //播放
            document.querySelector('.comp_wechat_play').addEventListener('touchstart',function(e){
                event.stopPropagation();
                e.preventDefault();
                me.soundPlay();
            },false);

            //录音
            document.querySelector('.comp_wechat_hear').addEventListener('touchstart',function(e){
                return event.stopPropagation(), e.preventDefault(), me.isWeixin() ? me.soundRecord() : (alert("请在微信中点我！"), !0)
            },false);
            document.querySelector('.comp_wechat_hear').addEventListener('touchend',function(e){
                me.isWeixin() && me.calculateTime && me.soundStopRecord()
            },false);
        },
        soundPlay: function(){  //播放语音
            var me = this;
            if(me.localId){
                wx.playVoice({
                    localId: me.localId
                })
            }else{
                if(this.serverId){
                    wx.downloadVoice({//下载语音
                        serverId: me.serverId,
                        success: function(res) {
                            me.localId = res.localId;
                            wx.playVoice({
                                localId: me.localId
                            })
                        },
                        error: function() {

                        }
                    })
                }
            }
        },
        soundRecord: function(){//开始录音
            var me = this;
            wx.startRecord({
                success: function(){
                    me.second = 0;
                    me.openPlayState();
                }
            });
            $(me.context).addClass("recording").text("松开 结束");

        },
        openPlayState: function(){//录音中计时
            var me = this;
            var html = "<div class='voice-panel'><div class='voice-tip'>松开手指 停止录音</div></div>";
            this.voicePanel = $(html).prependTo($("body"));
            this.calculateTime = setInterval(function(){
                me.second++, me.second >= 20 && $(me.voicePanel).text(30 - me.second), 30 == me.second && me.soundStopRecord()
            }, 1e3);
        },
        soundStopRecord: function(){//结束录音
            var me = this;
            clearInterval(this.calculateTime);
            this.calculateTime = null;
            $(this.context).removeClass("recording").text("按住 说话");
            $(this.voicePanel).remove();
            wx.stopRecord({
                success: function(res){
                    me.second = 0;
                    me.wechatUploadVoice(res.localId);//上传语音
                },
                cancel: function (res) {
                    alert('已取消');
                },
                fail: function (res) {
                    alert(JSON.stringify(res));
                }
            })
        },
        wechatUploadVoice: function(localId){//上传语音
            var me = this;
            this.localId = localId;
            wx.uploadVoice({
                localId: localId,
                isShowProgressTips: 1,
                success: function(res){
                    me.serverId = res.serverId;
                }
            })
        },
        isWeixin: function(){
            return window.top === window && /MicroMessenger/i.test(navigator.userAgent)
        },
        isPc: function(){
            return !(this.mobilecheck() || this.tabletCheck() && window == window.top)
        },
        mobilecheck: function(){
            return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobi/i.test(navigator.userAgent) || screen.width < 500
        },
        tabletCheck: function(){
            return /ipad|android|android 3.0|xoom|sch-i800|playbook|tablet|kindle/i.test(navigator.userAgent)
        }
    };
    function importJs(options) {
        options = options || {};
        if (!options.url) {
            return;
        }
        options.data = options.data || {};
        options.cbName = options.cbName || "_cb";
        options.timeout = options.timeout || 0;
        var arr = [];
        var fnName = "jsonp_" + Math.random();
        fnName = fnName.replace(".", "");
        options.data[options.cbName] = fnName;
        for (var i in options.data) {
            arr.push(i + "=" + encodeURIComponent(options.data[i]));
        }
        var str = arr.join("&");
        window[fnName] = function(json) {
            options.success && options.success(json);

            oHead.removeChild(oS);
            window[fnName]=null;
            clearTimeout(timer);
        }
        var oS = document.createElement("script");
        oS.src = options.url + "?" + str;
        var oHead = document.getElementsByTagName("head")[0];
        oHead.appendChild(oS);

        if(options.timeout){
            var timer=setTimeout(function(){
                window[fnName] = function(){};
                options.error && options.error();
            },options.timeout);
        }
    }
    window.onload = function() {
        //获取微信配置信息
        /*wx.config({
             debug: true,
             appId: 'wx9d9ecaf0a63e9b06',
             timestamp: parseInt(new Date().getTime()/1000),
             nonceStr: '942Dqc7NYVJ8Dv2h',
             signature: '9ff207857bae1b75e19a1e5499a7c2de95d8299d',
             jsApiList: [   //需要用到的接口
                 'startRecord',
                 'stopRecord',
                 'onVoiceRecordEnd',
                 'playVoice',
                 'onVoicePlayEnd',
                 'pauseVoice',
                 'stopVoice',
                 'uploadVoice',
                 'downloadVoice'
             ]
         });*/
        importJs({
            url:"http://opencity.house.ifeng.com/weixin/config/info",
            data:{id:shareID,_url:window.location.href},
            cbName:"_cb",
            success:function(json){
                //console.log(json);
                if(json.errno == 0){
                    peopleWXConfig = json.data;
                    setTimeout(function(){
                        shareWXData();
                    },200);
                }

            }
        });
    };
</script>
</body>
</html>

转载于:https://www.cnblogs.com/mbyund/p/6908888.html

weixin_30731287
关注
不容错过！手把手教你开启微信通话自动录音功能！（含手机端和电脑端）
XiaoqiangClub的博客
07-10 769
不容错过！手把手教你开启手机微信通话自动录音功能！
微信分享音频的样式
weixin_33858249的博客
11-08 427
2019独角兽企业重金招聘Python工程师标准>>> ...
微信开发-关于分享朋友&朋友圈以及录音功能
谷子的博客
05-27 5731
前两天刚整理了一个关于微信开发录音功能的开发步骤，网上这方面资料已经很多了，写下来就当作自己的笔记。 一.  首先需要在微信公众号中进行配置（其中Token为自定义项） 二． 在配置的域名文件夹下放置checkwei.php文件，用来验证配置是否成功。如下： <?php header('Content-type:text'); define("TOKEN", "wei
微信公众号调用config 接口，开启debug模式，常见错误及解决方法
G925010178的博客
05-31 8975
调用config 接口的时候传入参数 debug: true 可以开启debug模式，页面会alert出错误信息。以下为常见错误及解决方法： 1、 invalid url domain当前页面所在域名与使用的appid没有绑定，请确认正确填写绑定的域名，仅支持80（http）和443（https）两个端口，因此不需要填写端口号（一个appid可以绑定三个有效域名）。 2、invalid signature签名错误。建议按如下顺序检查： 1、确认签名算法正确，可用http://mp.weixin.
微信分享
奔跑8蜗牛
03-24 251
一、微信官方文档 https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#11 二、微信分享流程图 三、微信获取信息步骤 1、配置JS回调域名（域名一定要备案） 2、获取appId和appsecret 3、获取access_token和ticket...
vue微信录音（本地录音）
02-22
在Vue项目中集成微信录音功能，需要先引入微信JS-SDK，这是一个由微信提供的JavaScript库，它提供了调用微信接口的能力，包括录音、支付、分享等功能。 1. **引入微信JS-SDK**：在Vue项目中，我们通常在需要使用...
微信网页录音
04-29
- 微信JSSDK：微信提供了JavaScript SDK，可以集成到网页中，实现与微信服务器的交互，例如分享、支付、获取用户信息等功能。对于录音，可能需要结合JSSDK来实现上传功能，调用微信的uploadVoice接口上传录音文件。...
微信小程序实现录音功能
01-03
本文实例为大家分享了微信小程序录音功能的具体代码，供大家参考，具体内容如下 release.wxml <!--pages/index/release/release.wxml--> <view class=cell-bd data-key={{item.f
Gson转换
09-13 322
gson格式转换.create());@Overridetry {
Vue使用query传参Boolean类型，刷新之后转换为String问题
q879936814的博客
09-12 441
要解决这个问题，不能直接Boolean处理，因为如果传入false，那么转换成字符串，Boolean(‘false’)会变成true；做项目时发现第一次进入页面时传参是正常的Boolean类型，刷新之后变成了String，这是浏览器进行的一次强制转换；解决方法：使用JSON.parse处理参数。
sqlalchemy JSON 字段写入时中文序列化问题
llc的博客
09-12 395
_table_args__ = ({"comment": "表名称"})...extra = Column(JSON, comment="其他属性")...
ASP.NET Core 中的 CRUD 操作
A_nanda的博客
09-14 323
我们的披萨服务支持对披萨列表执行 CRUD 操作。这些操作是通过 HTTP 谓词执行的，它们通过 ASP.NET Core 属性进行映射。正如你所了解的，HTTPGET谓词用于从服务检索一个或多个项。此类操作使用[HttpGet]属性进行批注。GET你已经了解了GET操作的工作原理。让我们来详细了解一下POSTPUT和DELETE操作。
使用 uni-app 开发微信小程序的详细指南
最新发布
2301_79685859的博客
09-16 715
uni-app是一个使用 Vue.js 框架开发跨平台应用的前端框架。开发者通过编写一套代码，可以生成多端应用，包括 H5、iOS、Android、微信小程序、支付宝小程序、字节跳动小程序等。
EP12 分类列表元素点击跳转
歌舞阿瓜的博客
09-13 1141
文件路径： E:/homework/uniappv3tswallpaper/pages.json { "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages { "path": "pages/index/index", "style": { "navigationBarTitleText": "uni-app", "navigationStyle": "custom"
Jackson注解屏蔽某些字段读取权限
fxtxz2的专栏
09-12 271
Spring引入Jackson json序列化库真好用。
项目实现：云备份②（文件操作、Json等工具类的实现）
weixin_57663528的博客
09-14 664
实现了云备份文件所需的工具类：文件操作、Json序列化和反序列化类实现
微信小程序录音机+音频播放+动画实战教程（含真机代码）
开发者通过详细的代码分享，展示了如何在微信小程序中构建一个基本的录音功能，包括处理录音失败的情况，以及音频文件的获取、存储和播放。 首先，文章提到在用户按住录音按钮时，会显示一个帧动画形式的麦克风，这...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值