问题标签 [wavesurfer.js]

我在 Ionic 3 应用程序中使用Video.js来播放视频和音频，一切正常。但现在，我想将Video.js Wavesufer 插件用于音频。

我通过 npm 安装了插件：

并将它们导入到我的 component.ts 中：

我调用videojs了函数来初始化播放器：

但控制台打印以下错误：

错误：插件“wavesurfer”不存在。

因此，我将对象更改为：

并且显然识别了插件，但现在我收到了这个错误（我说它显然识别了插件，因为这个错误来自videojs.wavesurfer.min.js）：

未捕获的错误：找不到模块“WaveSurfer”

我已经尝试添加WaveSurfer到导入，app.components.ts但没有任何变化。那么，我该如何解决呢？

所以我试图将本地文件加载到 wavesufer.js 波形中。它可以很好地从 iOS 上的设备存储中加载文件，但我一辈子都无法让它在 Android 上运行。

根据 Chrome 调试器，GET 请求成功，但随后返回“XHR 错误”，文件未加载。我尝试了很多解决方法都无济于事。任何帮助表示赞赏。

请注意，该文件已被验证位于该位置，并且可以使用 cordova 媒体插件播放。我也试过这个没有 url 中的文件标签。当文件放在 www/assets 文件夹中并从那里加载时，上面的代码可以工作。

更新

我换了

import {WaveSurfer} from "js/wavesurfer.js/src/wavesurfer.js"

经过

import WaveSurfer from "./js/wavesurfer.js/src/wavesurfer.js"

现在似乎已导入，但我现在收到以下错误：

SyntaxError: bad method definition (wavesurfer.js:179:4)（请参见此处的相应行）

我正在尝试从wavesurfer.js运行一个示例，其中包含代码的本地克隆。

使用下面显示的代码，我得到

按照此处给出的建议，我将第一行替换index.html为

并得到

我应该如何导入WaveSurfer？

索引.html

缩放.js

我正在尝试为我的应用程序中的音频和视频内容生成波形，目前使用 angular 6 和 TypeScript。我可以使用 wavesurfer.js 制作波形，但我无法让时间线插件正常工作。在我的 angular.json 我有这样的脚本

在我的 component.ts 文件中，我有类似的代码

如果没有插件，我可以获得波形，但如果我尝试添加插件，我会收到错误“TimelinePlugin 未定义”。谁能告诉我如何使用打字稿使用这些插件。一个例子会很棒。

对于我的项目，我使用 MediaRecorder 录制用户音频，它几乎可以正常工作。当我希望使用 Wavesurfer.js 显示用户记录的波形时，我的问题就出现了，它不会加载我的记录。不过，使用音频元素播放录音效果很好。

在尝试了不同的来源之后，它似乎是因为最终的 .webm 文件没有太多元数据，甚至没有持续时间或比特率（即使我在 MediaRecorder 选项中设置了它）。以下是 ffprobe 的输出以及其中一个文件：

输入#0，matroska，webm，来自“206_3.webm”：
元数据：
编码器：Chrome
持续时间：N/A，开始：0.000000，比特率：N/A
Stream #0:0(eng)：音频：opus，48000 Hz , 单声道, fltp (默认)

所以我的问题是：我在录制音频方面做错了吗？这是我开始录制的方式：

如您所见，我创建了一个 blob，稍后我会使用 NodeJS 的fs.writeFile. 然后当我需要显示波形时，我使用fs.readFile如下方式加载文件：

我用 wavesurfer.js 创建波形播放器。在 HTML CSS 中，它在 Firefox 和 Chrome 中可以正常工作，但是当我在 Firefox 中将它移到我的 WordPress 主题时没有画波，但在 chrome 中很好。有人有同样的问题吗？

JS 文件被加载，音乐只播放了，没有画波。

菜鸟问题我敢肯定。要温柔。（或者不是，它不会杀了我）。

也许答案已经发布了，我只是在搜索中没有认出它，但是这里有：

我有一个定义方法的类。我已经创建了该类的几个实例并将它们保存在一个数组中。当我尝试访问类中定义的实例方法时，我收到错误“无法读取属性”。如果我将数组索引对象分配给一个变量并进行调用，它不会引发错误，但也不会似乎按预期工作。也就是说，在我的循环中，它似乎只为最后一次迭代分配方法。代码可能会有所帮助，尽管它可能是令人尴尬的：

对于熟悉它的人，wavesurfer.js 定义了 wavesurfer 对象的 playPause 方法，由我的类方法中的 createWave() 返回。如果我w.playPause按上述方式调用它，它可以工作 - 但仅适用于两个实例之一。如果我放弃 var w = waves[i] 分配并简单地尝试将 onclick 操作设置为waves[i].playPause()`，我会收到提到的错误。

我不知道这是否足以继续，但希望得到任何指导或提示。

我花了几个小时试图从加载了 wavesurfer.js 的立体声 mp3 文件中选择一个频道

我正在工作 angular cli 正在尝试添加麦克风插件不起作用。让我知道如何添加包。这是我的代码 angular.json 文件

****这是我的 .ts 文件，出现错误有人可以帮助我****

我正在使用 wavesurfer 包播放音频文件。我正在使用状态变量来播放，暂停循环中的音频文件，但是当我按下播放按钮时播放特定文件时遇到问题，它会播放所有文件，因为我正在使用状态变量作为“播放”变量播放。请参见上文代码。

请建议我更好的解决方案来播放特定文件。