Why does axios always convert https into http when making request?

I am working with Laravel 5.8 and out-of-the-box pre-configured Vue.js.

For making a GET/POST/PUT/DELETE request within Vue.js components, I am using AXIOS as following:

import axios from 'axios'const obj = axios.create({  baseURL: '/controller-name/action-function-name'})export default {  all (params) {    return obj.get('/', params)  },  find (id) {    return obj.get(`/${id}`)  },  store (data) {    return obj.post(``, data)  },  update (id, data) {    return obj.put(`/${id}`, data)  },  delete (id) {    return obj.delete(`/${id}`)  }}

Everything works fine in my local environment with a HTTP virtual host e.g. http://my-website.com. Until I deployed my application on a real hosting server with HTTPS url e.g. https://my-website.com, my app does not work any more and I get the following error.

Mixed Content: The page at 'https://my-website.com/path#/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://my-website.com/path/controller-name/action-function-name'. This request has been blocked; the content must be served over HTTPS.

I do understand that because my application is running on HTTPS domain but the request that AXIOS makes is via HTTP. That's why it does not work.

My question is why does AXIOS covert HTTPS into HTTP url when making a request?

I did try the following with hard code url.

import axios from 'axios'export default {  all (params) {    return obj.get('https://my-website.com/controller-name/action-function-name/', params)  },  find (id) {    return obj.get(`https://my-website.com/controller-name/action-function-name/${id}`)  },  store (data) {    return obj.post(`https://my-website.com/controller-name/action-function-name`, data)  },  update (id, data) {    return obj.put(`https://my-website.com/controller-name/action-function-name/${id}`, data)  },  delete (id) {    return obj.delete(`https://my-website.com/controller-name/action-function-name/${id}`)  }}

As you can see, all hard code url is prefixed with https. Every time I click on a menu link, AXIOS always overrides my https hard code url with http url. How can I fix that?