通过ajax发送多个数据

时间:2015-11-30 10:24:13

标签: javascript php jquery ajax

我的问题是就stackoverflow的多个小问题而烦人的组合,就我能找到的而言,但是我无法理解它。

我正在尝试通过ajax发送音频文件,工作正常,但我还想包括上传/录制的位置。这就是我通过多个类似问题阅读的内容:

(它不起作用)

function getLocation() {
    navigator.geolocation.getCurrentPosition(foundLocation, noLocation);
    function foundLocation(position) {
        var longitude = position.coords.longitude;
        var latitude = position.coords.latitude;
        //alert("LAT : "+latitude +", LONG : "+longitude);
        return [longitude, latitude];
    }
}

function noLocation() {
    //alert('Could not find location');
}

function uploadAudio(mp3Data){
    var pos = getLocation();
    var longitude = pos[0];
    var latitude = pos[1];
    var reader = new FileReader();
    reader.onload = function(event){
        var fd = new FormData();
        var mp3Name = encodeURIComponent('audio_recording_' + new Date().getTime() + '.mp3');
        console.log("mp3name = " + mp3Name);
        fd.append('fname', mp3Name);
        fd.append('data', event.target.result);
        fd.append('longitude', longitude);
        fd.append('latitude', latitude);
        $.ajax({
            type: 'POST',
            url: 'upload.php',
            data: fd,
            processData: false,
            contentType: false
        }).done(function(data) {
            //console.log(data);
            log.innerHTML += "\n" + data;
        });
    };
    reader.readAsDataURL(mp3Data);
}

我必须处理数据的php脚本如下:

<?php

if(!is_dir("recordings")){
    $res = mkdir("recordings",0777); 
}

// pull the raw binary data from the POST array
$data = substr($_POST['data'], strpos($_POST['data'], ",") + 1);
// decode it
$decodedData = base64_decode($data);
// print out the raw data, 
//echo ($decodedData);
$filename = 'audio_recording_' . date( 'Y-m-d-H-i-s' ) .'.mp3';
// write the data out to the file
$fp = fopen('recordings/'.$filename, 'wb');
fwrite($fp, $decodedData);
fclose($fp);
?>

我希望能够使用类似于$ latitude = $ _POST ['longditude']的内容检索位置;

现在我不知道如何让JS在getLocation()函数中返回多个数据,也不知道如何让ajax正确地发送所有这些数据。任何帮助将不胜感激!

2 个答案:

答案 0 :(得分:0)

当您通过AJAX以原始格式发送文件时,您无法在邮件正文中发送更多数据。所以你应该在GET (query string)发送数据。

客户端:

function uploadAudio(mp3Data){
    var pos = getLocation();
    var longitude = pos[0];
    var latitude = pos[1];
    var reader = new FileReader();
    reader.onload = function(event){
        var fd = new FormData();
        var mp3Name = encodeURIComponent('audio_recording_' + new Date().getTime() + '.mp3');
        console.log("mp3name = " + mp3Name);
        fd.append('fname', mp3Name);
        fd.append('data', event.target.result);

        var ajax_url = 'upload.php?longitude='+longitude+'&latitude='+latitude;

        $.ajax({
            type: 'POST',
            url: ajax_url,
            data: fd,
            processData: false,
            contentType: false
        }).done(function(data) {
            //console.log(data);
            log.innerHTML += "\n" + data;
        });
    };
    reader.readAsDataURL(mp3Data);
}

服务器端:

$longitude = $_GET['longitude'];
$latitude = $_GET['latitude'];

答案 1 :(得分:0)

要获取所有返回的值(如果有的话),您必须遍历响应数据,否则您将只获得一个。

.done(function(data) { 
    var output = '';
    $.each(data,function(index, value) {
       output += value

    });
}