pkjy / pcm-player Goto Github PK

作者的PCMPlayer非常易用，不过在有波形显式需求时无法connect到内部的bufferSource，建议可以内置一个analyser

initAudioContext() {
        // 初始化音频上下文的东西
        this.audioCtx = new (window.AudioContext || window.webkitAudioContext)()
        // 控制音量的 GainNode
        // https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/createGain
        this.gainNode = this.audioCtx.createGain()
        this.gainNode.gain.value = 0.1
        this.gainNode.connect(this.audioCtx.destination)
        this.startTime = this.audioCtx.currentTime
        this.analyser = this.audioCtx.createAnalyser() // 初始化添加一个analyser
        this.analyser.fftSize = 2048;
    }

flush() {
        if (!this.samples.length) return
        const self = this
        var bufferSource = this.audioCtx.createBufferSource()
        if (typeof this.option.onended === 'function') {
            bufferSource.onended = function (event) {
                self.option.onended(this, event)
            }
        }
        const length = this.samples.length / this.option.channels
        const audioBuffer = this.audioCtx.createBuffer(this.option.channels, length, this.option.sampleRate)

        for (let channel = 0; channel < this.option.channels; channel++) {
            const audioData = audioBuffer.getChannelData(channel)
            let offset = channel
            let decrement = 50
            for (let i = 0; i < length; i++) {
                audioData[i] = this.samples[offset]
                /* fadein */
                if (i < 50) {
                    audioData[i] = (audioData[i] * i) / 50
                }
                /* fadeout*/
                if (i >= (length - 51)) {
                    audioData[i] = (audioData[i] * decrement--) / 50
                }
                offset += this.option.channels
            }
        }

        if (this.startTime < this.audioCtx.currentTime) {
            this.startTime = this.audioCtx.currentTime
        }
        // console.log('start vs current ' + this.startTime + ' vs ' + this.audioCtx.currentTime + ' duration: ' + audioBuffer.duration);
        bufferSource.buffer = audioBuffer
        bufferSource.connect(this.gainNode)
        bufferSource.connect(this.analyser) // bufferSource连接到analyser
        bufferSource.start(this.startTime)
        this.startTime += audioBuffer.duration
        this.samples = new Float32Array()
    }

感谢！

您好，我使用s16le + 48khz，感觉您的js效果有很大的底噪，对比了一下这个效果很不错，没有细看哪里不同。
https://github.com/samirkumardas/pcm-player

Hi,
If i try to play the example into a ios 15 iphone, it does not work. How can i fix it?

br

🙏求助： 有没有可以放大音量的方法，设置参数如下
inputCodec: 'Int16',
channels: 1,
sampleRate: 16000,
flushTime: 800,

播放时一直有底噪，请问下如何调节

Hi,
我有一個需求是將裝置錄到的 PCM 串流傳給 Web，我使用這個 lib 發現持續傳遞一段時間後，播放會有很大的延遲，想請問如果我的 PCM 即時且持續的傳遞下，pcm-player 是否有針對這個進行優化呢？

目前对接的是java后端，直接ws传过来的是bytes数组，我在前端用Uint8Array转化了一下，不知道是否可行？看作者方便提供一下联系方式，加下wx或者qq交流一下吗~感谢

Hi,

May I propose a new feature to your project? The feature is to add a new property (onended) to the options. The property is optional and can be assinged to a callback function that is fired when audio is played out. I could make a pull request if you don't mind.

Best regards

safari for ios没有声音,有没有人遇到过.

tts返回的数据是以整句的模式返回的，在一整段中，会先后返回多个句子的PCM。我按照返回的顺序，将每一句PCM通过player.feed()进行播放。但是句与句之间播放不连续，时间间隔较长。这个怎么解决呢？

后面两个参数的类型定义写错了吧？eslint会报错，应该改为这样？

onstatechange: (node: AudioContext, event: Event, type: AudioContextState) => void
onended: (node: AudioBufferSourceNode, event: Event) => void

另外这两个参数可以改为可选吗？

现在pcm数据全部播放一遍之后，就不能从头播放了，组件内部能否保存接收到的pcm数据，以便支持从头播放，就像 html 的 audio 标签那样

同时添加一个player.replay()的方法

Would it be possible to add a .download() method on PCMPlayer? Since it's raw PCM data, I'd like to download a .wav or .pcm file that is ready to be read with VLC or another media player directly. I thought since you already added the corresponding Header for the web version to work, can you implement the .download() method or guide me a little so i can do it myself (I don't have knowledge on audio data i might do wrong things). Thanks

Hello,
A like the onended function, how can we access onstart?

Would love to have this update to the package!

I recorded some audio from retroarch but every audio I play using this lib, the audio gets distorted.
The speed of audio is OK, and yet is a recognizable audio, but the sound gets distorted.
I have run the commands below (you may test in your own env just replacing the retroarch command by any software that emits sound):

# create audio sink to redirect emulator sound
pactl load-module module-null-sink sink_name=RetroArch format=u8 channels=1 rate=44100 sink_properties=device.description="RetroArch_Virtual_Sink"

# run emulator redirecting sound to the new sink
PULSE_SINK=RetroArch retroarch -L /home/unknown/snap/retroarch/957/.config/retroarch/cores/stella_libretro.so /home/unknown/Downloads/Atari\ 2600/Frogger.bin

# start recording the audio from the sink
parec -d RetroArch.monitor --raw --channels=1 --rate=44100 --format=u8 --latency-msec=100 -v > /tmp/output.raw

# after you captured the sound, you can play it using the command
cat /tmp/output.raw | pacat --raw --channels=1 --rate=44100 --format=u8

The sound is played very well when using pacat, but when I try to load it in the browser using the lib, the audio gets distorted.
Also I tried other formats like s16le, s16be, float32le, float32se, etc... And configured the lib to inputCodec as Int16, Int32, Float32 and the audio yet gets distorted.

Is this a bug or it just needs tweaking the configs?

Hi,
I think it would make sense to play flush inside destroy to ensure the buffer is played out. There is no reliable other way to flush the buffer before calling destroy

目前使用websocket持续接收后端传回来的音频流，然后调用feed持续进行播放，然后在播放途中会多次触发onended。播放的音频越长，onended触发的次数就越多。在使用中，feed了大概20次，后端ws传输音频中间没有断，在播放中onended大概会触发3、4次。

如题，后续会添加支持吗