How to write API call using axios in Vue.js app?

I have Vue.js app on frontend and C# on backend. I need to write API call from frontend using axios. The code looks as following:

BACKEND:

public class FbProductController : ApiController
{
    /// <summary>
    /// Add new connection
    /// </summary>
    /// <param name="values">json string with an object</param>
    /// <returns>New connection object</returns>
    [HttpPost]
    [Route("~/api/async/fbProduct/insertProductReqtype")]
    public IHttpActionResult InsertProductReqtype(string values)
    {
        var newProductReqtype = EntityFactory.Create<IFbProductReqtype>();
        JsonConvert.PopulateObject(values, newProductReqtype);

        string errMessage = ValidateNewProductReqtype(newProductReqtype);
        if (errMessage != null)
            return BadRequest(errMessage);

        newProductReqtype.Save();

        return Ok(newProductReqtype);
    }

FRONTEND:

async onOk(obj) {
    if (!obj.ID) {
        const newProductReqtype = {
            Fb_productId: `${productId}`,
            Fb_reqTypeId: '${reqtypeId}',
            Type_name: `${typeName}`
        };
        const result = await this.$gpbApi.catalogProducts.insertProductReqtype(JSON.stringify(newProductReqtype));
}

import axios from 'axios';

export async function insertProductReqtype(newProductReqtype) {
    if (newProductReqtype == null) return;

    const { data } = await axios.post('api/async/fbProduct/insertProductReqtype', newProductReqtype );

    return data;
}

But, I've got an error:

Message: "The HTTP resource matching the request URI could not be found \"http://localhost/SlxClient/api/async/fbProduct/insertProductReqtype\"."
MessageDetail: "The action corresponding to the request could not be found on the controller \"FbProduct\"."