Wordpress AJAX nonce将无法验证

Question

I'm trying to trigger a PHP function via AJAX after a button is clicked on my wordpress site, securing the process using a wordpress nonce.

Everything is working fine except the nonce which won't verify for some reason, so my -1 is returned. What have I missed?

My code in functions.php

add_action( 'wp_enqueue_scripts', 'button_click_ajax_scripts' );
function button_click_ajax_scripts() {
   if ( ! is_admin() ) {
       wp_enqueue_script( 'button_click_ajax', get_stylesheet_directory_uri() . '/js/button_click_ajax.js', array ( 'jquery' ), false, true );
       $params = array(
           'nonce' => wp_create_nonce( 'button_nonce' ),
           'ajaxURL' => admin_url( 'admin-ajax.php' ),
       ); 
       wp_localize_script( 'button_click_ajax', 'params', $params ); 
   }
}
add_action( 'wp_ajax_button_click_ajax_callback', 'button_click_ajax_callback' ); // only works if user logged in
function button_click_ajax_callback() {
    check_ajax_referer( 'button_nonce', 'security' );
    echo "success";
    die;
}

My code in button_click_ajax.js

jQuery(document).ready(function($) {
    $("#button").click(function() {
        console.log('Button clicked.');
        $.get(
            params.ajaxURL, {
                'action': 'button_click_ajax_callback',
                'security:': params.nonce,
            },
            function(response) {
                // Do stuff here
                $('#button').replaceWith(response);
            }
        );
    });
});

Answer 1

A small typo, use 'security': params.nonce instead of 'security:': params.nonce