Why is my wordpress localized var not avaliable in my front end js

Question

My goal is to localize a wordpress nonces to use for authorizations of a post request to the wp REST API from the adminpanel.

Problem is, that I can't get access to the nonces from javascript.

I have added wp_localize_script to the action that enqueue my javasript file:

function my_admin_scripts() {
  wp_enqueue_script( 'admin-js', get_stylesheet_directory_uri().'/js/script.js', false );

    $data = array(
        'nonce' => wp_create_nonce('wp_rest')
    );
    wp_localize_script( 'script', 'wp_api_var', $data );

}
add_action( 'admin_enqueue_scripts', 'my_admin_scripts' );

Then I would expect, that I could call this in my script.js file:

console.log (wp_api_var.nonces);

But I can't:

Uncaught ReferenceError: wp_api_var is not defined
<anonymous> https://lisbjergbeboerforening.dk/wp-content/themes/twentyseventeen-child/js/script.js?ver=5.5.1:4

I understand from the error that my variable wp_api_var is not avaliable, but why?

BR Kresten

Answer 1

Your Localize script should be:

/*
* wp_localize_script( string $handle, string $object_name, array $l10n )
*
/*

wp_localize_script( 'admin-js', 'wp_api_var', $data );

Your script handle is 'admin-js'