POST request with TOTP password: Response to preflight request doesn't pass access control check

Question

I need to make a POST request with data to a URL, using TOTP (Time-based One-Time Password). I keep getting the following message from server.

========================================================

Access to XMLHttpRequest at URL from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header has a value 'https://topic.name.com' that is not equal to the supplied origin.

========================================================

I am using otplib as library to help me generate TOTP.

Setting for TOTP is 30 seconds interval (default)
T0 is 0 (epoch)
Digit is 10
HMAC-SHA-512 algorithm

Header Requirement (specified by server):

HTTP Basic Authentication, as specified in Chapter 2 of RFC2617
Content-Type: 'application/json'

Below is my code so far.

import { totp } from 'otplib'
import base64 from 'base-64'
import axios from 'axios'

const request = () => {
    const URL = 'https://api.topic.name.com/topic/003'

    const info = {
        "github_url": "https://github.com/myname/topic",
        "contact_email": "[email protected]"
    }

    const secret = 'nameTopic'
    const dataBody = JSON.stringify(info)
    const sharedSecret = info.contact_email+secret 

    totp.options = { digits: 10, algorithm: "sha512", epoch: 0}

    const newTOTP = totp.generate(sharedSecret);
    const isValid = totp.check(newTOTP, sharedSecret);

    console.log(newTOTP, isValid)

    const userPass = info.contact_email + ":" + newTOTP;
    const credential = base64.encode(userPass);

    const config = {
    headers: {
        'Content-Type': 'application/json',
        "Authorization": "Basic " + credential
        }
    };

    axios.post(URL, dataBody, config).then((response) => {
        console.log(response)
    }, (err) => {
        console.log(err)
    })
}

export default request

I really don't understand why there's a CORS issue, could it be that my headers are wrong?

Any help is greatly appreciated, thank you for your time.

The browser won't let you post to a different domain unless the target domain explicitly allows it. You cannot fix it from the client; it's basic Internet security. — Pointy
@Pointy thanks for your comment. So this is a server-side issue which I have no control, correct? I was suspecting that, because, otherwise the server should respond with 'authorization header' not valid, or content-type not valid. At least some information should be responded to me from server, other than the access-origin not allowed. What should I do in this situation, if target-domain doesn't allow me to post? — dulerong
Generally people use their own servers to make proxy requests. The CORS security is purely a web browser feature. — Pointy
@Pointy thanks again for your comment. Currently I really need to make this POST request for specific reason. If at current the server does not allow POST from me, does that mean I should try to contact them directly by email or phone to describe this situation? Again thanks for your time. — dulerong
You can try that, certainly, but I wouldn't hold out much hope. — Pointy

Fahmiin Fahmiin · Accepted Answer · 2020-05-08T02:37:27

You should try running it on node. Place your script in an index.js file, install the dependencies and run node index.js

Did you manage to solve the challenge? I keep getting Access denied: Invalid token, wrong code even following the same code base.

POST request with TOTP password: Response to preflight request doesn't pass access control check

1 Answers