Equal sign in axios data causes axios not to send the correct data object-CodePudding

i am trying to send the following json object to an REST API.

  let json = {
    name: name,
    type: type,
    format: format,
    param: param,
  };

With "param","type","format and "name" all beeing strings. I use "=" as a value if the user enters an empty string. (Something my company decided, thats not the point here)

I construct data for the request like this:

 let data = JSON.stringify(json);

The JSON Object looks the following (when printed out in the console):

{"name":"Test","type":"=","format":"=","param":"="}

The Problem is that firefox console and the receiving site (the REST API) reports to me, that i send {"name":"Test","type":" "\",\"format\":\"" as data which obviously is not what i want to sent.

Since i give axios the correct object and it works correctly if my strings arent equal signs i guess this may be the problem. Is there a way to fix this? Maybe with some encoding? Or with a parameter for axios?

Thanks in advance for your help

I call my axios method in the following way

let request = await this.requestAxios(`${this.$root.restURL}interfaces/${this.interfaceDetailId}?languages=${this.$root.language}`,"PATCH",data);

My axios Method looks the following:

async requestAxios(url, method, data = "", skipPostLog = false) {
    //Prevent a unwanted recursion. Only log when the caller is not log itself

    if (!skipPostLog) {
        await this.log(
            `${method}-Request to endpoint ${url} with data: ${data}`,
            `requestAxios()`,
            "TRACE"
        );
    } else if (
        url !== `${this.$root.restURL}log?language=${this.$root.language}` &&
        skipPostLog
    ) {
        await this.log(`${method}-Request to endpoint ${url}:`, `requestAxios()`, "TRACE");
    }

    let request;
    try {
        request = await axios.request({
            url,
            method,
            data,
            headers: {
                authorization: this.$root.getToken(),
            },
        });
    } catch (e) {
        request = e.response;
    }
    if (request.status === 401) {
        eventBus.$emit("showErrorMessage", request.data.message);
    }
    return request;
},

curl 'http://localhost:3013/v1/interfaces/1?languages=de' -X PATCH -H 'User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:92.0) Gecko/20100101 Firefox/92.0' -H 'Accept: application/json, text/plain, */*' -H 'Accept-Language: de,en-US;q=0.7,en;q=0.3' --compressed -H 'Content-Type: application/x-www-form-urlencoded' -H 'authorization: 37ea8c25a695da1ff6afe7b3dbf1ad87' -H 'Origin: http://localhost:8080' -H 'Connection: keep-alive' -H 'Referer: http://localhost:8080/' -H 'Sec-Fetch-Dest: empty' -H 'Sec-Fetch-Mode: cors' -H 'Sec-Fetch-Site: cross-site' -H 'Pragma: no-cache' -H 'Cache-Control: no-cache' --data-raw '{"name":"Test","type":"=","format":"=","param":"="}'

CodePudding user response：

Since you're serialising the data yourself and are passing a string to axios, everyone—including your server probably—is apparently assuming the data is a form-encoded string. You either need to add a header:

Content-Type: application/json

or you pass an object, not a string, to axios so it'll do all that for you.