AJAX 发送文件到服务器

Question

如何在不刷新页面的情况下将文件从本地存储发送到服务器？我的网页：

算法如下：

1. 输入姓名；
2. 录制音频（最长 20 秒）。录制的音频为 .wav 并作为 [文件对象] 存储在本地存储中；
3. 单击按钮将名称和音频发送到服务器。

按钮代码（样式代码省略）：

<button type="button" onclick="add_spkr()">Add me!</button>

add_spkr()

函数代码：

function add_spkr() {
    var spkr_name = document.getElementById('spkr').value; // name
    var file = localStorage.getItem("my_af.wav"); // audio
    $.ajax({
        type: "POST",
        url: 'foo.php',
        data: {name: spkr_name, af: file},
        success: function(response) {
            // code for adding row to the table
        }
    });
}

问题：

1. 由于 Javascript 安全原因，Ajax 不允许发送文件；
2. 我不能在表单中使用

   <input type="file" />

   （以及随后的动作和方法表单属性），因为我无法将本地存储中的音频文件“my_af.wav”设置为值，并且我正在从麦克风录制音频而不是从计算机上传；
3. 必须在不刷新页面的情况下发送数据（这就是我使用 AJAX 的原因）。

问题：如何在不刷新页面的情况下将文件从本地存储发送到服务器？