How is the Wami Recorder actually implemented?

2019-02-06 16:04发布

站内问答 / JavaScript
1208 1 4

I'm very new to the Wami Recorder, and I've never worked with Flash at all, so this may actually be a dumb question.

Basically, how does one go about implementing the Wami Recorder? I've seen it on the website, and it works great on there, but when I download it and try to use it within localhost as part of Xampp, it doesn't work.

If someone could kinda write up a Wami Recorder for Dummies answer, that'd be totally awesome.

I'm using this in CakePHP 2.0 if anyone knows especially how to use it within that framework.

Basically all I'm trying to do is record audio, save the file to a directory, and have POST information to be able to save certain details about the file to a database.

1条回答
对你真心纯属浪费
2楼-- · 2019-02-06 16:43

Yeah, the documentation is not very clear. I spent all afternoon yesterday figuring it out. Here's a simple implementation that works on my local machine. The following files are stored under my Apache document root in "/temp/wami/test", so the URL is "http://localhost/temp/wami/test/":

index.html
recorder.js
save_file.php
Wami.swf

index.html

    <!-- index.html -->
    <html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script></script>
        <script src="recorder.js"></script>
    </head>

    <body>
        <div id="recorder">
            <button id="record">Record</button>
            <button id="play">Play</button>
        </div>
        <div id="flash"></div>
    </body>

    <script>
        // initialize Wami
        Wami.setup({
            id: 'flash' // where to put the flash object
        });

        // initialize some global vars
        var recording = '';
        var recordingUrl = '';
        var playBackUrl = '';

        // get button elements
        var record = $('#record');
        var play = $('#play');

        // define functions
        function startRecording() {
            recording = 'temp.wav';
            recordingUrl = 'http://localhost/temp/wami/test/save_file.php?filename=' + recording;
            Wami.startRecording(recordingUrl);
            // update button attributes
            record
                .html('Stop')
                .unbind()
                .click(function() {
                    stopRecording();
                });
        }

        function stopRecording() {
            Wami.stopRecording();
            // get the recording for playback
            playBackUrl = 'http://localhost/temp/wami/test/' + recording;
            // update button attributes
            record
                .html('Record')
                .unbind()
                .click(function() {
                    startRecording();
                });
        }

        function startPlaying() {
            Wami.startPlaying(playBackUrl);
            // update button attributes
            play
                .html('Stop')
                .unbind()
                .click(function() {
                    stopPlaying();
                });
        }

        function stopPlaying() {
            Wami.stopPlaying();
            // update button attributes
            play
                .html('Play')
                .unbind()
                .click(function() {
                    startPlaying();
                });
        }

        // add initial click functions
        record.click(function() {
            startRecording();
        });

        play.click(function() {
            startPlaying();
        });
    </script>

    </html>

save_file.php

    <?php
    /* save_file.php */

    // get the filename
    parse_str($_SERVER['QUERY_STRING'], $params);
    $file = isset($params['filename']) ? $params['filename'] : 'temp.wav';
    // save the recorded audio to that file
    $content = file_get_contents('php://input');
    $fh = fopen($file, 'w') or die("can't open file");
    fwrite($fh, $content);
    fclose($fh);

That should do it. Unfortunately, there doesn't appear to be a way to pause and then resume recording. Each time you start recording it overwrites the previous audio. There also doesn't appear to be a way to retrieve information about the audio file (e.g. length, size). See the Wami recorder file (recorder.js) for a full list of recorder functions.

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)