Question

我试图将一个音频文件（来自网络应用程序）提供给一个存储在网络位置的音频文件，它可以正常工作，但我想实际处理这样做的ajax我可以在缓冲/提取音频时显示一个掩码。

C＃代码如下所示：

        long fSize = (new System.IO.FileInfo(FilePath)).Length;
        long startbyte = 0;
        long endbyte = fSize - 1;
        int statusCode = 200;
        if ((request.Headers["Range"] != null))
        {
            //Get the actual byte range from the range header string, and set the starting byte.
            string[] range = request.Headers["Range"].Split(new char[] { '=', '-' });
            startbyte = Convert.ToInt64(range[1]);
            if (range.Length > 2 && range[2] != "") endbyte = Convert.ToInt64(range[2]);
            //If the start byte is not equal to zero, that means the user is requesting partial content.
            if (startbyte != 0 || endbyte != fSize - 1 || range.Length > 2 && range[2] == "")
            { statusCode = 206; }//Set the status code of the response to 206 (Partial Content) and add a content range header.                                    
        }
        long desSize = endbyte - startbyte + 1;
            //Headers
            response.StatusCode = statusCode;
            response.ContentType = String.Format(@"audio/{0}", fileLocation.Split('.')[1]);
            response.AddHeader("Content-Length", desSize.ToString());
            response.AddHeader("Content-Range", string.Format("bytes {0}-{1}/{2}", startbyte, endbyte, fSize));
            response.AddHeader("Content-Disposition", Regex.Replace(fileLocation, @"([^\\]+$)", v => String.Format("attachment; filename={0}", v.Value)));
            //Data
            response.WriteFile(FilePath, startbyte, desSize);
            response.End();

直接从src标签调用C＃代码，如下所示：

Ext.create('widget.panel', {
                           html: '<audio controls>' +
                            '<source src="/api/getaudio/' + encodeURIComponent(audioPath) + '/"' +
                            ' type="audio/' + el.getAttribute('data-audiolocation').split('.')[1] + '">' +
                            '</audio>',
                     });

但由于ajax-call不是由框架构成的，我无法处理请求。

我试图像这样解除它：

var audioFile = Ext.Ajax.request({
            url: '/api/getaudio/' + encodeURIComponent(audioPath) + '/',
            method: 'GET',
            success: function(response, opts) {
                console.log(response);
            },
            failure: function(response, opts){
                console.log(response);
            }
        });

html: '<audio controls src="' + audioPath + '"></audio>',

但这似乎不起作用。

我可以做些什么来在html-tag之外进行ajax-call然后把/注入到html5-audio-player-thing的响应？

或者我可以以某种方式拦截函数本身内的ajax并添加一个掩码或做任何事情吗？我已经看到有些人在谈论捕获所有ajax请求，但这似乎有点过分才能让它发挥作用。

Answer 1

斯图尔特指出我的方向正确。

然而，我使用框架“Ext.get”方法来访问具有其他方法（具有相同名称）的HTML5音频播放器，因此我不得不使用普通的javascript并为“canplay”事件添加一个监听器： / p>

 document.getElementById('audioPlayer').addEventListener("canplay", function(event) {
                        Ext.get('audioWindow').unmask();
                        document.getElementById('audioPlayer').play();
                    }, true);
                    document.getElementById('audioSource').src = '/api/getaudio/' + encodeURIComponent(audioPath) + '/';
                    document.getElementById('audioPlayer').load();

从网络位置提供音频

1 个答案: