zoukankan      html  css  js  c++  java
  • .NET微信开发 JS SDK 音频 地理位置

     记录一下,方便查找。

    配置好JSSDK  增加SDK音频和地理位置的接口权限。

    效果:

     

     

    地理位置代码:

        <h4>扫一扫</h4>
        <button type="button" class="btnsis">扫一扫</button>
        <br/>
        <br />
        <h4>获取位置信息</h4>
        <button type="button" class="Location">位置</button>
    <script type="text/javascript">
        wx.config({
            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
            appId: '@ViewBag.AppID', // 必填,公众号的唯一标识
            timestamp: @ViewBag.timestamp, // 必填,生成签名的时间戳    <%= Html.Encode(ViewData["timestamp" ]) %>
            nonceStr: '@ViewBag.nonceStr', // 必填,生成签名的随机串
            signature: '@ViewBag.signature', // 必填,签名
            jsApiList: ['scanQRCode','getLocation','openLocation'] // 必填,需要使用的JS接口列表, 这里只需要调用扫一扫
        });
    
        $(function() {
            function qrCode() {
                wx.scanQRCode({
                    needResult: 1, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
                    scanType: ["qrCode"], // 可以指定扫二维码还是一维码,默认二者都有
                    success: function (res) {
                        var result = res.resultStr; // 当needResult 为 1 时,扫码返回的结果
                        alert(result);
                    },
                    error:function(res) {
                        if (res.errMsg.indexOf('function_not_exist') > 0) {
                            alert('当前版本过低,请进行升级');
                        }
                    }
                });
            }
    
            $(".btnsis").click(function() {
                alert('ee');
                var ua = navigator.userAgent.toLowerCase();
                var isWeixin = ua.indexOf('micromessenger') !== -1;
                if (!isWeixin) {
                    alert('请用微信打开连接,才可使用扫一扫');
                }
                qrCode();
            });
    
            $(".Location").click(function() {
                alert('aa');
                var ua = navigator.userAgent.toLowerCase();
                var isWeixin = ua.indexOf('micromessenger') !== -1;
                if (!isWeixin) {
                    alert('请用微信打开连接,才可获取位置');
                }
    
                wx.getLocation({
                    type: 'wgs84', // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
                    success: function (res) {
                        var latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90
                        var longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。
                        var speed = res.speed; // 速度,以米/每秒计
                        var accuracy = res.accuracy; // 位置精度
    
                        wx.openLocation({
                            latitude: latitude, // 纬度,浮点数,范围为90 ~ -90
                            longitude: longitude, // 经度,浮点数,范围为180 ~ -180。
                            name: '我的位置', // 位置名
                            address: '地址详情说明', // 地址详情说明
                            scale: 20, // 地图缩放级别,整形值,范围从1~28。默认为最大
                            infoUrl: 'https://www.baidu.com/' // 在查看位置界面底部显示的超链接,可点击跳转
                        });
                        
                    }
                });
                
            });
        });
    
    
    </script>

    音频代码:

        <div  type="button"  class="start_btn">开始录音</div>
        <br/>
        <br/>
        <div  type="button" class="play_btn">播放录音</div>
        <br/>
        <br />
        <div  type="button" class="send_btn">上传录音</div>
        <br/>
        <br />
        <button type="button" class="downrecording">下载录音</button>
    <script type="text/javascript">
    
        wx.config({
            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
            appId: '@ViewBag.AppID', // 必填,公众号的唯一标识
            timestamp: @ViewBag.timestamp, // 必填,生成签名的时间戳    <%= Html.Encode(ViewData["timestamp" ]) %>
            nonceStr: '@ViewBag.nonceStr', // 必填,生成签名的随机串
            signature: '@ViewBag.signature', // 必填,签名
            jsApiList: ['startRecord','stopRecord','onVoiceRecordEnd','playVoice','pauseVoice','stopVoice','onVoicePlayEnd','uploadVoice','downloadVoice'] // 必填,音频接口权限
        });
    
    
        wx.ready(function() {
            //返回音频的本地ID
            var localId;
            //返回音频的服务器端ID
            var serverId;
            //录音计时,小于指定秒数(minTime = 10)则设置用户未录音
            var startTime , endTime , minTime = 2;
    
            //***********************************//
            //开始录音
            $('.start_btn').on('touchstart',function(e){
                e.preventDefault();
                var $this = $(this);
                $this.addClass('start_btn_in');
                startTime = new Date().getTime();
                //开始录音
                wx.startRecord();
            });
            //***********************************//
            //停止录音接口
            $('.start_btn').on('touchend', function(){
                var $this = $(this);
                $this.removeClass('start_btn_in');
                //停止录音接口
                wx.stopRecord({
                    success: function (res) {
                        localId = res.localId;
                    }
                });
                endTime = new Date().getTime();
                alert((endTime - startTime) / 1000);
                if((endTime - startTime) / 1000 < minTime){
                    localId = '';
                    alert('录音少于' + minTime +  '秒,录音失败,请重新录音');
                }
            });
            //监听录音自动停止接口
            wx.onVoiceRecordEnd({
                //录音时间超过一分钟没有停止的时候会执行 complete 回调
                complete: function (res) {
                    localId = res.localId;
                
                    $('.start_btn').removeClass('start_btn_in');
                }
            });
            //***********************************//
        
        
            $('.play_btn').on('click',function(){
                if(!localId){
                    alert('您还未录音,请录音后再点击播放');
                    return;
                }
                var $this = $(this);
                if($this.hasClass('stop_btn')){
                    $(this).removeClass('stop_btn').text('点我播放');
                
                    //        //暂停播放接口
                    //        wx.pauseVoice({
                    //            //需要暂停的音频的本地ID,由 stopRecord 或 onVoiceRecordEnd 接口获得
                    //            localId: localId
                    //        });
        
                    //停止播放接口
                    wx.stopVoice({
                        //需要停止的音频的本地ID,由 stopRecord 或 onVoiceRecordEnd 接口获得
                        localId: localId
                    });
                }else{
                    $this.addClass('stop_btn').text('点我停止');
                
                    //播放语音接口
                    wx.playVoice({
                        //需要播放的音频的本地ID,由 stopRecord 或 onVoiceRecordEnd 接口获得
                        localId: localId
                    });
                }
            });
            //监听语音播放完毕接口
            wx.onVoicePlayEnd({
                //需要下载的音频的服务器端ID,由uploadVoice接口获得
                serverId: localId,
                success: function (res) {
                    $('.play_btn').removeClass('stop_btn').text('点我播放');
                
                    //返回音频的本地ID
                    //localId = res.localId;
                }
            });
        
        
            //***********************************//
        
        
            //上传语音接口
            $('.send_btn').on('click',function(){
                if(!localId){
                    alert('您还未录音,请录音后再保存');
                    return;
                }
                alert('上传语音,测试,并未提交保存');
                return;
            
                //上传语音接口
                wx.uploadVoice({
                    //需要上传的音频的本地ID,由 stopRecord 或 onVoiceRecordEnd 接口获得
                    localId: localId, 
                    //默认为1,显示进度提示
                    isShowProgressTips: 1,
                    success: function (res) {
                        //返回音频的服务器端ID
                        serverId = res.serverId;
                    }
                });
            });
    
    
    
        });
    </script>

               与百度地图接口获取数据对比了多次,微信内置地图经纬度实际误差较大。 大概有一公里的误差。

  • 相关阅读:
    Android -- DiskLruCache
    Android -- EventBus解析
    Android -- Annotation
    Ubuntu 1604 安装配置 kafka,并配置开机自启(systemctl)
    zookeeper/kafka的部署
    pdf 中内容的坐标系
    C# 获取Windows 设备信息
    C#读取Word指定页的内容
    再看C# ThreadPool与Task的认识总结
    同步IO、异步IO、阻塞IO、非阻塞IO之间的联系与区别
  • 原文地址:https://www.cnblogs.com/cr-cool/p/12803046.html
Copyright © 2011-2022 走看看