@Simone has steered you in the right direction.
For starters, JSON (JavsScript Object Notation) is simply a way to store data that can then be exchanged/interpreted between different languages.
Now, presuming you already have a plugin that has the right metaboxes, the general process would be…
- Call the JSON endpoint with
wp_remote_get()
- Extract the
body
parameter from the response.
-
json_decode
the body parameter
You now have the JSON endpoint data in a PHP array. What you do next depends on your goal. Are you trying to save the JSON data (values) in your metabox fields? If so, you would simply populate your metabox’s inputs with the data from the PHP array and update the record when its saved.
When you call that metabox data from the database, it will be returned in one or more PHP variables (depending on how you stored the data.) In order to get those values out of PHP and accessible to your JS file, you’ll use the wp_localize_scripts()
function, as @Simone mentioned, to localize the variable(s) to your particular script. Then, in your JS, you can alert or console.log the variable(s) to verify they passed through.
Note that when you localize a script, it must use the same handle that you used to enqueue the script, or it won’t work. For example, let’s say you enqueued 2 scripts:
// Enqueue scripts.
wp_enqueue_script('script-one', '{URL TO JS FILE ONE}');
wp_enqueue_script('script-two', '{URL TO JS FILE TWO}');
// Localize variables to "script-two" (the hook used above to enqueue the script).
wp_localize_script('script-two', 'my_vars', array(
'some_value' => 'hello',
'another_value' => 'goodbye'
));
Note that the above localizes the variable (array) my_vars
to the JavaScript file that is enqueued with the script-two
handle. In other words, these variables will be available in script-two
, but not in script-one
.
Now, to access the variable (in the script-two
JS file,) you can do so like this:
alert(my_vars.some_value);
alert(my_vars.another_value);