passing variables from php to js within static block created using npx

  • Resolved fauf2522

    (@fauf2522)


    10 months ago

    I have a static block created using npx @wordpress/create-block, with one plugin php file, and among other files: edit.js, save.js and view.js.
    It is a form that does ajax call to admin-ajax.php with specific action, and i would like to secure it a little bit, so i thought that generating and verifying nonce would be a good start.
    If i understand it correctly, this nonce should be generated server side, then somehow passed to client, and then sended back to server within ajax call where it should be verified.
    However I can’t find any reliable way to send variable to edit|save.js or view.js from php file (I can generate it using wp_create_nonce).

    What I found are references to wp_localize_script, or wp_add_inline_script, but those need handle to a script, which can be obtained when registering script through wp_register_script function, but my block is generated using npx, so it doesn’t use that function – they are included through block.json file and there doesn’t seem to be any kind of handle defined.
    Is there some kind of handle generated when included by block.json, or there isn’t one?
    How can I pass variables from php to these files when they are included with block.json?

    Thanks in advance

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator bcworkz

    (@bcworkz)

    My solution could be seen as a bit crude, there may be more elegant solutions I’m unaware of. You could output your nonce value as a JS var declaration within its own inline script block from the “wp_print_scripts” action hook.

    Avoid adding script this way that’s dependent on other resources because it’s difficult to properly resolve the dependencies. It’s fine for declaring a global var value or for similar non-dependent script.

    Thread Starter fauf2522

    (@fauf2522)

    Sorry, but i don’t understand how would I use that function for my specific block.

    according to documentation: wp_print_scripts() – Function | Developer.www.ads-software.com
    the parameter needed for the function is script handle which i don’t know/have, because all of my .js scripts are initialized with block.json file, so it seems i can’t use it for my specific needs. (or can i?)

    should I scrap whole view.js and register a different .js script with php function wp_register_script(), where I would add contents of original view.js, and then use the handle to pass variables to it?
    But this seems as a little bit hack for me. If possible I would like to use existing .js scripts.

    Thanks

    Moderator bcworkz

    (@bcworkz)

    No, I’m sorry, I meant the “wp_print_scripts” action hook, not the function of the same name. No handle required, just add a callback that outputs your nonce declaration within an inline <script> block.

    This too is a bit of a hack. We’re expected to enqueue all of our scripts. But IMO it’s a bit much for a couple lines of JS. It’s possible to enqueue a dynamically generated JS file, so it is feasible to do it the “right” way. But it seems like a lot faffing about for a couple lines of JS. Especially for script that has no dependencies like global var declarations.

    Thread Starter fauf2522

    (@fauf2522)

    Now I understand – yeah, it works this way – i can now read passed variables even in view.js what i needed.

    Yes, it’s kinda hacky approach too, but as I don’t know any better solution, I’ll stick to this now.

    Thank you

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘passing variables from php to js within static block created using npx’ is closed to new replies.