Nonce being receieved by endpoint but failing check

  • shaun21uk

    (@shaun21uk)


    6 years, 8 months ago

    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(<code>http://...../wp-json/api/v1/custom?code=${userInput}&token=${token}</code>).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?

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter shaun21uk

    (@shaun21uk)

    6 years, 8 months ago

    I mean, am I going about this in all the wrong way?

    All I am trying to do is take the code entered in the form and securely check that code against a code stored in the database.

    All without moving off the page. Currently as you can see, I am using a custom api endpoint to achieve this.

    Moderator bcworkz

    (@bcworkz)

    6 years, 8 months ago

    What are you using for authentication? Except for cookie authentication, the authentication process should be adequate security AFAIK. I’d double check with the authentication plugin devs if there is any doubt.

    For cookie authentication, the API is expecting a particular nonce that the API validates, you don’t need to do so yourself. Create the nonce with “wp_rest” seed and pass as “_wpnonce” data tag or send in the “X-WP-Nonce” header. https://developer.wordpress.org/rest-api/using-the-rest-api/authentication/

    But then if your endpoint is only for GET requests, then nothing should be altered in the DB and only public information returned, so why is there a need for a nonce?

    Slightly off topic: How is it you are using v1 API and not v2? I’m surprised it even works.

    Thread Starter shaun21uk

    (@shaun21uk)

    6 years, 8 months ago

    Hi bcworks,

    I will try and answer as best I can.

    1. The input form is only visible for a logged in user. When they submit the form to the custom.js file, it grabs their input and sends it on to the api for validation.

    In the api endpoint/validation – I pull a code from the database and check it against the $params[userInput].

    If the code matches then the endpoint sends (within the return data) a success message. Otherwise it sends a failure.

    The reason I wanted to add a nonce (or some form of security) is I was concerned about the database code being intercepted.

    Is it ok as it is or would you wrap more security around this process?

    2. v1 vs v2 – this is my first time creating an api, it worked so I didn’t “fix it”. Do I need to change this?

    Moderator bcworkz

    (@bcworkz)

    6 years, 8 months ago

    If you are not changing the DB content due to this API request, it does not require much security unless the data returned is sensitive. The API does check for auth cookies and nonces when you make POST or PUT requests, but not GET requests. If you want added security with GET, either do it yourself or send a POST request even if your endpoint doesn’t actually change anything.

    Apparently the problem with validating a nonce is in the use of fetch(). It does not send cookies, so there is no user context and WP nonces require a user context. I think you can get fetch() to send cookies somehow, but it does not do so by default. I normally use jQuery.ajax() for API requests, which does send cookies without any effort on my part.

    Are you using the WP API plugin? I think that is the only way v1 would work. The API is now built into WP core as v2. Unless you have an app that requires v1, I suggest removing the plugin and using v2.

    Thread Starter shaun21uk

    (@shaun21uk)

    6 years, 8 months ago

    Thanks bcworkz,

    I think an ajax solution is worth researching as it sounds like it will do the job with the added security I am looking for.

    Good explanation though, appreciated 🙂

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Nonce being receieved by endpoint but failing check’ is closed to new replies.

Tags