Skip to content

Commit

Permalink
github.io迁移到gitee.io
Browse files Browse the repository at this point in the history
  • Loading branch information
xiangyuecn committed Oct 19, 2020
1 parent 8da8276 commit a0fc2c1
Show file tree
Hide file tree
Showing 5 changed files with 35 additions and 8 deletions.
27 changes: 24 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,32 @@

[](?Ref=Desc&Start)[在线测试](https://xiangyuecn.gitee.io/recorder/),支持大部分已实现`getUserMedia`的移动端、PC端浏览器;主要包括:Chrome、Firefox、Safari、Android WebView、腾讯Android X5内核(QQ、微信);不支持:~~UC系内核(典型的支付宝),大部分国产手机厂商自研套壳娱乐浏览器,IOS上除Safari外的其他任何形式的浏览器(含PWA、WebClip、任何App内网页)~~

**Recorder H5**: [ [H5在线测试](https://xiangyuecn.gitee.io/recorder/) ][ [H5 QuickStart](https://xiangyuecn.gitee.io/recorder/QuickStart.html) ][ [vue+webpack测试](https://xiangyuecn.gitee.io/recorder/assets/demo-vue) ]

**RecordApp**: [ [RecordApp测试](https://jiebian.life/web/h5/github/recordapp.aspx) ][ [RecordApp QuickStart](https://jiebian.life/web/h5/github/recordapp.aspx?path=/app-support-sample/QuickStart.html) ][ [Android、IOS App 源码](https://github.com/xiangyuecn/Recorder/tree/master/app-support-sample) ]

**工具**: [ [Recorder代码运行和静态分发](https://xiangyuecn.gitee.io/recorder/assets/%E5%B7%A5%E5%85%B7-%E4%BB%A3%E7%A0%81%E8%BF%90%E8%A1%8C%E5%92%8C%E9%9D%99%E6%80%81%E5%88%86%E5%8F%91Runtime.html) ][ [裸(RAW、WAV)PCM转WAV播放测试和转码](https://xiangyuecn.gitee.io/recorder/assets/%E5%B7%A5%E5%85%B7-%E8%A3%B8PCM%E8%BD%ACWAV%E6%92%AD%E6%94%BE%E6%B5%8B%E8%AF%95.html) ][ [无用户操作测试](https://xiangyuecn.gitee.io/recorder/assets/ztest_no_user_operation.html) ][ [Can I Use查看浏览器支持情况](https://caniuse.com/#search=getUserMedia) ]

**Recorder H5**
[ [H5在线测试](https://xiangyuecn.gitee.io/recorder/) ]
[ [H5 QuickStart](https://xiangyuecn.gitee.io/recorder/QuickStart.html) ]
[ [vue+webpack测试](https://xiangyuecn.gitee.io/recorder/assets/demo-vue) ]



**RecordApp**
[ [RecordApp测试](https://jiebian.life/web/h5/github/recordapp.aspx) ]
[ [RecordApp QuickStart](https://jiebian.life/web/h5/github/recordapp.aspx?path=/app-support-sample/QuickStart.html) ]
[ [Android、IOS App 源码](https://github.com/xiangyuecn/Recorder/tree/master/app-support-sample) ]



**工具集**
[ [Recorder代码运行和静态分发](https://xiangyuecn.gitee.io/recorder/assets/%E5%B7%A5%E5%85%B7-%E4%BB%A3%E7%A0%81%E8%BF%90%E8%A1%8C%E5%92%8C%E9%9D%99%E6%80%81%E5%88%86%E5%8F%91Runtime.html) ]
[ [裸(RAW、WAV)PCM转WAV播放测试和转码](https://xiangyuecn.gitee.io/recorder/assets/%E5%B7%A5%E5%85%B7-%E8%A3%B8PCM%E8%BD%ACWAV%E6%92%AD%E6%94%BE%E6%B5%8B%E8%AF%95.html) ]
[ [无用户操作测试](https://xiangyuecn.gitee.io/recorder/assets/ztest_no_user_operation.html) ]
[ [Can I Use查看浏览器支持情况](https://caniuse.com/#search=getUserMedia) ]





录音默认输出mp3格式,另外可选wav格式;有限支持ogg(beta)、webm(beta)、amr(beta)格式;支持任意格式扩展(前提有相应编码器)。

Expand Down
8 changes: 6 additions & 2 deletions app-support-sample/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,18 +34,22 @@ RecordApp默认开启IOS端微信内的支持(可配置禁用支持),在IO
- 签名接口:使用微信JsSDK需要后端提供JsSDK签名。
- 素材下载接口:JsSDK录音完成后需要后端服务器调用微信素材接口下载录音二进制数据。

你可以直接copy [app-support-sample/ios-weixin-config.js](https://github.com/xiangyuecn/Recorder/blob/master/app-support-sample/ios-weixin-config.js) 这个演示配置文件改改,提供后端接口后即可正常使用。

详细的接口文档和实现,请阅读下面的`Weixin(IOS-Weixin).Config`章节。


## 【App】可选 - 实现App原生接口
RecordApp默认未开启App内原生录音支持,可开启后在App环境中将走Native录音,其他环境走Weixin、H5录音。

你可以直接copy [app-support-sample/native-config.js](https://github.com/xiangyuecn/Recorder/blob/master/app-support-sample/native-config.js) 这个演示配置文件改改,然后Android、IOS App内使用`demo_android``demo_ios`目录内的`RecordAppJsBridge.java``RecordAppJsBridge.swift`,即可正常使用。

详细的开启和实现,请阅读下面的`Native.Config`章节。

> 注:Android可以不实现App原生接口,仅IOS App实现原生接口;因为Android可以通过开启WebView的H5录音权限来进行H5录音,不过H5的麦克风获取似乎没有原生来的稳定,具体的H5权限开启请阅读Recorder首页文档中 `Android Hybrid App中录音示例` 这节。

## 1】加载框架
## 集成步骤1】加载框架

**方式一**:使用script标签引入

Expand Down Expand Up @@ -116,7 +120,7 @@ import 'recorder-core/src/extensions/waveview'
```
[](?RefEnd)

## 2】调用录音
## 集成步骤2】调用录音
[](?Ref=Codes&Start)然后使用,假设立即运行,只录3秒,会自动根据环境使用Native录音、微信JsSDK录音、H5录音
``` javascript
//var dialog=createDelayDialog(); 开启可选的弹框伪代码,需先于权限请求前执行,因为回调不确定是同步还是异步的
Expand Down
2 changes: 1 addition & 1 deletion app-support-sample/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -183,7 +183,7 @@

<script>
//兼容环境
var PageLM="2020-1-12 11:44:28";
var PageLM="2020-10-19 22:44:28";

function RandomKey(){
return "randomkey"+(RandomKey.idx++);
Expand Down
2 changes: 2 additions & 0 deletions app-support-sample/ios-weixin-config.js
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,9 @@ if(isIOS){
win[sbwxKey]=win[sbwxKey]||window[sbwxKey]||location.href;
//如果你是在 history.pushState 修改了地址之后加载的本js,就更惨了,此初始化url将不准确,因此你可以在页面首次加载时立即设置Bad_WeixinIOSH5HistoryInitLocation变量为那时的location.href

$(function(){setTimeout(function(){
console.warn("1970-2020年 IOS内微信不认 history.pushState 产生的新地址,如果签名地址不是页面加载时的地址,可能会导致问题(如果哪天又认了,恭喜核弹已起爆),当前签名使用的地址为:"+win[sbwxKey]);
},3000)});
};


Expand Down
4 changes: 2 additions & 2 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -145,7 +145,7 @@

<script>
//兼容环境
var PageLM="2020-1-12 11:44:28";
var PageLM="2020-10-19 22:44:28";

function RandomKey(){
return "randomkey"+(RandomKey.idx++);
Expand Down Expand Up @@ -370,7 +370,7 @@

<div class="mainBox">
<span class="lb">视频播放测试 :</span>
<button onclick="$('.videoTest').show().html('<video controls webkit-playsinline playsinline x5-video-player-type=\'h5\' src=\'assets/audio/movie-sexy-rabbit-baby.mp4\' style=\'width:240px;height:160px\'></'+'video>').find('video')[0].play()">播放mp4</button>
<button onclick="$('.videoTest').show().html('<video controls webkit-playsinline playsinline x5-video-player-type=\'h5\' src=\'https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/assets/audio/movie-sexy-rabbit-baby.mp4\' style=\'width:240px;height:160px\'></'+'video>').find('video')[0].play()">播放mp4</button>

Video对录音的影响测试(<a href="https://github.com/xiangyuecn/Recorder/issues/84">issues#84</a>);IOS Safari可能出现先播放视频,然后再开始录音,会自动播放视频的声音,但并未再现。
<button onclick="$('.videoTest').show()">显示video</button>
Expand Down

0 comments on commit a0fc2c1

Please sign in to comment.