Ajax non funziona correttamente in Firefox ma funziona in Chrome

Question

Ajax non funziona correttamente in Firefox ma funziona in Chrome

14 lug 2015, 02:19:00

Visualizzazioni: 18.2K

Voti: 1

Sto lavorando a un plugin che sembra funzionare bene in Chrome, ma non riesce a eseguire lo script PHP via Ajax in Firefox. Mi sta facendo impazzire. Ecco i blocchi di codice relativi al problema.

Innanzitutto, l'enqueue dello JavaScript:

wp_enqueue_script ( 'jquery' );

$script_url = plugins_url ( '/js/seamless-donations.js', __FILE__ );

wp_register_script ( 'seamless_javascript_code', $script_url, array( 'jquery' ), false );
wp_enqueue_script ( 'seamless_javascript_code' );

// dichiara l'URL del file che gestisce la richiesta AJAX (wp-admin/admin-ajax.php)
wp_localize_script (
    'seamless_javascript_code', 'dgxDonateAjax',
    array(
        'ajaxurl'            => admin_url ( 'admin-ajax.php' ),
        'nonce'              => wp_create_nonce ( 'dgx-donate-nonce' ),
        'postalCodeRequired' => dgx_donate_get_countries_requiring_postal_code ()
    )
);

Ora, il JavaScript correlato che effettua la chiamata Ajax:

console.log("-- SeamlessDonationsCheckout: before jQuery.post");
console.log("-- SeamlessDonationsCheckout: ajaxurl=" + dgxDonateAjax.ajaxurl);

jQuery.ajax({
    url: dgxDonateAjax.ajaxurl,
    data: data,
    success: function() {
        console.log("-- SeamlessDonationsCheckout: jQuery.ajax success");
        //response(data);
    }
});

//jQuery.post(dgxDonateAjax.ajaxurl, data, SeamlessDonationsAjaxCallback);
console.log("-- SeamlessDonationsCheckout: after jQuery.post");

L'array data contiene:

var data = {
    action: 'dgx_donate_paypalstd_ajax_checkout',
    referringUrl: referringUrl,
    nonce: nonce,
    sessionID: sessionID,
    donationAmount: donationAmount,
    (e così via, è un array grande)
};

Gli hook:

add_action ( 'wp_ajax_dgx_donate_paypalstd_ajax_checkout', 'dgx_donate_paypalstd_ajax_checkout' );
add_action ( 'wp_ajax_nopriv_dgx_donate_paypalstd_ajax_checkout', 'dgx_donate_paypalstd_ajax_checkout' );

E, infine, l'inizio della funzione PHP Ajax:

function dgx_donate_paypalstd_ajax_checkout () {

// Log
dgx_donate_debug_log ( '----------------------------------------' );
dgx_donate_debug_log ( 'DONATION TRANSACTION STARTED' );
$php_version = phpversion ();
dgx_donate_debug_log ( "PHP Version: $php_version" );
dgx_donate_debug_log ( "Seamless Donations Version: " . dgx_donate_get_version () );

In Chrome, il file di log mostra chiaramente che la funzione è stata chiamata, ma in Firefox non c'è nulla. Inoltre, in Chrome, il log del browser mostra le voci prima e dopo le chiamate jQuery.ajax, così come la voce "success", ma Firefox no.

Posso confermare che la variabile per l'URL Ajax viene passata, perché questo messaggio

"-- SeamlessDonationsCheckout: ajaxurl=http://podtrack.com/wp-admin/admin-ajax.php"

appare nella console del browser Firefox. Quindi non è che l'URL Ajax non venga passato.

Apprezzerei molto qualsiasi indicazione. Questo problema mi ha davvero bloccato.

Grazie!

--David

David Gewirtz

11

jquery ajax javascript

Commenti

in Firefox è Console.log non console.log, sono entrambe API specifiche del browser

Tom J Nowell

14 lug 2015 02:26:49

Grazie, Tom. Purtroppo, anche usando Console.log, non sta mostrando il messaggio di successo.

David Gewirtz

14 lug 2015 02:32:10

Penso che la tua variabile data nonce dovrebbe essere nonce: dgxDonateAjax.nonce,; non nonce: nonce,.

josh

14 lug 2015 06:31:51

Ok. Prima di tutto puoi verificare, c'è una chiamata ajax nella console di Firefox?

WPTC-Troop

16 dic 2015 13:59:02

Tutte le risposte alla domanda

Commenti

Puoi fornire un esempio?

Howdy_McGee

14 lug 2015 19:39:00

Penso che response debba essere anche negli argomenti della funzione?? success: function(response) {

josh

16 lug 2015 08:13:33

Idealmente sì, ma ai fini del debug qui non è necessario. Il suo codice sta solo usando console.log per confermare il successo dell'ajax e sarebbe inutile passare response solo per ignorarlo.

voldemortensen

21 lug 2015 02:07:05

jgraup 9.84K · Answer 1 · 2015-12-16T16:45:36Z

Questo è lo scheletro di base per una chiamata e risposta AJAX. Controlla e assicurati che funzioni su Chrome e Firefox per te — per me funziona.

<?php

// Funzione per i dati che passeremo

function dgx_donate_get_countries_requiring_postal_code()
{
    return "cc postal code stuff...";
}

// Registra tutto

add_action('init', function () {

    // Aggiungi gli script necessari

    wp_enqueue_script('jquery');
    $script_url = plugins_url('/js/seamless-donations.js', __FILE__);

    wp_register_script('seamless_javascript_code', $script_url, array('jquery'), false);
    wp_enqueue_script('seamless_javascript_code');

    // Localizza i nostri dati 

    wp_localize_script(
        'seamless_javascript_code', 'dgxDonateAjax',
        array(
            'ajaxurl' => admin_url('admin-ajax.php'),
            'nonce' => wp_create_nonce('dgx-donate-nonce'),
            'postalCodeRequired' => dgx_donate_get_countries_requiring_postal_code()
        )
    );

    // Registra i gestori AJAX

    add_action('wp_ajax_dgx_donate_paypalstd_ajax_checkout', 'dgx_donate_paypalstd_ajax_checkout');
    add_action('wp_ajax_nopriv_dgx_donate_paypalstd_ajax_checkout', 'dgx_donate_paypalstd_ajax_checkout');

    // Gestore AJAX (PRIV / NO PRIV)

    function dgx_donate_paypalstd_ajax_checkout()
    {
        // Se falliamo, non essere silenzioso 

        $fail_message = '';

        if (empty($_POST['nonce']) || !wp_verify_nonce($_POST['nonce'], 'dgx-donate-nonce')) $fail_message = 'Nonce non valido';
        if (empty ($_POST['action'])) $fail_message = 'Azione mancante';
        if ($_POST['action'] !== 'dgx_donate_paypalstd_ajax_checkout') $fail_message = 'Azione non valida';

        // Abbiamo fallito, facciamoglielo sapere...

        if (!empty ($fail_message)) {
            wp_send_json_error(array(
                'message' => $fail_message
            )); // die
        }

        // Esegui la logica

        // Invia la risposta di successo

        wp_send_json_success(array(
            'action' => $_POST['action'],
            'message' => 'Checkout completato',
            'postalCodeRequired' => $_POST['postalCodeRequired'],
            'ID' => 1
        )); // die
    }
});

// Scorciatoia per attivare la chiamata AJAX al caricamento della pagina

add_action('wp_footer', function () { ?>

    <script>

        (function ($) {

            var data = {
                action: 'dgx_donate_paypalstd_ajax_checkout',
                nonce: dgxDonateAjax.nonce,
                postalCodeRequired: dgxDonateAjax.postalCodeRequired,
            };

            $.ajax({
                type: 'POST',
                url: dgxDonateAjax.ajaxurl,
                data: data,
                success: function (response) {

                    // osserva la risposta 

                    if (response.success) {

                        // dati di successo
                        console.log(response.data);

                    } else {

                        // non va bene
                        console.log(response);
                    }
                }
            });

        })(jQuery);
    </script>
<?php });

voldemortensen 1 · Answer 2 · 2015-07-14T19:10:56Z

È necessario type: 'POST' nella tua chiamata jQuery.ajax. L'impostazione predefinita è GET, mentre questa richiede POST.

Poiché qualcuno ha richiesto un esempio:

jQuery.ajax({
    url: dgxDonateAjax.ajaxurl,
    data: data,
    type: 'POST',
    success: function() {
        console.log("-- SeamlessDonationsCheckout: jQuery.ajax success");
        //response(data);
    }
});

voldemortensen

1

14 lug 2015 19:10:56