Axios : authorization header not set on specific request on some iOS devices-CodePudding

I have a vuejs app using axios for http requests.

The authorization header is set via a request interceptor like so :

const api = axios.create({
  baseURL: process.env.API_URL,
  crossdomain: true,
  headers: {
    "Content-Type": "application/json",
    Accept: "application/json",
  },
});

api.interceptors.request.use(
  function (config) {
    if (config.url !== "/register") {
      const accessToken = localStorage.getItem('token');
      if (accessToken) {
        config.headers.Authorization = "Bearer "   accessToken;
      }
    }
    return config;
  },
  function (error) {
    // Do something with request error
    return Promise.reject(error);
  }
);

All the requests made in the app go through this interceptor. But there is a request for which the authorization header is not set for some ios devices (it works fine on web/android devices and some ios devices). Here is the request :

export function getSessions(context, payload) {
  return new Promise((resolve, reject) => {
    api.get("/sessions/"   payload.sportId   "/?begin="   payload.period.from   "&end="   payload.period.to)
      .then(({ data }) => {
        resolve(data);
      })
      .catch((error) => {
        reject(error);
      });
  });
}

I don't understand what could be going wrong. All other requests work fine one the devices for which this one doesn't.

CodePudding user response：

I found the reason of the bug : there was a / before the query (/?begin=). The problem occurred on iOS 14.5, 14.7 and maybe other versions but on any other device there was no error, sometimes a 301 http code was answered but that's it.