ajaxComplete / ajaxStop / ajaxSuccess не запускается

ProgramBox

ajaxComplete / ajaxStop / ajaxSuccess не запускается

Post author:admin
Запись опубликована:23 августа, 2022
Post category:Вопросы по программированию

#ajax #facebook #jquery #facebook-graph-api

#ajax #Facebook #jquery #facebook-graph-api

Вопрос:

Я ценю любую помощь. Я новичок с небольшим опытом работы с jQuery / AJAX, и я схожу с ума, пытаясь понять, почему я не могу понять это.

Я пишу приложение для страницы Facebook, у которого есть права доступа пользователя и загрузка видео на страницу. Все это работает отлично и отлично. Это не столько проблема, связанная с API Facebook, сколько проблема ajax (по крайней мере, я думаю).

По сути, я пытаюсь КАКИМ-ТО ОБРАЗОМ получить контроль над страницей после того, как пользователь загрузит видео. Я использую [плагин формы malsup jQuery] [1] для загрузки результирующей страницы (которая представляет собой страницу на Facebook, отображающую возвращаемые значения JSON) в скрытом iframe.

Я могу запустить ajaxStart, и я протестировал это, изменив цвет фона или напечатав предупреждающее сообщение, когда я нажимаю «Загрузить». Однако, когда загрузка завершается (и она завершается успешно), БОЛЬШЕ НИЧЕГО НЕ ПРОИСХОДИТ. Возвращенные значения JSON загружаются в скрытый iframe, и страница находится там. Я пытался запустить ajaxComplete, ajaxStop и ajaxSuccess, но ни один из них не срабатывает по какой-либо причине.

Итак, в целом, вот чего я пытаюсь достичь: — Я хочу перенаправить пользователя или отобразить скрытое содержимое после завершения загрузки файла. Меня даже не волнует, есть ли ошибки. Мне просто нужно, чтобы ЧТО-то произошло. — Я использую плагин jQuery Form, потому что, к сожалению, я недостаточно продвинут, чтобы понять, как использовать это значение и что-то с ним делать, но если кто-нибудь может направить меня в правильном направлении, это было бы оценено.

И, наконец, вот мой код:

 <html>
<head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.js"></script>
<script type="text/javascript" src="http://malsup.github.com/jquery.form.js"></script>

<script type="text/javascript"> 
// prepare the form when the DOM is ready 
$(document).ready(function() { 
    var options = { 
        target:        '#output2',   // target element(s) to be updated with server response
    iframeTarget: '#output2', 
        beforeSubmit:  showRequest,  // pre-submit callback 
        success:       showResponse  // post-submit callback 
    }; 

    // bind form using 'ajaxForm' 
    $('#theform').ajaxForm(options); 
}); 

// pre-submit callback 
function showRequest(formData, jqForm, options) { 
    return true; 
} 

// post-submit callback 
function showResponse(responseText, statusText, xhr, $form)  {
    alert(responseText); 
} 
</script>

<script type="text/javascript">
jQuery().ready(function(){ 
    $('body').ajaxStart(function() {
        $(this).css("background-color","red");
    });
    $('body').ajaxSend(function() {
        $(this).css("background-color","blue");
    });
    $('body').ajaxComplete(function() {
        $(this).css("background-color","green");
    });
    $('body').ajaxStop(function() {
        $(this).css("background-color","purple");
    });
});
</script>


</head>
<body>


<?php

$app_id = "xxxxxxx";
$app_secret = "xxxxx";
$my_url = "xxxxxx";
$video_title = "xxxxxxxxx";
$video_desc = "xxxxxxxxx";
$page_id = "xxxxxxxx";

$code = $_REQUEST["code"];

if(empty($code)) {
  // Get permission from the user to publish to their page. 
  $dialog_url = "http://www.facebook.com/dialog/oauth?client_id="
    . $app_id . "amp;redirect_uri=" . urlencode($my_url)
    . "amp;display=popupamp;scope=email,publish_stream,manage_pages";

$current_url = (!empty($_SERVER['HTTPS'])) ? "https://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'] : "http://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];

if ($current_url != $dialog_url)
{
  echo('<script>window.location ="' . $dialog_url . '";</script>');
}


} else {

  // Get access token for the user, so we can GET /me/accounts
  $token_url = "https://graph.facebook.com/oauth/access_token?client_id="
      . $app_id . "amp;redirect_uri=" . urlencode($my_url)
      . "amp;client_secret=" . $app_secret
      . "amp;code=" . $code;
  $access_token = file_get_contents($token_url);

  $accounts_url = "https://graph.facebook.com/me/accounts?" . $access_token;
  $response = file_get_contents($accounts_url);

  // Parse the return value and get the array of accounts we have
  // access to. This is returned in the data[] array. 
  $resp_obj = json_decode($response,true);
  $accounts = $resp_obj['data'];

  // Find the access token for the page to which we want to post the video.
  foreach($accounts as $account) {
       if($account['id'] == $page_id) {
         $access_token = $account['access_token'];
         break;
       }
  }

  // Using the page access token from above, create the POST action
  // that our form will use to upload the video.

 $post_url = "https://graph-video.facebook.com/" . $page_id . "/videos?"
    . "title=" . $video_title. "amp;description=" . $video_desc
    . "amp;access_token=". $access_token;

  // Create a simple form  

  echo '<form action=" '.$post_url.' " method="POST" enctype="multipart/form-data" id="theform">';
  echo 'Please choose a file:';
  echo '<input name="file" type="file">';
  echo '<input type="submit" value="Upload" id="button-upload" />';
  echo '</form>';

}
?>

<iframe id="output2" name="output2"></iframe>


</body></html>

Спасибо за вашу помощь!!

Ответ №1:

Это означает, что вы получаете ошибку Ajax. Я не вижу никакого обработчика ошибок в вашем коде. Не могли бы вы попробовать добавить обработчик ошибок следующим образом

 <script>
    $(document).ready(function(){ 
        $(document).ajaxError(function(e, jqxhr, settings, exception) {
            alert(exception);
        })
    })
</script>

Ответ №2:

Я поиграл с загрузкой файлов, и есть сложный зверь из-за всей безопасности, которую имеют браузеры для защиты файловых систем пользователей и еще много чего.

Что касается вашей проблемы, я думаю, что есть большая вероятность, что ваш плагин ajaxForm jQuery неправильно подключается к глобальному состоянию Ajax для Jquery. Даже если бы это произошло, я бы сказал, что подключение к глобальному состоянию Ajax — плохой дизайн. Если вы добавите какие-либо другие ajax-запросы на эту страницу, то ваш ajaxComplete, ajaxStop и т. Д. функции начнут вызываться.

Ваш лучший подход — использовать обратные вызовы, предоставляемые плагином ajaxForm. Давайте сосредоточимся на этой первой части вашего кода.

Работает ли это?

     success:       showResponse  // post-submit callback 

...

// post-submit callback 
function showResponse(responseText, statusText, xhr, $form)  {
    alert(responseText); 
}

Если да, не могли бы вы заменить это:

 $('body').ajaxComplete(function() {
    $(this).css("background-color","green");
});

С этим:

 function showResponse(responseText, statusText, xhr, $form)  {
    $(this).css("background-color","green");
}

Я считаю, что использование success: обратного вызова является предполагаемым использованием плагина ajaxForm.

1. Я собираюсь попробовать и вернуться к вам. Большое вам спасибо!

2. Нет:/ по какой-то причине showResponse также не запускается… посмотрите, как раньше было установлено оповещение? Это тоже не сработало бы. Grrrrrr

3. Это отстой. Не знаю, что предложить вам делать дальше. Однако я бы продолжал читать документацию по плагину ajaxForm.

Ответ №3:

Jquery ajaxSend или ajaxStart выдает какую-то ошибку, и документ не выполняет ajaxComplete. Я довольно долго пытался исправить ошибку и смог найти только обходной путь:

 function hideAjaxIndicator() {
    $('#ajax-indicator').hide();
}
$(document).ready(function () {
    setTimeout(hideAjaxIndicator, 1000);
});

Вы можете добавить это в файл .js.

Метки: ajaxComplete / ajaxStop / ajaxSuccess не запускается