Skip to content

Commit

Permalink
更新文档
Browse files Browse the repository at this point in the history
  • Loading branch information
xiangyuecn committed Feb 11, 2022
1 parent 77d9667 commit 466e4f8
Show file tree
Hide file tree
Showing 6 changed files with 43 additions and 25 deletions.
25 changes: 15 additions & 10 deletions QuickStart.html
Original file line number Diff line number Diff line change
Expand Up @@ -10,18 +10,25 @@
var Tips='你可以直接将 <a target="_blank" href="https://github.com/xiangyuecn/Recorder/blob/master/QuickStart.html">/QuickStart.html</a> 文件copy到你的(https)网站中,无需其他文件,就能正常开始测试了;相比 Recorder H5 (/index.html) 这个大而全(杂乱)的demo,本文件更适合入门学习'+unescape("%uD83D%uDE04");
console.log(Tips);
</script>
</head>


<body>
<script>
var onBadCDN=function(){
document.querySelector(".badCDN").innerHTML="cdn.jsdelivr.net可能不稳定,未能检测到js被成功加载。<br>如果页面异常,请复制本页面源码到本地测试,并且批量替换掉 https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/ 为 https://xiangyuecn.gitee.io/recorder/ 就能正常测试了";
};
</script>
<div class="badCDN" style="font-size: 50px;text-align: center;color: #f60;"></div>


<!--
【1】引入框架文件,注意自己使用时应当自己把源码clone下来,然后通过src="/src/recorder-core.js"引入,这里为了方便copy文件测试起见,使用了JsDelivr CDN
【1】引入框架文件,注意自己使用时应当自己把源码clone下来,然后通过src="/src/recorder-core.js"引入,这里为了方便copy文件测试起见,使用了JsDelivr CDN,这玩意不一定能正常访问
另外:[1.1]、[1.2]可以合并为使用"/recorder.mp3.min.js",这个文件为压缩版大幅减小文件体积,已经包含了这3个源码文件
-->

<!-- 【1.1】引入核心文件 -->
<script src="https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/src/recorder-core.js"></script>
<script src="https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/src/recorder-core.js" onerror="onBadCDN()"></script>

<!-- 【1.2】引入相应格式支持文件;如果需要多个格式支持,把这些格式的编码引擎js文件放到后面统统加载进来即可 -->
<script src="https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/src/engine/mp3.js"></script>
Expand All @@ -32,20 +39,18 @@
<script src="https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/src/extensions/lib.fft.js"></script>


</head>
<body>

<!-- 【2】构建界面 -->
<div class="main">
<div class="mainBox">
<span style="font-size:32px;color:#f60;">Recorder QuickStart: 快速入门</span>
<a href="https://github.com/xiangyuecn/Recorder">GitHub >></a>
<a href="https://github.com/xiangyuecn/Recorder" target="_blank">GitHub</a>
| <a href="https://gitee.com/xiangyuecn/Recorder" target="_blank">Gitee</a>

<div style="padding-top:10px;color:#666">
更多Demo:
<a class="lb" href="https://xiangyuecn.gitee.io/recorder/">Recorder H5</a>
<a class="lb" href="https://jiebian.life/web/h5/github/recordapp.aspx">RecordApp</a>
<a class="lb" href="https://jiebian.life/web/h5/github/recordapp.aspx?path=/app-support-sample/QuickStart.html">RecordApp QuickStart</a>
<a class="lb" href="https://xiangyuecn.gitee.io/recorder/" target="_blank">Recorder H5</a>
<a class="lb" href="https://jiebian.life/web/h5/github/recordapp.aspx" target="_blank">RecordApp</a>
<a class="lb" href="https://jiebian.life/web/h5/github/recordapp.aspx?path=/app-support-sample/QuickStart.html" target="_blank">RecordApp QuickStart</a>
</div>
</div>

Expand Down
17 changes: 12 additions & 5 deletions app-support-sample/QuickStart.html
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,13 @@

/**【需修改】请使用自己的js文件目录,不要用github的不稳定。RecordApp会自动从这个目录内进行加载相关的实现文件、Recorder核心、编码引擎,会自动默认加载哪些文件,请查阅app.js内所有Platform的paths配置**/
var PageSet_RecordAppBaseFolder = "https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/dist/";//使用dist目录内的文件小2/3

//自己使用时应当自己把源码clone下来,然后通过src="/src/app-support/app.js"引入,为了方便copy文件测试起见,使用了JsDelivr CDN,这玩意不一定能正常访问
var onBadCDN=function(){
document.querySelector(".badCDN").innerHTML="cdn.jsdelivr.net可能不稳定,未能检测到js被成功加载。<br>如果页面异常,请复制本页面源码到本地测试,并且批量替换掉 https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/ 为 https://xiangyuecn.gitee.io/recorder/ 就能正常测试了";
};
</script>
<div class="badCDN" style="font-size: 50px;text-align: center;color: #f60;"></div>

<!--【1.1】加载独立配置文件,免得修改app.js-->
<!-- 可选开启ios weixin支持的相关配置 -->
Expand All @@ -53,7 +59,7 @@
【1.2】引入框架文件,app.js会自动加载实现文件、Recorder核心、编码引擎,需确保PageSet_RecordAppBaseFolder目录正确
注意自己使用时应当自己把源码clone下来,然后通过src="/src/app-support/app.js"引入,这里为了方便copy文件测试起见,使用了JsDelivr CDN。
-->
<script src="https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/dist/app-support/app.js"></script>
<script src="https://cdn.jsdelivr.net/gh/xiangyuecn/Recorder@latest/dist/app-support/app.js" onerror="onBadCDN()"></script>


<script>
Expand Down Expand Up @@ -96,13 +102,14 @@
<div class="main">
<div class="mainBox">
<span style="font-size:32px;color:#f60;">RecordApp QuickStart: 快速入门</span>
<a href="https://github.com/xiangyuecn/Recorder">GitHub >></a>
<a href="https://github.com/xiangyuecn/Recorder" target="_blank">GitHub</a>
| <a href="https://gitee.com/xiangyuecn/Recorder" target="_blank">Gitee</a>

<div style="padding-top:10px;color:#666">
更多Demo:
<a class="lb" href="https://xiangyuecn.gitee.io/recorder/">Recorder H5</a>
<a class="lb" href="https://jiebian.life/web/h5/github/recordapp.aspx">RecordApp</a>
<a class="lb" href="https://xiangyuecn.gitee.io/recorder/QuickStart.html">Recorder QuickStart</a>
<a class="lb" href="https://xiangyuecn.gitee.io/recorder/" target="_blank">Recorder H5</a>
<a class="lb" href="https://jiebian.life/web/h5/github/recordapp.aspx" target="_blank">RecordApp</a>
<a class="lb" href="https://xiangyuecn.gitee.io/recorder/QuickStart.html" target="_blank">Recorder QuickStart</a>
</div>
</div>

Expand Down
10 changes: 6 additions & 4 deletions app-support-sample/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -236,17 +236,19 @@
</a>

<a class="navItem slc" href="https://jiebian.life/web/h5/github/recordapp.aspx">
<div class="navTitle">RecordApp[即将废弃]</div>
<div class="navDesc">RecordApp除Recorder支持的外,支持Hybrid App,低版本IOS上支持微信网页和小程序web-view</div>
<div class="navTitle" style="text-decoration: line-through">RecordApp</div>
<div class="navDesc">[即将废弃]支持:Recorder + Hybrid App + 低版本IOS上的微信</div>
</a>

<div style="margin-top:8px" class="pd">
<div style="font-size:18px;color:#ef6ea8">仅为兼容低版本IOS而生,IOS 14.3+已无需本兼容方案即可实现H5录音;如果你不打算兼容低版本IOS,请不用研究RecordApp,直接使用简单强大的Recorder即可</div>
<div style="font-size:18px;color:#ef6ea8">仅为兼容低版本IOS而生,IOS 14.3+已无需本兼容方案即可实现H5录音;如果你不打算兼容低版本IOS,请不用研究RecordApp,直接使用简单强大的Recorder H5即可</div>
RecordApp会加载Recorder,因此算是完全兼容Recorder。在开启了原生App支持(Platforms.Native)的情况下,Hybrid App内会走App原生录音;在开启IOS微信支持(Platforms.IOS-Weixin)的情况下,在IOS(11.0-14.2)微信内会走微信JsSDK录音;其他情况走Recorder。

</div>
<div>
<span class="lb">GitHub :</span> <a href="https://github.com/xiangyuecn/Recorder/tree/master/app-support-sample">前往GitHub仓库</a>
<span class="lb">源码仓库 :</span>
<a href="https://github.com/xiangyuecn/Recorder/tree/master/app-support-sample" target="_blank">GitHub</a>
| <a href="https://gitee.com/xiangyuecn/Recorder/tree/master/app-support-sample" target="_blank">Gitee</a>

<span class="lb">更多Demo :</span> <a href="https://xiangyuecn.gitee.io/recorder/assets/工具-代码运行和静态分发Runtime.html" target="_blank">在线编辑和运行</a>
| <a href="https://xiangyuecn.gitee.io/recorder/assets/demo-vue" target="_blank">H5 vue</a>
Expand Down
3 changes: 2 additions & 1 deletion assets/工具-代码运行和静态分发Runtime.html
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,8 @@
<div class="main">
<div class="mainBox">
<span style="font-size:32px;color:#f60;">Recorder代码运行和静态分发工具</span>
<a href="https://github.com/xiangyuecn/Recorder">GitHub >></a>
<a href="https://github.com/xiangyuecn/Recorder" target="_blank">GitHub</a>
| <a href="https://gitee.com/xiangyuecn/Recorder" target="_blank">Gitee</a>
</div>

<div class="mainBox">
Expand Down
3 changes: 2 additions & 1 deletion assets/工具-裸PCM转WAV播放测试.html
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,8 @@
<div class="main">
<div class="mainBox">
<span style="font-size:32px;color:#f60;">裸(RAW、WAV)PCM转WAV播放测试和转码</span>
<a href="https://github.com/xiangyuecn/Recorder">GitHub >></a>
<a href="https://github.com/xiangyuecn/Recorder" target="_blank">GitHub</a>
| <a href="https://gitee.com/xiangyuecn/Recorder" target="_blank">Gitee</a>
</div>

<div class="mainBox">
Expand Down
10 changes: 6 additions & 4 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="shortcut icon" type="image/png" href="assets/icon.png">

<title>Recorder测试</title>
<title>Recorder H5: 用于html5网页中的前端录音解决方案,此录音插件支持mp3 wav pcm amr ogg webm格式,支持实时上传 语音识别 音频可视化 实时处理,可在PC端 移动端 Android IOS 原生App中跨平台使用</title>

<script>
console.log(
Expand Down Expand Up @@ -195,12 +195,14 @@
</a>

<a class="navItem" href="https://jiebian.life/web/h5/github/recordapp.aspx">
<div class="navTitle">RecordApp[即将废弃]</div>
<div class="navDesc">RecordApp除Recorder支持的外,支持Hybrid App,低版本IOS上支持微信网页和小程序web-view</div>
<div class="navTitle" style="text-decoration: line-through">RecordApp</div>
<div class="navDesc">[即将废弃]支持:Recorder + Hybrid App + 低版本IOS上的微信</div>
</a>

<div style="margin-top:8px">
<span class="lb">GitHub :</span> <a href="https://github.com/xiangyuecn/Recorder">前往GitHub仓库</a>
<span class="lb">源码仓库 :</span>
<a href="https://github.com/xiangyuecn/Recorder" target="_blank">GitHub</a>
| <a href="https://gitee.com/xiangyuecn/Recorder" target="_blank">Gitee</a>

<span class="lb">更多Demo :</span> <a href="https://xiangyuecn.gitee.io/recorder/assets/工具-代码运行和静态分发Runtime.html" target="_blank">在线编辑和运行</a>
| <a href="https://xiangyuecn.gitee.io/recorder/assets/demo-vue" target="_blank">H5 vue</a>
Expand Down

0 comments on commit 466e4f8

Please sign in to comment.