Question

我打算实现的是一个页面，当客户端连接时，页面将不断从本地冰铸服务器（<?php header("Content-Transfer-Encoding: binary"); header("Content-Type: audio/mpeg, audio/x-mpeg, audio/x-mpeg-3, audio/mpeg3"); header('Content-Disposition: attachment; filename="stream.mp3"'); header('X-Pad: avoid browser bug'); header('Cache-Control: no-cache'); print file_get_contents("http://127.0.0.1:443/stream.mp3");）读取，并将流回送给客户端，从那里，客户端可以在基本音频标签中播放。

var apiTable = React.createClass({

  getInitialState: function() {
    return {
      data: []
    };
  },

  componentDidMount: function() {
    $.ajax({
      url: 'report/api?id=' + this.props.id,
      dataType: 'json',
      method: 'GET' ,
      success: function(res) {
        this.setState({data: res.data});
      }.bind(this),
      error: function(xhr, status, err) {
        React.unmountComponentAtNode(document.getElementById('alert'));
        React.renderComponent(<span className="alert alert-danger">Error</span>, document.getElementById('alert')); 
        console.error('Search error', err.toString());
      },
      complete: function(data) {
        React.unmountComponentAtNode(document.getElementById('alert'));
      }
    });
  },

  render: function() {
    var apis = this.state.data.api || [];
    var ctsTests = this.state.data.cts || [];

    var apiRows = apis.map(function(apiName) {
      return (<tr><td className="col-md-2">{apiName.api}</td><td className="col-md-2">{apiName.pathWeight}</td></tr>);
    });
    var ctsRows = ctsTests.map(function(test) {
      return (<tr><td>{test.cts}</td><td>{test.pathWeight}</td></tr>);
    });

    return (
      <div>
        <div className="table-container">
          <table className="table table-bordered table-hover">
            <thead>
                <tr>
                    <th className="col-md-2">CTS test cases</th>
                    <th className="col-md-2">Path Weight</th>
                </tr>
                {
                  ctsTests.length === 0 ?
                    <tr><td className="info-row">No CTS test cases found</td><td>No Path Weight</td></tr>
                  : ctsRows
                }
            </thead>
          </table>
        </div>
        <br/><br/>
        <div className="table-container">
          <table className="table table-bordered table-hover">
            <thead>
                <tr>
                    <th>Public APIs affected</th><th>Path Weight</th>
                </tr>
                {
                  apis.length === 0 ?
                    <tr><td className="info-row">No affected APIs found</td><td>No Path Weight</td></tr>
                  : apiRows
                }
            </thead>
          </table> 
        </div>       
      </div>
    );
  }

});

使用这段代码，它只会占用ram并且不会给客户端返回任何有用的内容，我会想到等待直到兆字节缓冲区已满，然后将其回显给客户端。但是idk，所以是的。

请注意，我没有经验丰富的PHP。谢谢！

Answer 1

file_get_contents尝试直到最后读取流，并且由于您尝试从广播服务器读取数据，因此无法结束。

如果HTML5是一个选项，则以下内容可能有效。

<audio autoplay>
  <source src="http://127.0.0.1:443/stream.mp3" type="audio/mpeg">      
</audio>

替代解决方案：

<?php
ob_start();
header("Content-Transfer-Encoding: binary"); 
header("Content-Type: audio/mpeg, audio/x-mpeg, audio/x-mpeg-3, audio/mpeg3");
header('Content-Disposition: attachment; filename="stream.mp3"');
header('X-Pad: avoid browser bug');
header('Cache-Control: no-cache');
$handle = fopen("http://127.0.0.1:443/stream.mp3");

while (($data = fread($handle, $bufferSize)) { //Buffer size needs to be large enough to not break audio up while getting the next part
      echo $data;
      ob_flush();
      flush();
      set_time_limit(30); // Reset the script execution time to prevent timeouts since this page will probably never terminate. 
}

读取mp3流并在php中回显客户端

1 个答案: