折腾:
期间,看到这个库:
但是好像获取不到麦克风:
继续想办法看看:
还是:Could not get audio media device: TypeError: Failed to execute 'getUserMedia' on 'MediaDevices': Malformed constraint: Cannot use both optional/mandatory and specific or advanced constraints.
TypeError: Failed to execute ‘getUserMedia’ on ‘MediaDevices’: Malformed constraint
试试:
然后可以正常录音和播放:
以及保存后正常播放:
-》
所以,证明:
这个库是没问题的
换个safari浏览器试试是否正常工作:
结果出错:[Error] ReferenceError: Can't find variable: AudioContext
全局代码 (RecorderDemo.js:15)
代码:// audio context + .createScriptProcessor shim
var audioContext = new AudioContext;
if (audioContext.createScriptProcessor == null)
audioContext.createScriptProcessor = audioContext.createJavaScriptNode;
先不管了,所以去试试Chrome中,能否正常合并到自己的代码中。
参考旧的demo:
同时也借鉴,虽然工作不正常的,新的demo:
-》可以参考:
去更新一下代码,即可使用了。
去把
的html+js等代码下载到本地,试试效果
看起来需要另外再找<script src="js/WebAudioRecorder.min.js"></script>
<script src="js/RecorderDemo.js"></script>
然后路径上加上js:
结果看到源码
而打开:
结果404
注意到这个是github.io的
打开:
是普通页面:
想办法去直接github上git clone对应源码
根据自己之前的经验:
自己的是:
去看看:
果然是github某人的页面
然后去找
果然是git源码仓库:
然后去打开js:
竟然没有我们要的:
js/WebAudioRecorder.min.js
js/RecorderDemo.js
算了去:➜WebAudioRecorder git clone /higuma/higuma.github.io.git
Cloning into 'higuma.github.io'...
remote: Counting objects: 107, done.
remote: Total 107 (delta 0), reused 0 (delta 0), pack-reused 107
Receiving objects: 100% (107/107), 3.69 MiB | 96.00 KiB/s, done.
Resolving deltas: 100% (24/24), done.
➜WebAudioRecorder ll
total 0
drwxr-xr-x13 crifanstaff416B6 21 11:35 higuma.github.io
➜WebAudioRecorder cd higuma.github.io
➜higuma.github.io git:(master) ll
total 80
drwxr-xr-x3 crifanstaff96B6 21 11:35
drwxr-xr-x4 crifanstaff128B6 21 11:35 archives
drwxr-xr-x3 crifanstaff96B6 21 11:35 assets
drwxr-xr-x4 crifanstaff128B6 21 11:35 categories
drwxr-xr-x8 crifanstaff256B6 21 11:35 css
drwxr-xr-x12 crifanstaff384B6 21 11:35 fancybox
-rw-r--r--1 crifanstaff3.6K6 21 11:35 favicon.ico
-rw-r--r--1 crifanstaff35K6 21 11:35 index.html
drwxr-xr-x3 crifanstaff96B6 21 11:35 js
drwxr-xr-x4 crifanstaff128B6 21 11:35 tags
看看,发现真的没有我们要找的js文件:
再去试试这几个地址:
那去下载:
注:
另外抽空直接用:
的底层用到的库:
也可以
结果保存下来,打开却是html源代码,而不是网页:
所以放弃。
然后无意间发现:
Chrome本身直接保存的话,则直接会自动下载相关的js库:
然后打开,可以看到页面:
但是算了,因为看起来:
的修复的代码,不知道改在哪里
并且改了后,对应的onChangeAudioIn不知道是否正常了。
所以还是去下载和参考:
吧
结果保存后,打开,始终显示:
loading wav encoder
没法结束了。
等了半天,点击一下页面,好像才结束:
然后接着继续测试看看
结果不行。重新刷新页面发现最开始加载出错:
Uncaught DOMException: Failed to construct 'Worker': Script at 'file:///Users/crifan/dev/dev_src/javascript/audio%20record/WebAudioRecorder/web-audio-recorder-js/js/WebAudioRecorderWav.min.js' cannot be accessed from origin 'null'.
at initWorker (file:///Users/crifan/dev/dev_src/javascript/audio%20record/WebAudioRecorder/web-audio-recorder-js/WebAudioRecorder.js%20demo%20old_files/WebAudioRecorder.min.js:1:2805)
at new i (file:///Users/crifan/dev/dev_src/javascript/audio%20record/WebAudioRecorder/web-audio-recorder-js/WebAudioRecorder.js%20demo%20old_files/WebAudioRecorder.min.js:1:829)
at file:///Users/crifan/dev/dev_src/javascript/audio%20record/WebAudioRecorder/web-audio-recorder-js/WebAudioRecorder.js%20demo%20old_files/RecorderDemo.js:106:21
看来需要把:
WebAudioRecorder.min.js
换成:
WebAudioRecorder.js
才能方便找到源码出错的地方
-》
-》
本来是想要通过下载到本地,然后参考人家实现的效果的,结果弄了半天都是会出现js加载的问题:
WebAudioRecorder.min.js:1 Uncaught DOMException: Failed to construct 'Worker': Script at 'file:///Users/crifan/dev/dev_src/javascript/audio%20record/WebAudioRecorder/demo/WebAudioRecorder_demo_old_files/js/WebAudioRecorderWav.min.js' cannot be accessed from origin 'null'.
at initWorker (file:///Users/crifan/dev/dev_src/javascript/audio%20record/WebAudioRecorder/demo/WebAudioRecorder_demo_old_files/js/WebAudioRecorder.min.js:1:2805)
at new i (file:///Users/crifan/dev/dev_src/javascript/audio%20record/WebAudioRecorder/demo/WebAudioRecorder_demo_old_files/js/WebAudioRecorder.min.js:1:829)
at file:///Users/crifan/dev/dev_src/javascript/audio%20record/WebAudioRecorder/demo/WebAudioRecorder_demo_old_files/RecorderDemo.js:106:21
initWorker @ WebAudioRecorder.min.js:1
i @ WebAudioRecorder.min.js:1
(anonymous) @ RecorderDemo.js:106
算了,放弃。
换成自己一点点写代码,看看能否正常调用录音功能
结果同样问题: