Question

我想在运行时使用ajax将视频上传到Bits。

当我通过发布表单上传视频时，就像他们在此处解释的那样：http://www.longtailvideo.com/support/bits-on-the-run/15984/upload-videos-within-your-cms

它工作正常，但是当我尝试使用jQuery帖子时它不起作用。我用于jQuery帖子的代码是：

<?php
        require_once('botr/init_api.php');

       # Do the API call to build an upload URL.
        # The 'token' MUST be the last parameter for upload progress to work.
        $response = $botr_api->call('/videos/create');
        $token = $response['link']['query']['token'];
        if ($response['status'] == 'error') { die(print_r($response)); }
        $url  = 'http://'.$response['link']['address'].$response['link']['path'];


        # Print the page. All identifiers inside the form are used to display the upload progress.
    ?>
<script type="text/javascript">
$(document).ready(function() {

$('#uploadForm').submit(function() {
                var url = $(this).attr('action');
                 alert(url);
                var dataToBeSent = $(this).serialize();
                alert(dataToBeSent);
                $.post(url, dataToBeSent, function(data, textStatus) {
                  //data contains the JSON object
                  //textStatus contains the status: success, error, etc
                  alert("textStatus");
                  alert(textStatus);
                }, "json");

                 return false
            });
        });
</script>
<form id="uploadForm" action="<?=$url?>" method="POST" enctype="multipart/form-data">
            <fieldset>
                    <label>Select video</label><br>
                    <input id="uploadFile" type="file" name="file" />
                    <input id="key" type="hidden" name="key" value="<?=$response['link']['query']['key']?>" />
                    <input id="api_format" type="hidden" name="api_format" value="json" />
                    <input id="uploadToken" type="hidden" name="uploadToken" value="<?=$token?>" />
                    <input id="token" type="hidden" name="token" value="<?=$token?>" />
                    <div id="uploadBar" style="width:480px; float:left; display:none; background:#FFF; margin:5px 0;">
                    <div id="uploadProgress" style="background:#46800d; width:0px; height:18px;"></div></div>

                    <p class="hint">
                        You can upload any video format (WMV, AVI, MP4, MOV, FLV, ...)
                    </p>
                    <button type="submit" id="uploadButton">Upload</button>
            </fieldset>
    </form>

当我提交表单时，网址的提醒会显示http://upload.bitsontherun.com/v1/videos/upload 和dataToBeSent的警报显示键= XXX＆安培; api_format = JSON＆安培; uploadToken = YYY＆安培;标记= YYY

但没有任何反应。

任何想法为什么？

------------------------------ update ---------------- ------------- 我已经尝试使用隐藏的iframe并将目标添加到表单但它不起作用，表单正在提交并且整个页面正在刷新...任何想法？

<form id="uploadForm" terget="botr_ifram" action="<?=$url?>" method="POST" enctype="multipart/form-data" >
            <fieldset>
                    <label>Select video</label><br>
                    <input id="uploadFile" type="file" name="file" />
                    <input id="uploadToken" type="hidden" name="uploadToken" value="<?=$token?>" />
                    <div id="uploadBar" style="width:480px; float:left; display:none; background:#FFF; margin:5px 0;">
                    <div id="uploadProgress" style="background:#46800d; width:0px; height:18px;"></div></div>

                    <p class="hint">
                        You can upload any video format (WMV, AVI, MP4, MOV, FLV, ...)
                    </p>
                    <button type="submit" id="uploadButton">Upload</button>
            </fieldset>
    </form>
    <iframe width="0" id=”botr_ifram” name="botr_ifram" height="0" border="0" frameborder="0" scrolling="auto" align="center" hspace="0" vspace=""></iframe>

Answer 1

我认为你的问题可能是它无法通过直接的ajax调用。这是你在API的世界里会看到更多的东西，使用last.fm它也不可能直接调用。

这就是为什么你可以试着打电话给你自己的php文件，它会联系你现在想要联系的网址。利用curl来呼叫该服务。

所以我所做的就是调用我的php文件中的所有参数，以及api调用（如upload，remove，...）。在服务器上，我将使用curl创建调用来执行此操作。当您的数据返回时，您将其打印在页面上，您可以在您的应用程序中使用它。

Answer 2

您无法通过类似的Ajax发送文件输入字段。您只能通过实际发布表单元素（通过浏览器的表单提交内容，而不是通过ajax）将文件发送到服务器。

好吧，提交表单不是唯一的方式。还有其他几个，每个都有它的问题：

如果您的用户使用支持新File API的浏览器，您可以使用客户端JavaScript读取该文件并发布该文件通过ajax将数据发送到服务器，但它比以正常方式发送表单要多得多，而且对File API的支持仍然非常粗略。）
您可以使用基于Flash的上传器小部件。

...但是一个简单的简单表单提交是经过验证的，并不要求用户安装任何特殊内容。您可以将target元素的form隐藏iframe，这样您的网页就不会被表单提交拆除，如果这是您要避免的内容。然后，您可以观察结果的iframe，以通知用户。

Answer 3

来自文件选择元素的数据未被序列化。

- http://api.jquery.com/serialize/

如果您想在不离开页面的情况下上传文件，那么您需要使用隐藏的iframe或类似Flash小程序的内容，您不能使用XMLHttpRequest。

Answer 4

你必须使用iframe或类似的东西来做你想做的事......看看http://valums.com/ajax-upload/我认为这就是你想要的。

使用ajax提交表单

4 个答案: