X-XSRF-TOKEN header with axios

Question

Do I have to set anything to send X-XSRF-TOKEN header if I set a XSRF-TOKEN cookie server side?

https://github.com/axios/axios/blob/master/lib/defaults.js#L74 https://github.com/axios/axios/blob/master/dist/axios.js#L1072

It reads like I don't, but I'm not seeing one go out.

I'll add that I have set withCredentials to true, so I do meet the first check in the OR:

var xsrfValue = (config.withCredentials || isURLSameOrigin(config.url)) && config.xsrfCookieName ?
            cookies.read(config.xsrfCookieName) :
            undefined;

          if (xsrfValue) {
            requestHeaders[config.xsrfHeaderName] = xsrfValue;
}

so if config.xsrfCookieName is a default.....

Update:

So, my OPTIONS preflight CORS is working, as is the POST now, but no X-XSRF-TOKEN being sent.

  methods: {
    onSubmit(e) {
      this.axios
        .post(
          e.target.action,
          { data: this.form },
          {
            withCredentials: true,
            xsrfCookieName: "XSRF-TOKEN",
            xsrfHeaderName: "X-XSRF-TOKEN"
          }
        )
        .then(res => {
          console.log(res)
        })
        .catch(err => {
          this.errors.push(err)
        })
    }
  }

Thanks.

Answer 1

I had the same issue and was about the "secure" flag on the cookie as can be seen on the cookies tab of the request, but is not showing on the cookies under "application" tab:

In my case, I had to ask the backend to set it down. This happens because, as secure, you cannot access to it via javascript.

document.cookie // is empty