Nonce check is failing - wordpress

Question

EDITED WITH UPDATED CODE: STILL NO SOLUTION
Can anyone spot the error in this code please?
custom-page.php:
<form name="customForm">
<?php wp_nonce_field('code_check', 'codecheck'); ?>
Validation Code:<br>
<input type="password" name="inputcode" id="inputcode" maxlength="6" inputmode="numeric">
<input type="text" name="message" id="message" style="display:none; background-color: #FFCCCC;"><br>
<input type="button" name="submitbutton" value="Submit" onClick="customfunction()">
</form>
custom.js:
function customfunction() {
const userInput = document.addStamp.inputcode.value;
const token = document.addStamp.codecheck.value;
fetch(`http://...../wp-json/api/v1/custom?code=${userInput}&token=${token}`).then(r => r.json()).then(data => {
......
API file.php:
public function custom($request)
{
$params = $request->get_params();
$retrieved_nonce = $params[token];
if($retrieved_nonce) {
if (!wp_verify_nonce($retrieved_nonce, 'code_check' ) ) die( 'Failed security check' );
}
....
Everything works fine until I added in the nonce verify code to the api request.
Now when I click on "submit" button, it does not submit and I get in console:
Uncaught (in promise) SyntaxError: Unexpected token F in JSON at position 0
So it is failing as "F" is point 0 of the failure message.
However, if I output "$retrieved_nonce" I actually get the nonce value as shown in my page source code, so it looks like it is getting to the endpoint?
I have tried logging out and back in but no change.
Do I have this code set up wrong?

Answer 1

You can try.
Form.
<form name="customForm" method="post">
<?php wp_nonce_field('code_check', 'code_check'); ?>
Validation Code:<br>
<input type="password" name="inputcode" id="inputcode" maxlength="6" inputmode="numeric">
<input type="text" name="message" id="message" style="display:none; background-color: #FFCCCC;"><br>
<input type="button" name="submitbutton" value="Submit" onClick="customfunction()">
</form>
In customfunction function also send the wp_nonce_field filed value like.
function customfunction() {
const userInput = document.customForm.inputcode.value;
const code_check = document.customForm.code_check.value;
fetch('http://...../wp-json/api/v1/custom?code='+userInput+'&code_check'+code_check).then(r => r.json()).then(data => {
Now in validate the wp_nonce_field field value
public function custom($request)
{
$retrieved_nonce = $request['code_check'];
if (!wp_verify_nonce($retrieved_nonce, 'code_check' ) ) die( 'Failed
security check' );
/***
you can also try
if ( isset( $request['code_check'] ) || wp_verify_nonce( $request['code_check'], 'code_check' ) )
*******/
}