Как я могу использовать YouTube API и jQuery для загрузки видео на YouTube? - PullRequest
4 голосов
/ 22 ноября 2010

Я пытаюсь использовать Youtube DataAPI для загрузки видео в аккаунт YouTube нашего сайта. Я использовал примеры, представленные в документации для загрузки на основе браузера , и я могу заставить базовый пример работать. Проблема в том, что я не могу перевести это в метод, который я могу использовать с jQuery.

В своем коде я уже установил значения метаданных для видео и получил значение токена для загрузки из API данных. Однако, когда я пытаюсь выполнить jQuery для загрузки, но uploads.gdata.youtube.com выдает мне следующее (любезно предоставлено Fiddler):

HTTP/1.1 404 Not Found
Server: Upload Server Built on Nov 11 2010 15:36:58 (1289518618)
Date: Mon, 22 Nov 2010 01:44:58 GMT
Pragma: no-cache
Expires: Fri, 01 Jan 1990 00:00:00 GMT
Cache-Control: no-cache, no-store, must-revalidate
Content-Length: 0
Content-Type: text/html

Вот форма. Действие в настоящее время установлено на «#», потому что я запускаю вызовы JQuery, используя $("form").submit, но я не уверен, каким должно быть правильное действие, так как я хочу сделать все через AJAX:

<form action="#" method="post" name="video_upload" enctype="multipart/form-data">           

<div class="field-group">
    <label style="margin-top:0px" for="video_name">video title</label>
    <input type="text" value="" class="required" tabindex="1" name="video_name" id="video_name">
    <div id="video_name_status"></div>
</div>
<div class="field-group">
    <label for="video_description">description</label>                       
    <textarea class="required" tabindex="2" name="video_description" rows="5" cols="40" id="video_description"></textarea>
    <div id="video_description_status"></div>

</div>                  
<div class="field-group">
    <label for="video_path">video file</label>
    <input  type="file" value="" class="required" tabindex="3" name="video_path" id="video_path">
    <div id="video_status"></div>
</div>

<div id="form-button-group">
    <input type="submit" value="Upload Video" name="submit" id="signup-button">                     
</div>


<div class="youtube-disclaimer">
By clicking 'Upload Video' you certify that you own all rights to the content or that you are authorized by the owner to 
make the content publicly available on YouTube, and that it otherwise complies with the YouTube Terms of Service located 
at <a href="http://www.youtube.com/t/terms">http://www.youtube.com/t/terms</a>.
</div>
</form>

Вот jQuery, который я использую для выполнения вызова (данные - это JSON, возвращенный предыдущим вызовом jQuery с моего сервера, который содержит URL-адрес публикации на YouTube, токен и значение, указывающее успех):

if (data.success == true){

                 $.ajax({
                       async : false,
                       type: "POST",
                       url: data.postUrl + "?nexturl=www.mysite.local",                        
                       data: ({file : $('#video_path'),
                               token : data.tokenValue,
                               alt : 'json-in-script'}),
                       contentType : 'multipart/form-data',
                       processData: false,
                       datatype: 'jsonp',
                       jsonpCallback: 'processVideoResponse',
                       success: function(data){
                            alert("success alert" + data);

                       },
                       error: function(data){
                           alert("error" + data);
                       }
                   });

Наконец, загрузка видео - это половина проблемы; как только YouTube принимает / отклоняет видео, он должен перенаправить браузер на параметр nexturl и добавить параметры, чтобы указать статус. Как мне справиться с этим, если я отправлю это через jQuery?

1 Ответ

2 голосов
/ 22 ноября 2011

Возможно, я ошибаюсь, но загрузка файла через AJAX невозможна (из соображений безопасности); но, может быть, API YouTube что-то даёт, а я не знаю ?! Временное решение:

  • создайте iframe (именно здесь вы начнете загрузку); ID = 'upload_iframe'
  • создать файл загрузки, который будет выполнять загрузку (php, asp.net, что угодно ...); upload.php
  • создайте форму (id = 'my_form'), установите multipart / form-data, установите target = 'upload_iframe' и установите action = 'upload.php'

в файле php вы также можете активировать статус загрузки, например, загрузка не удалась (alert ("")), перенаправление после успеха (top.location.href = 'sucess.php') или что-то в этом роде.

надеюсь, это поможет

Точная настройка: Кроме того, вы можете изменить кнопку загрузки поля, добавив прослушиватель, чтобы проверить, имеет ли поле значение. если да, вы можете запустить загрузку, запустив $ ('# my_form'). submit (); (требуется jquery)

Вы можете прочитать это: http://code.google.com/apis/youtube/2.0/developers_guide_protocol_browser_based_uploading.html#Browser_based_uploading

...