diff --git a/api/src/main/java/org/apache/cloudstack/api/ApiErrorCode.java b/api/src/main/java/org/apache/cloudstack/api/ApiErrorCode.java
index 03dc37325d4b..616c37484d87 100644
--- a/api/src/main/java/org/apache/cloudstack/api/ApiErrorCode.java
+++ b/api/src/main/java/org/apache/cloudstack/api/ApiErrorCode.java
@@ -22,6 +22,7 @@
  */
 public enum ApiErrorCode {
 
+    BAD_REQUEST(400),
     UNAUTHORIZED(401),
     UNAUTHORIZED2FA(511),
     METHOD_NOT_ALLOWED(405),
diff --git a/api/src/main/java/org/apache/cloudstack/api/ApiServerService.java b/api/src/main/java/org/apache/cloudstack/api/ApiServerService.java
index cbbcdc3bda42..cb75939d6bc5 100644
--- a/api/src/main/java/org/apache/cloudstack/api/ApiServerService.java
+++ b/api/src/main/java/org/apache/cloudstack/api/ApiServerService.java
@@ -48,4 +48,6 @@ public ResponseObject loginUser(HttpSession session, String username, String pas
     boolean forgotPassword(UserAccount userAccount, Domain domain);
 
     boolean resetPassword(UserAccount userAccount, String token, String password);
+
+    boolean isPostRequestsAndTimestampsEnforced();
 }
diff --git a/server/src/main/java/com/cloud/api/ApiServer.java b/server/src/main/java/com/cloud/api/ApiServer.java
index b8227ef9d589..347520009070 100644
--- a/server/src/main/java/com/cloud/api/ApiServer.java
+++ b/server/src/main/java/com/cloud/api/ApiServer.java
@@ -201,6 +201,7 @@ public class ApiServer extends ManagerBase implements HttpRequestHandler, ApiSer
     private static final String SANITIZATION_REGEX = "[\n\r]";
 
     private static boolean encodeApiResponse = false;
+    private boolean isPostRequestsAndTimestampsEnforced = false;
 
     /**
      * Non-printable ASCII characters - numbers 0 to 31 and 127 decimal
@@ -284,6 +285,13 @@ public class ApiServer extends ManagerBase implements HttpRequestHandler, ApiSer
             , "Session cookie is marked as secure if this is enabled. Secure cookies only work when HTTPS is used."
             , false
             , ConfigKey.Scope.Global);
+    static final ConfigKey<Boolean> EnforcePostRequestsAndTimestamps = new ConfigKey<>(ConfigKey.CATEGORY_ADVANCED
+            , Boolean.class
+            , "enforce.post.requests.and.timestamps"
+            , "false"
+            , "Enable/Disable whether the ApiServer should only accept POST requests for state-changing APIs and requests with timestamps."
+            , false
+            , ConfigKey.Scope.Global);
     private static final ConfigKey<String> JSONDefaultContentType = new ConfigKey<> (ConfigKey.CATEGORY_ADVANCED
             , String.class
             , "json.content.type"
@@ -441,6 +449,7 @@ protected void setupIntegrationPortListener(Integer apiPort) {
     public boolean start() {
         Security.addProvider(new BouncyCastleProvider());
         Integer apiPort = IntegrationAPIPort.value(); // api port, null by default
+        isPostRequestsAndTimestampsEnforced = EnforcePostRequestsAndTimestamps.value();
 
         final Long snapshotLimit = ConcurrentSnapshotsThresholdPerHost.value();
         if (snapshotLimit == null || snapshotLimit <= 0) {
@@ -720,6 +729,11 @@ public String handleRequest(final Map params, final String responseType, final S
         return response;
     }
 
+    @Override
+    public boolean isPostRequestsAndTimestampsEnforced() {
+        return isPostRequestsAndTimestampsEnforced;
+    }
+
     private String getBaseAsyncResponse(final long jobId, final BaseAsyncCmd cmd) {
         final AsyncJobResponse response = new AsyncJobResponse();
 
@@ -967,7 +981,6 @@ public boolean verifyRequest(final Map<String, Object[]> requestParameters, fina
 
             // put the name in a list that we'll sort later
             final List<String> parameterNames = new ArrayList<>(requestParameters.keySet());
-
             Collections.sort(parameterNames);
 
             String signatureVersion = null;
@@ -1019,12 +1032,22 @@ public boolean verifyRequest(final Map<String, Object[]> requestParameters, fina
                 }
 
                 final Date now = new Date(System.currentTimeMillis());
+                final Date thresholdTime = new Date(now.getTime() + 15 * 60 * 1000);
                 if (expiresTS.before(now)) {
                     signature = signature.replaceAll(SANITIZATION_REGEX, "_");
                     apiKey = apiKey.replaceAll(SANITIZATION_REGEX, "_");
                     logger.debug("Request expired -- ignoring ...sig [{}], apiKey [{}].", signature, apiKey);
                     return false;
+                } else if (isPostRequestsAndTimestampsEnforced && expiresTS.after(thresholdTime)) {
+                    signature = signature.replaceAll(SANITIZATION_REGEX, "_");
+                    apiKey = apiKey.replaceAll(SANITIZATION_REGEX, "_");
+                    logger.debug(String.format("Expiration parameter is set for too long -- ignoring ...sig [%s], apiKey [%s].", signature, apiKey));
+                    return false;
                 }
+            } else if (isPostRequestsAndTimestampsEnforced) {
+                // Force expiration parameter
+                logger.debug("Signature Version must be 3, and should be along with the Expires parameter -- ignoring request.");
+                return false;
             }
 
             final TransactionLegacy txn = TransactionLegacy.open(TransactionLegacy.CLOUD_DB);
@@ -1648,6 +1671,7 @@ public String getConfigComponentName() {
     @Override
     public ConfigKey<?>[] getConfigKeys() {
         return new ConfigKey<?>[] {
+                EnforcePostRequestsAndTimestamps,
                 IntegrationAPIPort,
                 ConcurrentSnapshotsThresholdPerHost,
                 EncodeApiResponse,
diff --git a/server/src/main/java/com/cloud/api/ApiServlet.java b/server/src/main/java/com/cloud/api/ApiServlet.java
index 4994c42bb4dc..41229670c38a 100644
--- a/server/src/main/java/com/cloud/api/ApiServlet.java
+++ b/server/src/main/java/com/cloud/api/ApiServlet.java
@@ -22,8 +22,11 @@
 import java.net.UnknownHostException;
 import java.util.Arrays;
 import java.util.HashMap;
+import java.util.HashSet;
 import java.util.List;
 import java.util.Map;
+import java.util.regex.Pattern;
+import java.util.Set;
 
 import javax.inject.Inject;
 import javax.servlet.ServletConfig;
@@ -46,6 +49,7 @@
 import org.apache.cloudstack.context.CallContext;
 import org.apache.cloudstack.managed.context.ManagedContext;
 import org.apache.cloudstack.utils.consoleproxy.ConsoleAccessUtils;
+import org.apache.commons.collections.MapUtils;
 
 import org.apache.logging.log4j.Logger;
 import org.apache.logging.log4j.LogManager;
@@ -78,6 +82,39 @@ public class ApiServlet extends HttpServlet {
     private static final Logger ACCESSLOGGER = LogManager.getLogger("apiserver." + ApiServlet.class.getName());
     private static final String REPLACEMENT = "_";
     private static final String LOGGER_REPLACEMENTS = "[\n\r\t]";
+    private static final Pattern GET_REQUEST_COMMANDS = Pattern.compile("^(get|list|query|find)(\\w+)+$");
+    private static final HashSet<String> GET_REQUEST_COMMANDS_LIST = new HashSet<>(Set.of("isaccountallowedtocreateofferingswithtags",
+            "readyforshutdown", "cloudianisenabled", "quotabalance", "quotasummary", "quotatarifflist", "quotaisenabled", "quotastatement", "verifyoauthcodeandgetuser"));
+    private static final HashSet<String> POST_REQUESTS_TO_DISABLE_LOGGING = new HashSet<>(Set.of(
+            "login",
+            "oauthlogin",
+            "createaccount",
+            "createuser",
+            "updateuser",
+            "forgotpassword",
+            "resetpassword",
+            "importrole",
+            "updaterolepermission",
+            "updateprojectrolepermission",
+            "createstoragepool",
+            "addhost",
+            "updatehostpassword",
+            "addcluster",
+            "addvmwaredc",
+            "configureoutofbandmanagement",
+            "uploadcustomcertificate",
+            "addciscovnmcresource",
+            "addnetscalerloadbalancer",
+            "createtungstenfabricprovider",
+            "addnsxcontroller",
+            "configtungstenfabricservice",
+            "createnetworkacl",
+            "updatenetworkaclitem",
+            "quotavalidateactivationrule",
+            "quotatariffupdate",
+            "listandswitchsamlaccount",
+            "uploadresourceicon"
+    ));
 
     @Inject
     ApiServerService apiServer;
@@ -193,11 +230,24 @@ void processRequestInContext(final HttpServletRequest req, final HttpServletResp
 
         utf8Fixup(req, params);
 
+        final Object[] commandObj = params.get(ApiConstants.COMMAND);
+        final String command = commandObj == null ? null : (String) commandObj[0];
+
         // logging the request start and end in management log for easy debugging
         String reqStr = "";
         String cleanQueryString = StringUtils.cleanString(req.getQueryString());
         if (LOGGER.isDebugEnabled()) {
             reqStr = auditTrailSb.toString() + " " + cleanQueryString;
+            if (req.getMethod().equalsIgnoreCase("POST") && org.apache.commons.lang3.StringUtils.isNotBlank(command)) {
+                if (!POST_REQUESTS_TO_DISABLE_LOGGING.contains(command.toLowerCase()) && !reqParams.containsKey(ApiConstants.USER_DATA)) {
+                    String cleanParamsString = getCleanParamsString(reqParams);
+                    if (org.apache.commons.lang3.StringUtils.isNotBlank(cleanParamsString)) {
+                        reqStr += "\n" + cleanParamsString;
+                    }
+                } else {
+                    reqStr += " " + command;
+                }
+            }
             LOGGER.debug("===START=== " + reqStr);
         }
 
@@ -213,8 +263,6 @@ void processRequestInContext(final HttpServletRequest req, final HttpServletResp
                 responseType = (String)responseTypeParam[0];
             }
 
-            final Object[] commandObj = params.get(ApiConstants.COMMAND);
-            final String command = commandObj == null ? null : (String) commandObj[0];
             final Object[] userObj = params.get(ApiConstants.USERNAME);
             String username = userObj == null ? null : (String)userObj[0];
             if (LOGGER.isTraceEnabled()) {
@@ -317,6 +365,19 @@ void processRequestInContext(final HttpServletRequest req, final HttpServletResp
                 }
             }
 
+            if (apiServer.isPostRequestsAndTimestampsEnforced() && !isStateChangingCommandUsingPOST(command, req.getMethod(), params)) {
+                String errorText = String.format("State changing command %s needs to be sent using POST request", command);
+                if (command.equalsIgnoreCase("updateConfiguration") && params.containsKey("name")) {
+                    errorText = String.format("Changes for configuration %s needs to be sent using POST request", params.get("name")[0]);
+                }
+                auditTrailSb.append(" " + HttpServletResponse.SC_BAD_REQUEST + " " + errorText);
+                final String serializedResponse =
+                        apiServer.getSerializedApiError(new ServerApiException(ApiErrorCode.BAD_REQUEST, errorText), params,
+                                responseType);
+                HttpUtils.writeHttpResponse(resp, serializedResponse, HttpServletResponse.SC_BAD_REQUEST, responseType, ApiServer.JSONcontentType.value());
+                return;
+            }
+
             Long userId = null;
             if (!isNew) {
                 userId = (Long)session.getAttribute("userid");
@@ -407,6 +468,15 @@ private boolean checkIfAuthenticatorIsOf2FA(String command) {
         return verify2FA;
     }
 
+    private boolean isStateChangingCommandUsingPOST(String command, String method, Map<String, Object[]> params) {
+        if (command == null || (!GET_REQUEST_COMMANDS.matcher(command.toLowerCase()).matches() && !GET_REQUEST_COMMANDS_LIST.contains(command.toLowerCase())
+                && !command.equalsIgnoreCase("updateConfiguration") && !method.equals("POST"))) {
+            return false;
+        }
+        return !command.equalsIgnoreCase("updateConfiguration") || method.equals("POST") || (params.containsKey("name")
+                && params.get("name")[0].toString().equalsIgnoreCase(ApiServer.EnforcePostRequestsAndTimestamps.key()));
+    }
+
     protected boolean skip2FAcheckForAPIs(String command) {
         boolean skip2FAcheck = false;
 
@@ -644,4 +714,45 @@ private static String getCorrectIPAddress(String ip) {
         }
         return null;
     }
+
+    private String getCleanParamsString(Map<String, String[]> reqParams) {
+        if (MapUtils.isEmpty(reqParams)) {
+            return "";
+        }
+
+        StringBuilder cleanParamsString = new StringBuilder();
+        for (Map.Entry<String, String[]> reqParam : reqParams.entrySet()) {
+            if (org.apache.commons.lang3.StringUtils.isBlank(reqParam.getKey())) {
+                continue;
+            }
+
+            cleanParamsString.append(reqParam.getKey());
+            cleanParamsString.append("=");
+
+            if (reqParam.getKey().toLowerCase().contains("password")
+                    || reqParam.getKey().toLowerCase().contains("privatekey")
+                    || reqParam.getKey().toLowerCase().contains("accesskey")
+                    || reqParam.getKey().toLowerCase().contains("secretkey")) {
+                cleanParamsString.append("\n");
+                continue;
+            }
+
+            if (reqParam.getValue() == null || reqParam.getValue().length == 0) {
+                cleanParamsString.append("\n");
+                continue;
+            }
+
+            for (String param : reqParam.getValue()) {
+                if (org.apache.commons.lang3.StringUtils.isBlank(param)) {
+                    continue;
+                }
+                String cleanParamString = StringUtils.cleanString(param.trim());
+                cleanParamsString.append(cleanParamString);
+                cleanParamsString.append(" ");
+            }
+            cleanParamsString.append("\n");
+        }
+
+        return cleanParamsString.toString();
+    }
 }
diff --git a/ui/src/api/index.js b/ui/src/api/index.js
index 7ab87780a9d4..85c46c483b24 100644
--- a/ui/src/api/index.js
+++ b/ui/src/api/index.js
@@ -23,18 +23,10 @@ import {
   ACCESS_TOKEN
 } from '@/store/mutation-types'
 
-export function api (command, args = {}, method = 'GET', data = {}) {
-  let params = {}
+export function getAPI (command, args = {}) {
   args.command = command
   args.response = 'json'
 
-  if (data) {
-    params = new URLSearchParams()
-    Object.entries(data).forEach(([key, value]) => {
-      params.append(key, value)
-    })
-  }
-
   const sessionkey = vueProps.$localStorage.get(ACCESS_TOKEN) || Cookies.get('sessionkey')
   if (sessionkey) {
     args.sessionkey = sessionkey
@@ -45,8 +37,30 @@ export function api (command, args = {}, method = 'GET', data = {}) {
       ...args
     },
     url: '/',
-    method,
-    data: params || {}
+    method: 'GET'
+  })
+}
+
+export function postAPI (command, data = {}) {
+  const params = new URLSearchParams()
+  params.append('command', command)
+  params.append('response', 'json')
+  if (data) {
+    Object.entries(data).forEach(([key, value]) => {
+      if (value !== undefined && value !== null && value !== '') {
+        params.append(key, value)
+      }
+    })
+  }
+
+  const sessionkey = vueProps.$localStorage.get(ACCESS_TOKEN) || Cookies.get('sessionkey')
+  if (sessionkey) {
+    params.append('sessionkey', sessionkey)
+  }
+  return axios({
+    url: '/',
+    method: 'POST',
+    data: params
   })
 }
 
@@ -56,7 +70,7 @@ export function login (arg) {
   }
 
   // Logout before login is called to purge any duplicate sessionkey cookies
-  api('logout')
+  postAPI('logout')
 
   const params = new URLSearchParams()
   params.append('command', 'login')
@@ -66,7 +80,7 @@ export function login (arg) {
   params.append('response', 'json')
   return axios({
     url: '/',
-    method: 'post',
+    method: 'POST',
     data: params,
     headers: {
       'content-type': 'application/x-www-form-urlencoded'
@@ -77,7 +91,7 @@ export function login (arg) {
 export function logout () {
   message.destroy()
   notification.destroy()
-  return api('logout')
+  return postAPI('logout')
 }
 
 export function oauthlogin (arg) {
@@ -86,7 +100,7 @@ export function oauthlogin (arg) {
   }
 
   // Logout before login is called to purge any duplicate sessionkey cookies
-  api('logout')
+  postAPI('logout')
 
   const params = new URLSearchParams()
   params.append('command', 'oauthlogin')
diff --git a/ui/src/components/header/SamlDomainSwitcher.vue b/ui/src/components/header/SamlDomainSwitcher.vue
index 082bab7bf13c..e0799bef4d83 100644
--- a/ui/src/components/header/SamlDomainSwitcher.vue
+++ b/ui/src/components/header/SamlDomainSwitcher.vue
@@ -51,7 +51,7 @@
 
 <script>
 import store from '@/store'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import _ from 'lodash'
 
 export default {
@@ -73,7 +73,7 @@ export default {
       const samlAccounts = []
       const getNextPage = () => {
         this.loading = true
-        api('listAndSwitchSamlAccount', { details: 'min', page: page, pageSize: 500 }).then(json => {
+        postAPI('listAndSwitchSamlAccount', { details: 'min', page: page, pageSize: 500 }).then(json => {
           if (json && json.listandswitchsamlaccountresponse && json.listandswitchsamlaccountresponse.samluseraccount) {
             samlAccounts.push(...json.listandswitchsamlaccountresponse.samluseraccount)
           }
@@ -102,7 +102,7 @@ export default {
     },
     changeAccount (index) {
       const account = this.samlAccounts[index]
-      api('listAndSwitchSamlAccount', {}, 'POST', {
+      postAPI('listAndSwitchSamlAccount', {
         userid: account.userId,
         domainid: account.domainId
       }).then(response => {
diff --git a/ui/src/components/header/UserMenu.vue b/ui/src/components/header/UserMenu.vue
index 32597dffdfbd..34d38d8327b7 100644
--- a/ui/src/components/header/UserMenu.vue
+++ b/ui/src/components/header/UserMenu.vue
@@ -71,7 +71,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import CreateMenu from './CreateMenu'
 import ExternalLink from './ExternalLink'
 import HeaderNotice from './HeaderNotice'
@@ -143,7 +143,7 @@ export default {
           this.image = this.$store.getters.avatar
           resolve(this.image)
         }
-        api('listUsers', {
+        getAPI('listUsers', {
           id: id,
           showicon: true
         }).then(json => {
diff --git a/ui/src/components/page/GlobalLayout.vue b/ui/src/components/page/GlobalLayout.vue
index 2002ca3bfc85..41a9fca49ba7 100644
--- a/ui/src/components/page/GlobalLayout.vue
+++ b/ui/src/components/page/GlobalLayout.vue
@@ -128,7 +128,7 @@ import { triggerWindowResizeEvent } from '@/utils/util'
 import { mapState, mapActions } from 'vuex'
 import { mixin, mixinDevice } from '@/utils/mixin.js'
 import { isAdmin } from '@/role'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Drawer from '@/components/widgets/Drawer'
 import Setting from '@/components/view/Setting.vue'
 
@@ -260,7 +260,7 @@ export default {
       this.$store.commit('SET_COUNT_NOTIFY', 0)
     },
     checkShutdown () {
-      api('readyForShutdown', { managementserverid: this.$store.getters.msId }).then(json => {
+      getAPI('readyForShutdown', { managementserverid: this.$store.getters.msId }).then(json => {
         this.$store.dispatch('SetShutdownTriggered', json.readyforshutdownresponse.readyforshutdown.shutdowntriggered || false)
         this.$store.dispatch('SetMaintenanceInitiated', json.readyforshutdownresponse.readyforshutdown.maintenanceinitiated || false)
       })
diff --git a/ui/src/components/view/ActionButton.vue b/ui/src/components/view/ActionButton.vue
index f15ec2fd9f34..14128a5ce554 100644
--- a/ui/src/components/view/ActionButton.vue
+++ b/ui/src/components/view/ActionButton.vue
@@ -101,7 +101,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import Console from '@/components/widgets/Console'
 
 export default {
@@ -194,7 +194,7 @@ export default {
           const action = actionBadge[i]
 
           arrAsync.push(new Promise((resolve, reject) => {
-            api(action.api, action.param).then(json => {
+            postAPI(action.api, action.param).then(json => {
               let responseJsonName
               const response = {}
 
diff --git a/ui/src/components/view/AnnotationsTab.vue b/ui/src/components/view/AnnotationsTab.vue
index 5b42af8eabcb..4de48f3e4d11 100644
--- a/ui/src/components/view/AnnotationsTab.vue
+++ b/ui/src/components/view/AnnotationsTab.vue
@@ -119,7 +119,7 @@
 
 <script>
 
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 export default {
   name: 'AnnotationsTab',
@@ -217,7 +217,7 @@ export default {
       }
       this.loadingAnnotations = true
       this.notes = []
-      api('listAnnotations', { entityid: this.resource.id, entitytype: this.annotationType, annotationfilter: 'all', page: this.page, pagesize: this.pageSize }).then(json => {
+      getAPI('listAnnotations', { entityid: this.resource.id, entitytype: this.annotationType, annotationfilter: 'all', page: this.page, pagesize: this.pageSize }).then(json => {
         if (json.listannotationsresponse && json.listannotationsresponse.annotation) {
           this.notes = json.listannotationsresponse.annotation
           this.itemCount = json.listannotationsresponse.count
@@ -246,7 +246,7 @@ export default {
       args.entitytype = this.annotationType
       args.annotation = this.annotation
       args.adminsonly = this.annotationAdminsOnly
-      api('addAnnotation', args).catch(error => {
+      postAPI('addAnnotation', args).catch(error => {
         this.$notifyError(error)
       }).finally(e => {
         this.getAnnotations()
@@ -258,7 +258,7 @@ export default {
       this.loadingAnnotations = true
       const args = {}
       args.id = annotation.id
-      api('removeAnnotation', args).catch(error => {
+      postAPI('removeAnnotation', args).catch(error => {
         this.$notifyError(error)
       }).finally(e => {
         this.getAnnotations()
@@ -270,7 +270,7 @@ export default {
         id: annotation.id,
         adminsonly: !annotation.adminsonly
       }
-      api('updateAnnotationVisibility', args).catch(error => {
+      postAPI('updateAnnotationVisibility', args).catch(error => {
         this.$notifyError(error)
       }).finally(e => {
         this.getAnnotations()
diff --git a/ui/src/components/view/DedicateData.vue b/ui/src/components/view/DedicateData.vue
index d99b080e00d3..079ff139141c 100644
--- a/ui/src/components/view/DedicateData.vue
+++ b/ui/src/components/view/DedicateData.vue
@@ -53,7 +53,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import DedicateModal from './DedicateModal'
 
 export default {
@@ -124,7 +124,7 @@ export default {
       }
     },
     fetchDedicatedZones () {
-      api('listDedicatedZones', {
+      getAPI('listDedicatedZones', {
         zoneid: this.resource.id
       }).then(response => {
         if (response?.listdedicatedzonesresponse?.dedicatedzone?.length > 0) {
@@ -136,7 +136,7 @@ export default {
       })
     },
     fetchDedicatedPods () {
-      api('listDedicatedPods', {
+      getAPI('listDedicatedPods', {
         podid: this.resource.id
       }).then(response => {
         if (response?.listdedicatedpodsresponse?.dedicatedpod?.length > 0) {
@@ -148,7 +148,7 @@ export default {
       })
     },
     fetchDedicatedClusters () {
-      api('listDedicatedClusters', {
+      getAPI('listDedicatedClusters', {
         clusterid: this.resource.id
       }).then(response => {
         if (response?.listdedicatedclustersresponse?.dedicatedcluster?.length > 0) {
@@ -160,7 +160,7 @@ export default {
       })
     },
     fetchDedicatedHosts () {
-      api('listDedicatedHosts', {
+      getAPI('listDedicatedHosts', {
         hostid: this.resource.id
       }).then(response => {
         if (response?.listdedicatedhostsresponse?.dedicatedhost?.length > 0) {
@@ -172,7 +172,7 @@ export default {
       })
     },
     releaseDedidcatedZone () {
-      api('releaseDedicatedZone', {
+      postAPI('releaseDedicatedZone', {
         zoneid: this.resource.id
       }).then(response => {
         this.$pollJob({
@@ -195,7 +195,7 @@ export default {
       })
     },
     releaseDedidcatedPod () {
-      api('releaseDedicatedPod', {
+      postAPI('releaseDedicatedPod', {
         podid: this.resource.id
       }).then(response => {
         this.$pollJob({
@@ -218,7 +218,7 @@ export default {
       })
     },
     releaseDedidcatedCluster () {
-      api('releaseDedicatedCluster', {
+      postAPI('releaseDedicatedCluster', {
         clusterid: this.resource.id
       }).then(response => {
         this.$pollJob({
@@ -241,7 +241,7 @@ export default {
       })
     },
     releaseDedidcatedHost () {
-      api('releaseDedicatedHost', {
+      postAPI('releaseDedicatedHost', {
         hostid: this.resource.id
       }).then(response => {
         this.$pollJob({
diff --git a/ui/src/components/view/DedicateDomain.vue b/ui/src/components/view/DedicateDomain.vue
index 0b3645ce4183..08b349cadec2 100644
--- a/ui/src/components/view/DedicateDomain.vue
+++ b/ui/src/components/view/DedicateDomain.vue
@@ -60,7 +60,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 export default {
   name: 'DedicateDomain',
@@ -90,7 +90,7 @@ export default {
   methods: {
     fetchData () {
       this.domainsLoading = true
-      api('listDomains', {
+      getAPI('listDomains', {
         listAll: true,
         details: 'min'
       }).then(response => {
@@ -107,7 +107,7 @@ export default {
       })
     },
     fetchAccounts () {
-      api('listAccounts', {
+      getAPI('listAccounts', {
         domainid: this.domainId
       }).then(response => {
         this.accountsList = response.listaccountsresponse.account || []
diff --git a/ui/src/components/view/DedicateModal.vue b/ui/src/components/view/DedicateModal.vue
index 4e9ccb846661..010b992c12fc 100644
--- a/ui/src/components/view/DedicateModal.vue
+++ b/ui/src/components/view/DedicateModal.vue
@@ -37,7 +37,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import DedicateDomain from './DedicateDomain'
 
 export default {
@@ -92,7 +92,7 @@ export default {
         this.domainError = true
         return
       }
-      api('dedicateZone', {
+      postAPI('dedicateZone', {
         zoneId: this.resource.id,
         domainId: this.domainId,
         account: this.dedicatedAccount
@@ -134,7 +134,7 @@ export default {
         this.domainError = true
         return
       }
-      api('dedicatePod', {
+      postAPI('dedicatePod', {
         podId: this.resource.id,
         domainId: this.domainId,
         account: this.dedicatedAccount
@@ -176,7 +176,7 @@ export default {
         this.domainError = true
         return
       }
-      api('dedicateCluster', {
+      postAPI('dedicateCluster', {
         clusterId: this.resource.id,
         domainId: this.domainId,
         account: this.dedicatedAccount
@@ -218,7 +218,7 @@ export default {
         this.domainError = true
         return
       }
-      api('dedicateHost', {
+      postAPI('dedicateHost', {
         hostId: this.resource.id,
         domainId: this.domainId,
         account: this.dedicatedAccount
diff --git a/ui/src/components/view/DetailSettings.vue b/ui/src/components/view/DetailSettings.vue
index 9f808b907c75..987a8ac42136 100644
--- a/ui/src/components/view/DetailSettings.vue
+++ b/ui/src/components/view/DetailSettings.vue
@@ -128,7 +128,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
 export default {
@@ -209,11 +209,11 @@ export default {
           return { name: k, value: resource.details[k], edit: false }
         })
       }
-      api('listDetailOptions', { resourcetype: this.resourceType, resourceid: resource.id }).then(json => {
+      getAPI('listDetailOptions', { resourcetype: this.resourceType, resourceid: resource.id }).then(json => {
         this.detailOptions = json.listdetailoptionsresponse.detailoptions.details
       })
       this.disableSettings = (this.$route.meta.name === 'vm' && resource.state !== 'Stopped')
-      api('listTemplates', { templatefilter: 'all', id: resource.templateid }).then(json => {
+      getAPI('listTemplates', { templatefilter: 'all', id: resource.templateid }).then(json => {
         this.deployasistemplate = json.listtemplatesresponse.template[0].deployasis
       })
     },
@@ -291,7 +291,7 @@ export default {
       var params = { id: this.resource.id }
       params = Object.assign(params, this.getDetailsParam(this.details))
       this.loading = true
-      api(apiName, params).then(json => {
+      postAPI(apiName, params).then(json => {
         var details = {}
         if (this.resourceType === 'UserVm' && json.updatevirtualmachineresponse.virtualmachine.details) {
           details = json.updatevirtualmachineresponse.virtualmachine.details
diff --git a/ui/src/components/view/EventsTab.vue b/ui/src/components/view/EventsTab.vue
index bd01b3f57c26..c3a6ac5c17fa 100644
--- a/ui/src/components/view/EventsTab.vue
+++ b/ui/src/components/view/EventsTab.vue
@@ -48,7 +48,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { genericCompare } from '@/utils/sort.js'
 import ListView from '@/components/view/ListView'
 
@@ -127,7 +127,7 @@ export default {
         listall: true
       }
       this.tabLoading = true
-      api('listEvents', params).then(json => {
+      getAPI('listEvents', params).then(json => {
         this.events = []
         this.totalCount = json?.listeventsresponse?.count || 0
         this.events = json?.listeventsresponse?.event || []
diff --git a/ui/src/components/view/ImageStoreSelectView.vue b/ui/src/components/view/ImageStoreSelectView.vue
index 13c5a68e5b12..7871703cd8e4 100644
--- a/ui/src/components/view/ImageStoreSelectView.vue
+++ b/ui/src/components/view/ImageStoreSelectView.vue
@@ -75,7 +75,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 export default {
   name: 'ImageStoreSelector',
@@ -141,7 +141,7 @@ export default {
         page: this.page,
         pagesize: this.pageSize
       }
-      api('listImageStores', params).then(response => {
+      getAPI('listImageStores', params).then(response => {
         this.imageStores = response.listimagestoresresponse.imagestore || []
         this.totalCount = response.listimagestoresresponse.count
       }).catch(error => {
diff --git a/ui/src/components/view/InfoCard.vue b/ui/src/components/view/InfoCard.vue
index cebc0665dfcf..53c22c2ef0da 100644
--- a/ui/src/components/view/InfoCard.vue
+++ b/ui/src/components/view/InfoCard.vue
@@ -900,7 +900,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { createPathBasedOnVmType } from '@/utils/plugins'
 import { validateLinks } from '@/utils/links'
 import Console from '@/components/widgets/Console'
@@ -1071,7 +1071,7 @@ export default {
     fetchOsCategoryAndIcon () {
       const osId = this.resource.guestosid || this.resource.ostypeid
       if (osId && 'listOsTypes' in this.$store.getters.apis) {
-        api('listOsTypes', { id: osId }).then(json => {
+        getAPI('listOsTypes', { id: osId }).then(json => {
           this.osCategoryId = json?.listostypesresponse?.ostype?.[0]?.oscategoryid || null
           if (this.osCategoryId) {
             this.fetchResourceIcon(this.osCategoryId, 'guestoscategory')
@@ -1120,7 +1120,7 @@ export default {
     },
     fetchAccount () {
       return new Promise((resolve, reject) => {
-        api('listAccounts', {
+        getAPI('listAccounts', {
           name: this.resource.account,
           domainid: this.resource.domainid,
           showicon: true
@@ -1135,7 +1135,7 @@ export default {
     fetchResourceIcon (resourceid, type) {
       if (resourceid) {
         return new Promise((resolve, reject) => {
-          api('listResourceIcon', {
+          getAPI('listResourceIcon', {
             resourceids: resourceid,
             resourcetype: type
           }).then(json => {
@@ -1173,7 +1173,7 @@ export default {
       if (!('getUserKeys' in this.$store.getters.apis)) {
         return
       }
-      api('getUserKeys', { id: this.resource.id }).then(json => {
+      getAPI('getUserKeys', { id: this.resource.id }).then(json => {
         this.showKeys = true
         this.newResource.secretkey = json.getuserkeysresponse.userkeys.secretkey
         if (!this.isAdmin()) {
@@ -1196,7 +1196,7 @@ export default {
       if (this.$route.meta.name === 'project') {
         params.projectid = this.resource.id
       }
-      api('listTags', params).then(json => {
+      getAPI('listTags', params).then(json => {
         if (json.listtagsresponse && json.listtagsresponse.tag) {
           this.tags = json.listtagsresponse.tag
         }
@@ -1231,7 +1231,7 @@ export default {
       args.resourcetype = this.resourceType
       args['tags[0].key'] = this.inputKey
       args['tags[0].value'] = this.inputValue
-      api('createTags', args).then(json => {
+      postAPI('createTags', args).then(json => {
       }).finally(e => {
         this.getTags()
       })
@@ -1247,7 +1247,7 @@ export default {
       args.resourcetype = this.resourceType
       args['tags[0].key'] = tag.key
       args['tags[0].value'] = tag.value
-      api('deleteTags', args).then(json => {
+      postAPI('deleteTags', args).then(json => {
       }).finally(e => {
         this.getTags()
       })
diff --git a/ui/src/components/view/InstanceVolumesStoragePoolSelectListView.vue b/ui/src/components/view/InstanceVolumesStoragePoolSelectListView.vue
index 77f3e8f91f47..5319e39334b1 100644
--- a/ui/src/components/view/InstanceVolumesStoragePoolSelectListView.vue
+++ b/ui/src/components/view/InstanceVolumesStoragePoolSelectListView.vue
@@ -63,7 +63,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import VolumeStoragePoolSelectForm from '@/components/view/VolumeStoragePoolSelectForm'
 
 export default {
@@ -168,7 +168,7 @@ export default {
     fetchVolumes () {
       this.volumesLoading = true
       this.volumes = []
-      api('listVolumes', {
+      getAPI('listVolumes', {
         listAll: true,
         virtualmachineid: this.resource.id
       }).then(response => {
diff --git a/ui/src/components/view/ListResourceTable.vue b/ui/src/components/view/ListResourceTable.vue
index f8fdc5b5adad..4ead951b8abf 100644
--- a/ui/src/components/view/ListResourceTable.vue
+++ b/ui/src/components/view/ListResourceTable.vue
@@ -82,7 +82,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import Status from '@/components/widgets/Status'
 
@@ -177,7 +177,7 @@ export default {
       params.listall = true
       params.response = 'json'
       params.details = 'min'
-      api(this.apiName, params).then(json => {
+      getAPI(this.apiName, params).then(json => {
         var responseName
         var objectName
         for (const key in json) {
diff --git a/ui/src/components/view/ListView.vue b/ui/src/components/view/ListView.vue
index 9f4eac118ec2..403c097a67e9 100644
--- a/ui/src/components/view/ListView.vue
+++ b/ui/src/components/view/ListView.vue
@@ -613,7 +613,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import OsLogo from '@/components/widgets/OsLogo'
 import Status from '@/components/widgets/Status'
 import QuickView from '@/components/view/QuickView'
@@ -803,7 +803,7 @@ export default {
       this.$router.push({ name: 'dashboard' })
     },
     saveValue (record) {
-      api('updateConfiguration', {
+      postAPI('updateConfiguration', {
         name: record.name,
         value: this.editableValue
       }).then(json => {
@@ -827,7 +827,7 @@ export default {
       })
     },
     resetConfig (item) {
-      api('resetConfiguration', {
+      postAPI('resetConfiguration', {
         name: item.name
       }).then(() => {
         this.$messageConfigSuccess(`${this.$t('label.setting')} ${item.name} ${this.$t('label.reset.config.value')}`, item)
@@ -885,7 +885,7 @@ export default {
       const apiString = this.getUpdateApi()
 
       return new Promise((resolve, reject) => {
-        api(apiString, {
+        postAPI(apiString, {
           id,
           sortKey: index
         }).then((response) => {
@@ -1024,7 +1024,7 @@ export default {
       }
     },
     updateAdminsOnly (e) {
-      api('updateAnnotationVisibility', {
+      postAPI('updateAnnotationVisibility', {
         id: e.target.value,
         adminsonly: e.target.checked
       }).finally(() => {
@@ -1081,7 +1081,7 @@ export default {
     },
     getUsageTypes () {
       if (this.$route.path.split('/')[1] === 'usage') {
-        api('listUsageTypes').then(json => {
+        getAPI('listUsageTypes').then(json => {
           if (json && json.listusagetypesresponse && json.listusagetypesresponse.usagetype) {
             this.usageTypes = json.listusagetypesresponse.usagetype.map(x => {
               return {
diff --git a/ui/src/components/view/NicNetworkSelectForm.vue b/ui/src/components/view/NicNetworkSelectForm.vue
index d54f775d38f7..b0b1faed54d3 100644
--- a/ui/src/components/view/NicNetworkSelectForm.vue
+++ b/ui/src/components/view/NicNetworkSelectForm.vue
@@ -70,7 +70,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 export default {
   name: 'NicNetworkSelectForm',
@@ -151,7 +151,7 @@ export default {
         domainid: this.$store.getters.project && this.$store.getters.project.id ? null : this.$store.getters.userInfo.domainid,
         account: this.$store.getters.project && this.$store.getters.project.id ? null : this.$store.getters.userInfo.account
       }
-      api('listNetworks', params).then(response => {
+      getAPI('listNetworks', params).then(response => {
         this.networks = response.listnetworksresponse.network || []
         this.totalCount = response.listnetworksresponse.count
       }).catch(error => {
diff --git a/ui/src/components/view/ResourceLimitTab.vue b/ui/src/components/view/ResourceLimitTab.vue
index 0d56468e90f9..699c024af4ee 100644
--- a/ui/src/components/view/ResourceLimitTab.vue
+++ b/ui/src/components/view/ResourceLimitTab.vue
@@ -75,7 +75,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import _ from 'lodash'
 
 export default {
@@ -228,7 +228,7 @@ export default {
     listResourceLimits (params) {
       return new Promise((resolve, reject) => {
         let dataResource = []
-        api('listResourceLimits', params).then(json => {
+        getAPI('listResourceLimits', params).then(json => {
           if (json.listresourcelimitsresponse.resourcelimit) {
             dataResource = json.listresourcelimitsresponse.resourcelimit
             dataResource.sort((a, b) => a.resourcetype - b.resourcetype)
@@ -251,7 +251,7 @@ export default {
     },
     updateResourceLimit (params) {
       return new Promise((resolve, reject) => {
-        api('updateResourceLimit', params).then(json => {
+        postAPI('updateResourceLimit', params).then(json => {
           resolve()
         }).catch(error => {
           reject(error)
diff --git a/ui/src/components/view/ResourceView.vue b/ui/src/components/view/ResourceView.vue
index 2c1764da1437..17d2a13e1572 100644
--- a/ui/src/components/view/ResourceView.vue
+++ b/ui/src/components/view/ResourceView.vue
@@ -68,7 +68,7 @@
 import DetailsTab from '@/components/view/DetailsTab'
 import InfoCard from '@/components/view/InfoCard'
 import ResourceLayout from '@/layouts/ResourceLayout'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 
 export default {
@@ -137,7 +137,7 @@ export default {
   methods: {
     fetchData () {
       if (this.resource.associatednetworkid) {
-        api('listNetworks', { id: this.resource.associatednetworkid, listall: true }).then(response => {
+        getAPI('listNetworks', { id: this.resource.associatednetworkid, listall: true }).then(response => {
           if (response && response.listnetworksresponse && response.listnetworksresponse.network) {
             this.networkService = response.listnetworksresponse.network[0]
           } else {
diff --git a/ui/src/components/view/SearchView.vue b/ui/src/components/view/SearchView.vue
index c2647c9db773..1581e1748af1 100644
--- a/ui/src/components/view/SearchView.vue
+++ b/ui/src/components/view/SearchView.vue
@@ -161,7 +161,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { isAdmin } from '@/role'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -785,7 +785,7 @@ export default {
     },
     fetchZones (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listZones', { showicon: true, keyword: searchKeyword }).then(json => {
+        getAPI('listZones', { showicon: true, keyword: searchKeyword }).then(json => {
           const zones = json.listzonesresponse.zone
           resolve({
             type: 'zoneid',
@@ -798,7 +798,7 @@ export default {
     },
     fetchDomains (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listDomains', { listAll: true, details: 'min', showicon: true, keyword: searchKeyword }).then(json => {
+        getAPI('listDomains', { listAll: true, details: 'min', showicon: true, keyword: searchKeyword }).then(json => {
           const domain = json.listdomainsresponse.domain
           resolve({
             type: 'domainid',
@@ -815,7 +815,7 @@ export default {
         if (this.form.domainid) {
           params.domainid = this.form.domainid
         }
-        api('listAccounts', params).then(json => {
+        getAPI('listAccounts', params).then(json => {
           let account = json?.listaccountsresponse?.account || []
           if (this.form.domainid) {
             account = account.filter(a => a.domainid === this.form.domainid)
@@ -831,7 +831,7 @@ export default {
     },
     fetchHypervisors () {
       return new Promise((resolve, reject) => {
-        api('listHypervisors').then(json => {
+        getAPI('listHypervisors').then(json => {
           const hypervisor = json.listhypervisorsresponse.hypervisor.map(a => { return { id: a.name, name: a.name } })
           resolve({
             type: 'hypervisor',
@@ -844,7 +844,7 @@ export default {
     },
     fetchImageStores (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listImageStores', { listAll: true, showicon: true, keyword: searchKeyword }).then(json => {
+        getAPI('listImageStores', { listAll: true, showicon: true, keyword: searchKeyword }).then(json => {
           const imageStore = json.listimagestoresresponse.imagestore
           resolve({
             type: 'imagestoreid',
@@ -857,7 +857,7 @@ export default {
     },
     fetchStoragePools (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listStoragePools', { listAll: true, showicon: true, keyword: searchKeyword }).then(json => {
+        getAPI('listStoragePools', { listAll: true, showicon: true, keyword: searchKeyword }).then(json => {
           const storagePool = json.liststoragepoolsresponse.storagepool
           resolve({
             type: 'storageid',
@@ -870,7 +870,7 @@ export default {
     },
     fetchPods (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listPods', { keyword: searchKeyword }).then(json => {
+        getAPI('listPods', { keyword: searchKeyword }).then(json => {
           const pods = json.listpodsresponse.pod
           resolve({
             type: 'podid',
@@ -883,7 +883,7 @@ export default {
     },
     fetchClusters (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listClusters', { keyword: searchKeyword }).then(json => {
+        getAPI('listClusters', { keyword: searchKeyword }).then(json => {
           const clusters = json.listclustersresponse.cluster
           resolve({
             type: 'clusterid',
@@ -896,7 +896,7 @@ export default {
     },
     fetchInstanceGroups (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listInstanceGroups', { listAll: true, keyword: searchKeyword }).then(json => {
+        getAPI('listInstanceGroups', { listAll: true, keyword: searchKeyword }).then(json => {
           const instancegroups = json.listinstancegroupsresponse.instancegroup
           resolve({
             type: 'groupid',
@@ -909,7 +909,7 @@ export default {
     },
     fetchServiceOfferings (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listServiceOfferings', { listAll: true, keyword: searchKeyword }).then(json => {
+        getAPI('listServiceOfferings', { listAll: true, keyword: searchKeyword }).then(json => {
           const serviceOfferings = json.listserviceofferingsresponse.serviceoffering
           resolve({
             type: 'serviceofferingid',
@@ -922,7 +922,7 @@ export default {
     },
     fetchDiskOfferings (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listDiskOfferings', { listAll: true, keyword: searchKeyword }).then(json => {
+        getAPI('listDiskOfferings', { listAll: true, keyword: searchKeyword }).then(json => {
           const diskOfferings = json.listdiskofferingsresponse.diskoffering
           resolve({
             type: 'diskofferingid',
@@ -935,7 +935,7 @@ export default {
     },
     fetchNetworks (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listNetworks', { listAll: true, keyword: searchKeyword }).then(json => {
+        getAPI('listNetworks', { listAll: true, keyword: searchKeyword }).then(json => {
           const networks = json.listnetworksresponse.network
           resolve({
             type: 'networkid',
@@ -956,7 +956,7 @@ export default {
         })
       } else {
         return new Promise((resolve, reject) => {
-          api('listAlertTypes').then(json => {
+          getAPI('listAlertTypes').then(json => {
             const alerttypes = json.listalerttypesresponse.alerttype.map(a => { return { id: a.alerttypeid, name: a.name } })
             this.alertTypes = alerttypes
             resolve({
@@ -979,7 +979,7 @@ export default {
         })
       } else {
         return new Promise((resolve, reject) => {
-          api('listAffinityGroupTypes').then(json => {
+          getAPI('listAffinityGroupTypes').then(json => {
             const alerttypes = json.listaffinitygrouptypesresponse.affinityGroupType.map(a => {
               let name = a.type
               if (a.type === 'host anti-affinity') {
@@ -1006,7 +1006,7 @@ export default {
     },
     fetchVolumes (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listvolumes', { listAll: true, isencrypted: searchKeyword }).then(json => {
+        getAPI('listvolumes', { listAll: true, isencrypted: searchKeyword }).then(json => {
           const volumes = json.listvolumesresponse.volume
           resolve({
             type: 'isencrypted',
@@ -1019,7 +1019,7 @@ export default {
     },
     fetchManagementServers (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listManagementServers', { listAll: true, keyword: searchKeyword }).then(json => {
+        getAPI('listManagementServers', { listAll: true, keyword: searchKeyword }).then(json => {
           const managementservers = json.listmanagementserversresponse.managementserver
           resolve({
             type: 'managementserverid',
@@ -1032,7 +1032,7 @@ export default {
     },
     fetchOsCategories (searchKeyword) {
       return new Promise((resolve, reject) => {
-        api('listOsCategories', { showicon: true, keyword: searchKeyword }).then(json => {
+        getAPI('listOsCategories', { showicon: true, keyword: searchKeyword }).then(json => {
           const osCategories = json.listoscategoriesresponse.oscategory
           resolve({
             type: 'oscategoryid',
@@ -1334,7 +1334,7 @@ export default {
     },
     fetchUsageTypes () {
       return new Promise((resolve, reject) => {
-        api('listUsageTypes')
+        getAPI('listUsageTypes')
           .then(json => {
             const usageTypes = json.listusagetypesresponse.usagetype.map(entry => {
               return {
diff --git a/ui/src/components/view/SettingsTab.vue b/ui/src/components/view/SettingsTab.vue
index 1a57b591a4b4..be55d03c4b94 100644
--- a/ui/src/components/view/SettingsTab.vue
+++ b/ui/src/components/view/SettingsTab.vue
@@ -31,7 +31,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import ConfigurationTable from '@/views/setting/ConfigurationTable.vue'
 
@@ -125,7 +125,7 @@ export default {
       if (this.filter) {
         params.keyword = this.filter
       }
-      api('listConfigurations', params).then(response => {
+      getAPI('listConfigurations', params).then(response => {
         this.items = response.listconfigurationsresponse.configuration
       }).catch(error => {
         console.error(error)
diff --git a/ui/src/components/view/StatsTab.vue b/ui/src/components/view/StatsTab.vue
index cf592709da37..8703b6b995de 100644
--- a/ui/src/components/view/StatsTab.vue
+++ b/ui/src/components/view/StatsTab.vue
@@ -249,7 +249,7 @@
   </div>
 </template>
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import moment from 'moment'
 import 'chartjs-adapter-moment'
 import DateTimeFilter from './DateTimeFilter'
@@ -455,7 +455,7 @@ export default {
       if (this.endDate) {
         params.endDate = moment(this.endDate).format()
       }
-      api(this.resourceStatsApi, params).then(response => {
+      getAPI(this.resourceStatsApi, params).then(response => {
         this.handleStatsResponse(response)
       }).catch(error => {
         this.$notifyError(error)
diff --git a/ui/src/components/view/StoragePoolSelectView.vue b/ui/src/components/view/StoragePoolSelectView.vue
index 8f006ed737f6..4dfccfe84e7b 100644
--- a/ui/src/components/view/StoragePoolSelectView.vue
+++ b/ui/src/components/view/StoragePoolSelectView.vue
@@ -96,7 +96,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 export default {
   name: 'VolumeStoragePoolSelector',
@@ -184,7 +184,7 @@ export default {
     fetchStoragePools () {
       this.loading = true
       if (this.suitabilityEnabled) {
-        api('findStoragePoolsForMigration', {
+        getAPI('findStoragePoolsForMigration', {
           id: this.resource.id,
           keyword: this.searchQuery,
           page: this.page,
@@ -207,7 +207,7 @@ export default {
         if (this.clusterId) {
           params.clusterid = this.clusterId
         }
-        api('listStoragePools', params).then(response => {
+        getAPI('listStoragePools', params).then(response => {
           this.storagePools = response.liststoragepoolsresponse.storagepool || []
           this.totalCount = response.liststoragepoolsresponse.count
         }).catch(error => {
diff --git a/ui/src/components/view/TestWebhookDeliveryView.vue b/ui/src/components/view/TestWebhookDeliveryView.vue
index ebebe722e996..c5b29a17e795 100644
--- a/ui/src/components/view/TestWebhookDeliveryView.vue
+++ b/ui/src/components/view/TestWebhookDeliveryView.vue
@@ -88,7 +88,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import Status from '@/components/widgets/Status'
 
@@ -191,7 +191,7 @@ export default {
       if (this.secretKey) {
         params.secretKey = this.secretKey
       }
-      api('executeWebhookDelivery', params).then(response => {
+      postAPI('executeWebhookDelivery', params).then(response => {
         this.response = response.executewebhookdeliveryresponse.webhookdelivery
         this.$emit('update-success', response.success)
       }).catch(error => {
diff --git a/ui/src/components/view/TreeView.vue b/ui/src/components/view/TreeView.vue
index 4564e2bc826a..0307b0974753 100644
--- a/ui/src/components/view/TreeView.vue
+++ b/ui/src/components/view/TreeView.vue
@@ -92,7 +92,7 @@
 
 <script>
 import store from '@/store'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import DetailsTab from '@/components/view/DetailsTab'
 import ResourceView from '@/components/view/ResourceView'
 import ResourceLayout from '@/layouts/ResourceLayout'
@@ -268,7 +268,7 @@ export default {
       }
 
       return new Promise(resolve => {
-        api(this.apiChildren, params).then(json => {
+        postAPI(this.apiChildren, params).then(json => {
           const dataResponse = this.getResponseJsonData(json)
           const dataGenerate = this.generateTreeData(dataResponse)
           treeNode.dataRef.children = dataGenerate
@@ -390,7 +390,7 @@ export default {
       this.treeViewData = []
       this.loadingSearch = true
       this.$emit('change-tree-store', {})
-      api(this.apiList, params).then(json => {
+      postAPI(this.apiList, params).then(json => {
         const listDomains = this.getResponseJsonData(json)
         this.treeVerticalData = this.treeVerticalData.concat(listDomains)
 
@@ -454,7 +454,7 @@ export default {
         params.pageSize = 1
 
         this.detailLoading = true
-        api(apiName, params).then(json => {
+        postAPI(apiName, params).then(json => {
           const jsonResponse = this.getResponseJsonData(json)
           resolve(jsonResponse[0])
         }).catch(() => {
diff --git a/ui/src/components/view/UploadResourceIcon.vue b/ui/src/components/view/UploadResourceIcon.vue
index 9b196852d8a5..3ea61629b825 100644
--- a/ui/src/components/view/UploadResourceIcon.vue
+++ b/ui/src/components/view/UploadResourceIcon.vue
@@ -118,7 +118,7 @@
   </div>
 </template>
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import eventBus from '@/config/eventBus'
 
 export default {
@@ -247,7 +247,7 @@ export default {
         newImage.src = await this.getResourceIcon()
         base64Canvas = await this.getNewImage(newImage)
       }
-      api('uploadResourceIcon', {}, 'POST', {
+      postAPI('uploadResourceIcon', {
         resourceids: resourceid,
         resourcetype: resourceType,
         base64image: base64Canvas
@@ -279,7 +279,7 @@ export default {
     deleteIcon () {
       const resourceType = this.$getResourceType()
       const resourceid = this.resource.id
-      api('deleteResourceIcon', {
+      postAPI('deleteResourceIcon', {
         resourcetype: resourceType,
         resourceids: resourceid
       }).then(json => {
diff --git a/ui/src/components/view/VmwareData.vue b/ui/src/components/view/VmwareData.vue
index efb921df5f30..e978fbb29da7 100644
--- a/ui/src/components/view/VmwareData.vue
+++ b/ui/src/components/view/VmwareData.vue
@@ -35,7 +35,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 export default {
   props: {
@@ -65,7 +65,7 @@ export default {
   methods: {
     fetchData () {
       if (!this.resource.id) return
-      api('listVmwareDcs', {
+      getAPI('listVmwareDcs', {
         zoneid: this.resource.id
       }).then(response => {
         if (response.listvmwaredcsresponse.VMwareDC && response.listvmwaredcsresponse.VMwareDC.length > 0) {
diff --git a/ui/src/components/view/VolumesTab.vue b/ui/src/components/view/VolumesTab.vue
index 7805e5b8d87f..ff4ce5b09bb7 100644
--- a/ui/src/components/view/VolumesTab.vue
+++ b/ui/src/components/view/VolumesTab.vue
@@ -49,7 +49,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -132,7 +132,7 @@ export default {
       }
     },
     getVolumes () {
-      api('listVolumes', { listall: true, listsystemvms: true, virtualmachineid: this.vm.id }).then(json => {
+      getAPI('listVolumes', { listall: true, listsystemvms: true, virtualmachineid: this.vm.id }).then(json => {
         this.volumes = json.listvolumesresponse.volume
         if (this.volumes) {
           this.volumes.sort((a, b) => { return a.deviceid - b.deviceid })
diff --git a/ui/src/components/view/WebhookDeliveriesTab.vue b/ui/src/components/view/WebhookDeliveriesTab.vue
index c13b0453254a..be4993ce14b5 100644
--- a/ui/src/components/view/WebhookDeliveriesTab.vue
+++ b/ui/src/components/view/WebhookDeliveriesTab.vue
@@ -112,7 +112,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin } from '@/role'
 import { genericCompare } from '@/utils/sort.js'
 import moment from 'moment'
@@ -253,7 +253,7 @@ export default {
         params.eventtype = this.searchParams.eventtype
       }
       this.tabLoading = true
-      api('listWebhookDeliveries', params).then(json => {
+      getAPI('listWebhookDeliveries', params).then(json => {
         this.deliveries = []
         this.totalCount = json?.listwebhookdeliveriesresponse?.count || 0
         this.deliveries = json?.listwebhookdeliveriesresponse?.webhookdelivery || []
@@ -321,7 +321,7 @@ export default {
           id: id
         }
         promises.push(new Promise((resolve, reject) => {
-          api('deleteWebhookDelivery', params).then(json => {
+          postAPI('deleteWebhookDelivery', params).then(json => {
             return resolve(id)
           }).catch(error => {
             return reject(error)
@@ -344,7 +344,7 @@ export default {
         webhookid: this.resource.id
       }
       this.tabLoading = true
-      api('deleteWebhookDelivery', params).then(json => {
+      postAPI('deleteWebhookDelivery', params).then(json => {
         this.$message.success(this.$t('message.success.clear.webhook.deliveries'))
         this.fetchData()
       }).catch(error => {
@@ -370,7 +370,7 @@ export default {
         id: item.id
       }
       this.tabLoading = true
-      api('executeWebhookDelivery', params).then(json => {
+      postAPI('executeWebhookDelivery', params).then(json => {
         this.$message.success(this.$t('message.success.redeliver.webhook.delivery'))
         this.fetchData()
       }).catch(error => {
@@ -396,7 +396,7 @@ export default {
         id: item.id
       }
       this.tabLoading = true
-      api('deleteWebhookDelivery', params).then(json => {
+      postAPI('deleteWebhookDelivery', params).then(json => {
         const message = `${this.$t('message.success.delete')} ${this.$t('label.webhook.delivery')}`
         this.$message.success(message)
         this.fetchData()
diff --git a/ui/src/components/widgets/Console.vue b/ui/src/components/widgets/Console.vue
index 6c16c7546a7c..e348a25bb215 100644
--- a/ui/src/components/widgets/Console.vue
+++ b/ui/src/components/widgets/Console.vue
@@ -28,7 +28,7 @@
 
 <script>
 import { SERVER_MANAGER } from '@/store/mutation-types'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'Console',
@@ -52,7 +52,7 @@ export default {
     consoleUrl () {
       const params = {}
       params.virtualmachineid = this.resource.id
-      api('createConsoleEndpoint', params).then(json => {
+      postAPI('createConsoleEndpoint', params).then(json => {
         this.url = (json && json.createconsoleendpointresponse) ? json.createconsoleendpointresponse.consoleendpoint.url : '#/exception/404'
         if (json.createconsoleendpointresponse.consoleendpoint.success) {
           if (this.copyUrlToClipboard) {
diff --git a/ui/src/components/widgets/InfiniteScrollSelect.vue b/ui/src/components/widgets/InfiniteScrollSelect.vue
index f97faf390f84..d7958c60168d 100644
--- a/ui/src/components/widgets/InfiniteScrollSelect.vue
+++ b/ui/src/components/widgets/InfiniteScrollSelect.vue
@@ -88,7 +88,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
 export default {
@@ -191,7 +191,7 @@ export default {
       if (this.showIcon) {
         params.showicon = true
       }
-      api(this.api, params).then(json => {
+      postAPI(this.api, params).then(json => {
         const response = json[this.api.toLowerCase() + 'response'] || {}
         if (this.totalCount === null) {
           this.totalCount = response.count || 0
diff --git a/ui/src/components/widgets/OsLogo.vue b/ui/src/components/widgets/OsLogo.vue
index b3afa1ad4410..643953012c18 100644
--- a/ui/src/components/widgets/OsLogo.vue
+++ b/ui/src/components/widgets/OsLogo.vue
@@ -29,7 +29,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 export default {
   name: 'OsLogo',
@@ -79,7 +79,7 @@ export default {
         return
       }
       this.name = 'linux'
-      api('listOsTypes', { id: osId }).then(json => {
+      getAPI('listOsTypes', { id: osId }).then(json => {
         if (json && json.listostypesresponse && json.listostypesresponse.ostype && json.listostypesresponse.ostype.length > 0) {
           this.discoverOsLogo(json.listostypesresponse.ostype[0].description)
         } else {
diff --git a/ui/src/store/modules/user.js b/ui/src/store/modules/user.js
index 6fa3ce1b10aa..ffa0c2b136ec 100644
--- a/ui/src/store/modules/user.js
+++ b/ui/src/store/modules/user.js
@@ -23,7 +23,7 @@ import semver from 'semver'
 import { vueProps } from '@/vue-app'
 import router from '@/router'
 import store from '@/store'
-import { oauthlogin, login, logout, api } from '@/api'
+import { oauthlogin, login, logout, getAPI } from '@/api'
 import { i18n } from '@/locales'
 import { axios } from '../../utils/request'
 import { getParsedVersion } from '@/utils/util'
@@ -331,7 +331,7 @@ const user = {
           commit('SET_MS_ID', msId)
 
           // Ensuring we get the user info so that store.getters.user is never empty when the page is freshly loaded
-          api('listUsers', { id: Cookies.get('userid'), listall: true }).then(response => {
+          getAPI('listUsers', { id: Cookies.get('userid'), listall: true }).then(response => {
             const result = response.listusersresponse.user[0]
             commit('SET_INFO', result)
             commit('SET_NAME', result.firstname + ' ' + result.lastname)
@@ -342,13 +342,13 @@ const user = {
           })
         } else if (store.getters.loginFlag) {
           const hide = message.loading(i18n.global.t('message.discovering.feature'), 0)
-          api('listZones').then(json => {
+          getAPI('listZones').then(json => {
             const zones = json.listzonesresponse.zone || []
             commit('SET_ZONES', zones)
           }).catch(error => {
             reject(error)
           })
-          api('listApis').then(response => {
+          getAPI('listApis').then(response => {
             const apis = {}
             const apiList = response.listapisresponse.api
             for (var idx = 0; idx < apiList.length; idx++) {
@@ -375,7 +375,7 @@ const user = {
             reject(error)
           })
 
-          api('listNetworks', { restartrequired: true, forvpc: false }).then(response => {
+          getAPI('listNetworks', { restartrequired: true, forvpc: false }).then(response => {
             if (response.listnetworksresponse.count > 0) {
               store.dispatch('AddHeaderNotice', {
                 key: 'NETWORK_RESTART_REQUIRED',
@@ -389,7 +389,7 @@ const user = {
             }
           }).catch(ignored => {})
 
-          api('listVPCs', { restartrequired: true }).then(response => {
+          getAPI('listVPCs', { restartrequired: true }).then(response => {
             if (response.listvpcsresponse.count > 0) {
               store.dispatch('AddHeaderNotice', {
                 key: 'VPC_RESTART_REQUIRED',
@@ -404,7 +404,7 @@ const user = {
           }).catch(ignored => {})
         }
 
-        api('listUsers', { id: Cookies.get('userid'), showicon: true }).then(response => {
+        getAPI('listUsers', { id: Cookies.get('userid'), showicon: true }).then(response => {
           const result = response.listusersresponse.user[0]
           commit('SET_INFO', result)
           commit('SET_NAME', result.firstname + ' ' + result.lastname)
@@ -414,7 +414,7 @@ const user = {
           reject(error)
         })
 
-        api(
+        getAPI(
           'listNetworkServiceProviders',
           { name: 'SecurityGroupProvider', state: 'Enabled' }
         ).then(response => {
@@ -423,7 +423,7 @@ const user = {
         }).catch(ignored => {
         })
 
-        api('listCapabilities').then(response => {
+        getAPI('listCapabilities').then(response => {
           const result = response.listcapabilitiesresponse.capability
           commit('SET_FEATURES', result)
           if (result && result.defaultuipagesize) {
@@ -439,14 +439,14 @@ const user = {
           reject(error)
         })
 
-        api('listLdapConfigurations').then(response => {
+        getAPI('listLdapConfigurations').then(response => {
           const ldapEnable = (response.ldapconfigurationresponse.count > 0)
           commit('SET_LDAP', ldapEnable)
         }).catch(error => {
           reject(error)
         })
 
-        api('cloudianIsEnabled').then(response => {
+        getAPI('cloudianIsEnabled').then(response => {
           const cloudian = response.cloudianisenabledresponse.cloudianisenabled || {}
           commit('SET_CLOUDIAN', cloudian)
         }).catch(ignored => {
@@ -519,7 +519,7 @@ const user = {
     },
     ProjectView ({ commit }, projectid) {
       return new Promise((resolve, reject) => {
-        api('listApis', { projectid: projectid }).then(response => {
+        getAPI('listApis', { projectid: projectid }).then(response => {
           const apis = {}
           const apiList = response.listapisresponse.api
           for (var idx = 0; idx < apiList.length; idx++) {
@@ -544,7 +544,7 @@ const user = {
     },
     RefreshFeatures ({ commit }) {
       return new Promise((resolve, reject) => {
-        api('listCapabilities').then(response => {
+        getAPI('listCapabilities').then(response => {
           const result = response.listcapabilitiesresponse.capability
           resolve(result)
           commit('SET_FEATURES', result)
@@ -552,7 +552,7 @@ const user = {
           reject(error)
         })
 
-        api('listConfigurations', { name: 'hypervisor.custom.display.name' }).then(json => {
+        getAPI('listConfigurations', { name: 'hypervisor.custom.display.name' }).then(json => {
           if (json.listconfigurationsresponse.configuration !== null) {
             const config = json.listconfigurationsresponse.configuration[0]
             commit('SET_CUSTOM_HYPERVISOR_NAME', config.value)
@@ -564,7 +564,7 @@ const user = {
     },
     UpdateConfiguration ({ commit }) {
       return new Promise((resolve, reject) => {
-        api('listLdapConfigurations').then(response => {
+        getAPI('listLdapConfigurations').then(response => {
           const ldapEnable = (response.ldapconfigurationresponse.count > 0)
           commit('SET_LDAP', ldapEnable)
         }).catch(error => {
diff --git a/ui/src/utils/plugins.js b/ui/src/utils/plugins.js
index de8e3975787a..a8b9b54fc9ec 100644
--- a/ui/src/utils/plugins.js
+++ b/ui/src/utils/plugins.js
@@ -17,7 +17,7 @@
 
 import _ from 'lodash'
 import { i18n } from '@/locales'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { message, notification, Modal } from 'ant-design-vue'
 import eventBus from '@/config/eventBus'
 import store from '@/store'
@@ -88,7 +88,7 @@ export const pollJobPlugin = {
       })
 
       options.originalPage = options.originalPage || this.$router.currentRoute.value.path
-      api('queryAsyncJobResult', { jobId }).then(json => {
+      getAPI('queryAsyncJobResult', { jobId }).then(json => {
         const result = json.queryasyncjobresultresponse
         eventBus.emit('update-job-details', { jobId, resourceId })
         if (result.jobstatus === 1) {
diff --git a/ui/src/views/AutogenView.vue b/ui/src/views/AutogenView.vue
index e29fa0f20974..3199b0cdeeb2 100644
--- a/ui/src/views/AutogenView.vue
+++ b/ui/src/views/AutogenView.vue
@@ -457,7 +457,7 @@
 <script>
 import { ref, reactive, toRaw, h } from 'vue'
 import { Button } from 'ant-design-vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import { genericCompare } from '@/utils/sort.js'
 import { sourceToken } from '@/utils/request'
@@ -731,7 +731,7 @@ export default {
       if (!projectId || !projectId.length || projectId.length !== 36) {
         return
       }
-      api('listProjects', { id: projectId, listall: true, details: 'min' }).then(json => {
+      getAPI('listProjects', { id: projectId, listall: true, details: 'min' }).then(json => {
         if (!json || !json.listprojectsresponse || !json.listprojectsresponse.project) return
         const projects = json.listprojectsresponse.project
         const project = json.listprojectsresponse.project[0]
@@ -988,7 +988,7 @@ export default {
         delete params.listall
       }
 
-      api(this.apiName, params).then(json => {
+      postAPI(this.apiName, params).then(json => {
         var responseName
         var objectName
         for (const key in json) {
@@ -1019,7 +1019,7 @@ export default {
         this.itemCount = apiItemCount
 
         if (this.dataView && this.$route.path.includes('/zone/') && 'listVmwareDcs' in this.$store.getters.apis) {
-          api('listVmwareDcs', { zoneid: this.items[0].id }).then(response => {
+          getAPI('listVmwareDcs', { zoneid: this.items[0].id }).then(response => {
             this.items[0].vmwaredc = response.listvmwaredcsresponse.VMwareDC
           })
         }
@@ -1318,7 +1318,7 @@ export default {
       if (showIcon) {
         params.showicon = true
       }
-      api(possibleApi, params).then(json => {
+      postAPI(possibleApi, params).then(json => {
         param.loading = false
         for (const obj in json) {
           if (obj.includes('response')) {
@@ -1488,7 +1488,7 @@ export default {
     callGroupApi (params, resourceName) {
       return new Promise((resolve, reject) => {
         const action = this.currentAction
-        api(action.api, params).then(json => {
+        postAPI(action.api, params).then(json => {
           resolve(this.handleResponse(json, resourceName, this.getDataIdentifier(params), action, false))
           this.closeAction()
         }).catch(error => {
@@ -1653,13 +1653,8 @@ export default {
 
         var hasJobId = false
         this.actionLoading = true
-        let args = null
-        if (action.post) {
-          args = [action.api, {}, 'POST', params]
-        } else {
-          args = [action.api, params]
-        }
-        api(...args).then(json => {
+        const args = [action.api, params]
+        postAPI(...args).then(json => {
           var response = this.handleResponse(json, resourceName, this.getDataIdentifier(params), action)
           if (!response) {
             this.fetchData()
diff --git a/ui/src/views/auth/ForgotPassword.vue b/ui/src/views/auth/ForgotPassword.vue
index 87f2d1d0c33e..78af0c3d9f17 100644
--- a/ui/src/views/auth/ForgotPassword.vue
+++ b/ui/src/views/auth/ForgotPassword.vue
@@ -98,7 +98,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import store from '@/store'
 import { SERVER_MANAGER } from '@/store/mutation-types'
 import TranslationMenu from '@/components/header/TranslationMenu'
@@ -159,7 +159,7 @@ export default {
         if (!loginParams.domain) {
           loginParams.domain = '/'
         }
-        api('forgotPassword', {}, 'POST', loginParams)
+        postAPI('forgotPassword', loginParams)
           .finally(() => {
             this.$message.success(this.$t('message.forgot.password.success'))
             this.$router.push({ path: '/login' }).catch(() => {})
diff --git a/ui/src/views/auth/Login.vue b/ui/src/views/auth/Login.vue
index e918e8a69ed4..a3a20428f0b1 100644
--- a/ui/src/views/auth/Login.vue
+++ b/ui/src/views/auth/Login.vue
@@ -196,7 +196,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import store from '@/store'
 import { mapActions } from 'vuex'
 import { sourceToken } from '@/utils/request'
@@ -286,7 +286,7 @@ export default {
       }
     },
     fetchData () {
-      api('listIdps').then(response => {
+      getAPI('listIdps').then(response => {
         if (response) {
           this.idps = response.listidpsresponse.idp || []
           this.idps.sort(function (a, b) {
@@ -297,7 +297,7 @@ export default {
           this.form.idp = this.idps[0].id || ''
         }
       })
-      api('listOauthProvider', {}).then(response => {
+      getAPI('listOauthProvider', {}).then(response => {
         if (response) {
           const oauthproviders = response.listoauthproviderresponse.oauthprovider || []
           oauthproviders.forEach(item => {
@@ -315,7 +315,7 @@ export default {
           this.socialLogin = this.googleprovider || this.githubprovider
         }
       })
-      api('forgotPassword', {}).then(response => {
+      postAPI('forgotPassword', {}).then(response => {
         this.forgotPasswordEnabled = response.forgotpasswordresponse.enabled
       }).catch((err) => {
         if (err?.response?.data === null) {
diff --git a/ui/src/views/auth/ResetPassword.vue b/ui/src/views/auth/ResetPassword.vue
index 0250e60008ac..a834dd859b69 100644
--- a/ui/src/views/auth/ResetPassword.vue
+++ b/ui/src/views/auth/ResetPassword.vue
@@ -124,7 +124,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import store from '@/store'
 import { SERVER_MANAGER } from '@/store/mutation-types'
 import TranslationMenu from '@/components/header/TranslationMenu'
@@ -200,7 +200,7 @@ export default {
           loginParams.domain = '/'
         }
 
-        api('resetPassword', {}, 'POST', loginParams)
+        postAPI('resetPassword', loginParams)
           .then((res) => {
             if (res?.resetpasswordresponse?.success) {
               this.$message.success(this.$t('message.password.reset.success'))
diff --git a/ui/src/views/compute/AssignInstance.vue b/ui/src/views/compute/AssignInstance.vue
index 873d10f57704..274c68cd7024 100644
--- a/ui/src/views/compute/AssignInstance.vue
+++ b/ui/src/views/compute/AssignInstance.vue
@@ -65,7 +65,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import OwnershipSelection from '@views/compute/wizard/OwnershipSelection'
 
@@ -120,7 +120,7 @@ export default {
         params.account = this.selectedAccount
         params.ignoreproject = true
       }
-      api('listNetworks', params).then(response => {
+      getAPI('listNetworks', params).then(response => {
         this.networks = response.listnetworksresponse.network || []
       }).catch(error => {
         this.$notifyError(error)
@@ -154,7 +154,7 @@ export default {
       }
 
       this.loading = true
-      api('assignVirtualMachine', {
+      postAPI('assignVirtualMachine', {
         response: 'json',
         virtualmachineid: this.resource.id,
         domainid: this.selectedDomain,
diff --git a/ui/src/views/compute/AttachIso.vue b/ui/src/views/compute/AttachIso.vue
index ba542195ba68..9a1bcb50a42f 100644
--- a/ui/src/views/compute/AttachIso.vue
+++ b/ui/src/views/compute/AttachIso.vue
@@ -55,7 +55,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import _ from 'lodash'
 
 export default {
@@ -110,7 +110,7 @@ export default {
         isofilter: isoFilter
       }
       return new Promise((resolve, reject) => {
-        api('listIsos', params).then((response) => {
+        getAPI('listIsos', params).then((response) => {
           const isos = response.listisosresponse.iso || []
           this.isos.push(...isos)
           resolve(response)
@@ -138,7 +138,7 @@ export default {
 
         this.loading = true
         const title = this.$t('label.action.attach.iso')
-        api('attachIso', params).then(json => {
+        postAPI('attachIso', params).then(json => {
           const jobId = json.attachisoresponse.jobid
           if (jobId) {
             this.$pollJob({
diff --git a/ui/src/views/compute/AutoScaleDownPolicyTab.vue b/ui/src/views/compute/AutoScaleDownPolicyTab.vue
index 422d1ab1122a..4cd32168cae3 100644
--- a/ui/src/views/compute/AutoScaleDownPolicyTab.vue
+++ b/ui/src/views/compute/AutoScaleDownPolicyTab.vue
@@ -323,7 +323,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -425,7 +425,7 @@ export default {
   methods: {
     fetchInitData () {
       this.loading = true
-      api('listAutoScaleVmGroups', {
+      getAPI('listAutoScaleVmGroups', {
         listAll: true,
         id: this.resource.id
       }).then(response => {
@@ -437,12 +437,12 @@ export default {
           this.policy = this.policies?.[0]
           this.selectedPolicyId = this.policy.id
         }
-        api('listLoadBalancerRules', {
+        getAPI('listLoadBalancerRules', {
           listAll: true,
           id: lbruleid
         }).then(response => {
           const networkid = response.listloadbalancerrulesresponse?.loadbalancerrule?.[0]?.networkid
-          api('listNetworks', {
+          getAPI('listNetworks', {
             listAll: true,
             projectid: this.resource.projectid,
             id: networkid
@@ -450,7 +450,7 @@ export default {
             const services = response.listnetworksresponse?.network?.[0]?.service
             const index = services.map(svc => { return svc.name }).indexOf('Lb')
             const provider = services[index].provider[0].name
-            api('listCounters', {
+            getAPI('listCounters', {
               listAll: true,
               provider: provider
             }).then(response => {
@@ -464,7 +464,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('listAutoScalePolicies', {
+      getAPI('listAutoScalePolicies', {
         listAll: true,
         id: this.selectedPolicyId
       }).then(response => {
@@ -507,7 +507,7 @@ export default {
     async pollJob (jobId) {
       return new Promise(resolve => {
         const asyncJobInterval = setInterval(() => {
-          api('queryAsyncJobResult', { jobId }).then(async json => {
+          getAPI('queryAsyncJobResult', { jobId }).then(async json => {
             const result = json.queryasyncjobresultresponse
             if (result.jobstatus === 0) {
               return
@@ -522,7 +522,7 @@ export default {
     addCondition (params) {
       this.loading = true
       return new Promise((resolve, reject) => {
-        api('createCondition', params).then(async json => {
+        postAPI('createCondition', params).then(async json => {
           this.$pollJob({
             jobId: json.conditionresponse.jobid,
             successMethod: (result) => {
@@ -543,7 +543,7 @@ export default {
     deleteCondition (conditionId) {
       this.loading = true
       return new Promise((resolve, reject) => {
-        api('deleteCondition', { id: conditionId }).then(response => {
+        postAPI('deleteCondition', { id: conditionId }).then(response => {
           const jobId = response.deleteconditionresponse.jobid
           this.$pollJob({
             title: this.$t('label.action.delete.condition'),
@@ -587,7 +587,7 @@ export default {
       }
 
       this.updateConditionModalLoading = true
-      api('updateCondition', {
+      postAPI('updateCondition', {
         id: this.selectedCondition.id,
         relationaloperator: this.updateConditionDetails.relationaloperator,
         threshold: this.updateConditionDetails.threshold
@@ -726,7 +726,7 @@ export default {
     createAutoScalePolicy (params) {
       this.loading = true
       return new Promise((resolve, reject) => {
-        api('createAutoScalePolicy', params).then(async json => {
+        postAPI('createAutoScalePolicy', params).then(async json => {
           this.$pollJob({
             jobId: json.autoscalepolicyresponse.jobid,
             successMethod: (result) => {
@@ -760,7 +760,7 @@ export default {
       }
 
       return new Promise((resolve, reject) => {
-        api('updateAutoScalePolicy', {
+        postAPI('updateAutoScalePolicy', {
           id: this.policy.id,
           name: this.policy.name,
           duration: this.policy.duration,
@@ -790,7 +790,7 @@ export default {
       this.loading = true
 
       return new Promise((resolve, reject) => {
-        api('updateAutoScaleVmGroup', params).then(response => {
+        postAPI('updateAutoScaleVmGroup', params).then(response => {
           this.$pollJob({
             jobId: response.updateautoscalevmgroupresponse.jobid,
             successMethod: (result) => {
diff --git a/ui/src/views/compute/AutoScaleLoadBalancing.vue b/ui/src/views/compute/AutoScaleLoadBalancing.vue
index 6091689bd356..a24e92826183 100644
--- a/ui/src/views/compute/AutoScaleLoadBalancing.vue
+++ b/ui/src/views/compute/AutoScaleLoadBalancing.vue
@@ -297,7 +297,7 @@
 
 <script>
 import { ref, reactive, toRaw, nextTick } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
@@ -445,7 +445,7 @@ export default {
     fetchListTiers () {
       this.tiers.loading = true
 
-      api('listNetworks', {
+      getAPI('listNetworks', {
         account: this.resource.account,
         domainid: this.resource.domainid,
         supportedservices: 'Lb',
@@ -462,7 +462,7 @@ export default {
       this.lbRules = []
       this.stickinessPolicies = []
 
-      api('listLoadBalancerRules', {
+      getAPI('listLoadBalancerRules', {
         listAll: true,
         id: this.resource.lbruleid,
         page: this.page,
@@ -488,7 +488,7 @@ export default {
     fetchLBRuleInstances () {
       for (const rule of this.lbRules) {
         this.loading = true
-        api('listLoadBalancerRuleInstances', {
+        getAPI('listLoadBalancerRuleInstances', {
           listAll: true,
           lbvmips: true,
           id: rule.id
@@ -504,7 +504,7 @@ export default {
     fetchLBStickinessPolicies () {
       this.loading = true
       this.lbRules.forEach(rule => {
-        api('listLBStickinessPolicies', {
+        getAPI('listLBStickinessPolicies', {
           listAll: true,
           lbruleid: rule.id
         }).then(response => {
@@ -519,7 +519,7 @@ export default {
     fetchAutoScaleVMgroups () {
       this.loading = true
       this.lbRules.forEach(rule => {
-        api('listAutoScaleVmGroups', {
+        getAPI('listAutoScaleVmGroups', {
           listAll: true,
           lbruleid: rule.id
         }).then(response => {
@@ -565,7 +565,7 @@ export default {
       this.tagsModalVisible = true
       this.tags = []
       this.selectedRule = id
-      api('listTags', {
+      getAPI('listTags', {
         resourceId: id,
         resourceType: 'LoadBalancer',
         listAll: true
@@ -586,7 +586,7 @@ export default {
         const formRaw = toRaw(this.form)
         const values = this.handleRemoveFields(formRaw)
 
-        api('createTags', {
+        postAPI('createTags', {
           'tags[0].key': values.key,
           'tags[0].value': values.value,
           resourceIds: this.selectedRule,
@@ -623,7 +623,7 @@ export default {
     },
     handleDeleteTag (tag) {
       this.tagsModalLoading = true
-      api('deleteTags', {
+      postAPI('deleteTags', {
         'tags[0].key': tag.key,
         'tags[0].value': tag.value,
         resourceIds: tag.resourceid,
@@ -682,7 +682,7 @@ export default {
       }
     },
     handleAddStickinessPolicy (data, values) {
-      api('createLBStickinessPolicy', {
+      postAPI('createLBStickinessPolicy', {
         ...data,
         lbruleid: this.selectedRule,
         name: values.name,
@@ -719,7 +719,7 @@ export default {
     },
     handleDeleteStickinessPolicy () {
       this.stickinessModalLoading = true
-      api('deleteLBStickinessPolicy', { id: this.selectedStickinessPolicy.id }).then(response => {
+      postAPI('deleteLBStickinessPolicy', { id: this.selectedStickinessPolicy.id }).then(response => {
         this.$pollJob({
           jobId: response.deleteLBstickinessrruleresponse.jobid,
           successMessage: this.$t('message.success.remove.sticky.policy'),
@@ -803,7 +803,7 @@ export default {
     },
     handleDeleteInstanceFromRule (instance, rule, ip) {
       this.loading = true
-      api('removeFromLoadBalancerRule', {
+      postAPI('removeFromLoadBalancerRule', {
         id: rule.id,
         'vmidipmap[0].vmid': instance.loadbalancerruleinstance.id,
         'vmidipmap[0].vmip': ip
@@ -840,7 +840,7 @@ export default {
       if (this.editRuleModalLoading) return
       this.loading = true
       this.editRuleModalLoading = true
-      api('updateLoadBalancerRule', {
+      postAPI('updateLoadBalancerRule', {
         ...this.editRuleDetails,
         id: this.selectedRule.id
       }).then(response => {
diff --git a/ui/src/views/compute/AutoScaleUpPolicyTab.vue b/ui/src/views/compute/AutoScaleUpPolicyTab.vue
index 4ddd67a5d0a7..6b5ccf69c45f 100644
--- a/ui/src/views/compute/AutoScaleUpPolicyTab.vue
+++ b/ui/src/views/compute/AutoScaleUpPolicyTab.vue
@@ -323,7 +323,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -425,7 +425,7 @@ export default {
   methods: {
     fetchInitData () {
       this.loading = true
-      api('listAutoScaleVmGroups', {
+      getAPI('listAutoScaleVmGroups', {
         listAll: true,
         id: this.resource.id
       }).then(response => {
@@ -437,12 +437,12 @@ export default {
           this.policy = this.policies?.[0]
           this.selectedPolicyId = this.policy.id
         }
-        api('listLoadBalancerRules', {
+        getAPI('listLoadBalancerRules', {
           listAll: true,
           id: lbruleid
         }).then(response => {
           const networkid = response.listloadbalancerrulesresponse?.loadbalancerrule?.[0]?.networkid
-          api('listNetworks', {
+          getAPI('listNetworks', {
             listAll: true,
             projectid: this.resource.projectid,
             id: networkid
@@ -450,7 +450,7 @@ export default {
             const services = response.listnetworksresponse?.network?.[0]?.service
             const index = services.map(svc => { return svc.name }).indexOf('Lb')
             const provider = services[index].provider[0].name
-            api('listCounters', {
+            getAPI('listCounters', {
               listAll: true,
               provider: provider
             }).then(response => {
@@ -464,7 +464,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('listAutoScalePolicies', {
+      getAPI('listAutoScalePolicies', {
         listAll: true,
         id: this.selectedPolicyId
       }).then(response => {
@@ -507,7 +507,7 @@ export default {
     async pollJob (jobId) {
       return new Promise(resolve => {
         const asyncJobInterval = setInterval(() => {
-          api('queryAsyncJobResult', { jobId }).then(async json => {
+          getAPI('queryAsyncJobResult', { jobId }).then(async json => {
             const result = json.queryasyncjobresultresponse
             if (result.jobstatus === 0) {
               return
@@ -522,7 +522,7 @@ export default {
     addCondition (params) {
       this.loading = true
       return new Promise((resolve, reject) => {
-        api('createCondition', params).then(async json => {
+        postAPI('createCondition', params).then(async json => {
           this.$pollJob({
             jobId: json.conditionresponse.jobid,
             successMethod: (result) => {
@@ -543,7 +543,7 @@ export default {
     deleteCondition (conditionId) {
       this.loading = true
       return new Promise((resolve, reject) => {
-        api('deleteCondition', { id: conditionId }).then(response => {
+        postAPI('deleteCondition', { id: conditionId }).then(response => {
           const jobId = response.deleteconditionresponse.jobid
           this.$pollJob({
             title: this.$t('label.delete.condition'),
@@ -587,7 +587,7 @@ export default {
       }
 
       this.updateConditionModalLoading = true
-      api('updateCondition', {
+      postAPI('updateCondition', {
         id: this.selectedCondition.id,
         relationaloperator: this.updateConditionDetails.relationaloperator,
         threshold: this.updateConditionDetails.threshold
@@ -728,7 +728,7 @@ export default {
     createAutoScalePolicy (params) {
       this.loading = true
       return new Promise((resolve, reject) => {
-        api('createAutoScalePolicy', params).then(async json => {
+        postAPI('createAutoScalePolicy', params).then(async json => {
           this.$pollJob({
             jobId: json.autoscalepolicyresponse.jobid,
             successMethod: (result) => {
@@ -762,7 +762,7 @@ export default {
       }
 
       return new Promise((resolve, reject) => {
-        api('updateAutoScalePolicy', {
+        postAPI('updateAutoScalePolicy', {
           id: this.policy.id,
           name: this.policy.name,
           duration: this.policy.duration,
@@ -792,7 +792,7 @@ export default {
       this.loading = true
 
       return new Promise((resolve, reject) => {
-        api('updateAutoScaleVmGroup', params).then(response => {
+        postAPI('updateAutoScaleVmGroup', params).then(response => {
           this.$pollJob({
             jobId: response.updateautoscalevmgroupresponse.jobid,
             successMethod: (result) => {
diff --git a/ui/src/views/compute/AutoScaleVmProfile.vue b/ui/src/views/compute/AutoScaleVmProfile.vue
index 208fa6a881e9..b0430e8e9aa8 100644
--- a/ui/src/views/compute/AutoScaleVmProfile.vue
+++ b/ui/src/views/compute/AutoScaleVmProfile.vue
@@ -307,7 +307,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin, isAdminOrDomainAdmin } from '@/role'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
@@ -409,7 +409,7 @@ export default {
       this.fetchData()
     },
     fetchUserData () {
-      api('listUsers', {
+      getAPI('listUsers', {
         domainid: this.resource.domainid,
         account: this.resource.account
       }).then(json => {
@@ -427,7 +427,7 @@ export default {
       } else {
         params.templatefilter = 'executable'
       }
-      api('listTemplates', params).then(json => {
+      getAPI('listTemplates', params).then(json => {
         this.templatesList = json.listtemplatesresponse?.template || []
       })
     },
@@ -439,14 +439,14 @@ export default {
       if (isAdminOrDomainAdmin()) {
         params.isrecursive = 'true'
       }
-      api('listServiceOfferings', params).then(json => {
+      getAPI('listServiceOfferings', params).then(json => {
         this.serviceOfferingsList = json.listserviceofferingsresponse?.serviceoffering || []
         this.serviceOfferingsList = this.serviceOfferingsList.filter(offering => !offering.iscustomized)
       })
     },
     fetchData () {
       this.loading = true
-      api('listAutoScaleVmProfiles', {
+      getAPI('listAutoScaleVmProfiles', {
         listAll: true,
         id: this.resource.vmprofileid
       }).then(response => {
@@ -572,7 +572,7 @@ export default {
         params['otherdeployparams[' + j + '].value'] = paramValueToAdd
       }
 
-      api('updateAutoScaleVmProfile', params).then(response => {
+      postAPI('updateAutoScaleVmProfile', params).then(response => {
         this.$pollJob({
           jobId: response.updateautoscalevmprofileresponse.jobid,
           successMethod: (result) => {
@@ -600,7 +600,7 @@ export default {
       const args = params
       const data = {}
 
-      api('updateAutoScaleVmProfile', args, httpMethod, data).then(response => {
+      postAPI('updateAutoScaleVmProfile', args, httpMethod, data).then(response => {
         this.$pollJob({
           jobId: response.updateautoscalevmprofileresponse.jobid,
           successMethod: (result) => {
diff --git a/ui/src/views/compute/BackupScheduleWizard.vue b/ui/src/views/compute/BackupScheduleWizard.vue
index 76095b902f73..a37893d2bc1f 100644
--- a/ui/src/views/compute/BackupScheduleWizard.vue
+++ b/ui/src/views/compute/BackupScheduleWizard.vue
@@ -35,7 +35,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import FormSchedule from '@views/compute/backup/FormSchedule'
 import BackupSchedule from '@views/compute/backup/BackupSchedule'
 
@@ -72,7 +72,7 @@ export default {
       this.dataSource = {}
       this.loading = true
       params.virtualmachineid = this.resource.id
-      api('listBackupSchedule', params).then(json => {
+      getAPI('listBackupSchedule', params).then(json => {
         this.dataSource = json.listbackupscheduleresponse.backupschedule || {}
       }).finally(() => {
         this.loading = false
diff --git a/ui/src/views/compute/ChangeAffinity.vue b/ui/src/views/compute/ChangeAffinity.vue
index 9230db9f163c..a52a2305aa7f 100644
--- a/ui/src/views/compute/ChangeAffinity.vue
+++ b/ui/src/views/compute/ChangeAffinity.vue
@@ -56,7 +56,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { genericCompare } from '@/utils/sort.js'
 
 export default {
@@ -110,7 +110,7 @@ export default {
       this.loading = true
       this.items = []
       this.total = 0
-      api('listAffinityGroups', {
+      getAPI('listAffinityGroups', {
         keyword: this.options.keyword,
         domainid: this.resource.domainid,
         accountid: this.resource.accountid,
@@ -145,7 +145,7 @@ export default {
     handleSubmit () {
       if (this.loading) return
       this.loading = true
-      api('updateVMAffinityGroup', {
+      postAPI('updateVMAffinityGroup', {
         id: this.resource.id,
         affinitygroupids: this.selectedRowKeys.join(',')
       }).then(response => {
diff --git a/ui/src/views/compute/CreateAutoScaleVmGroup.vue b/ui/src/views/compute/CreateAutoScaleVmGroup.vue
index a05a22742ab2..3e635b0711af 100644
--- a/ui/src/views/compute/CreateAutoScaleVmGroup.vue
+++ b/ui/src/views/compute/CreateAutoScaleVmGroup.vue
@@ -1030,7 +1030,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import _ from 'lodash'
 import { mixin, mixinDevice } from '@/utils/mixin.js'
 import store from '@/store'
@@ -1893,7 +1893,7 @@ export default {
         }
         if (!apiName) return resolve(zones)
 
-        api(apiName, params).then(json => {
+        postAPI(apiName, params).then(json => {
           let objectName
           const responseName = [apiName.toLowerCase(), 'response'].join('')
           for (const key in json[responseName]) {
@@ -1961,7 +1961,7 @@ export default {
       this.fetchOptions(param, 'loadbalancers')
     },
     fetchCountersList () {
-      api('listNetworks', {
+      getAPI('listNetworks', {
         listAll: true,
         id: this.defaultNetworkId
       }).then(response => {
@@ -1973,7 +1973,7 @@ export default {
           return
         }
         this.selectedLbProdiver = services[index].provider[0].name
-        api('listCounters', {
+        getAPI('listCounters', {
           listAll: true,
           provider: this.selectedLbProdiver
         }).then(response => {
@@ -1982,7 +1982,7 @@ export default {
       })
     },
     fetchUserData () {
-      api('listUsers', {
+      getAPI('listUsers', {
         domainid: store.getters.project && store.getters.project.id ? null : store.getters.userInfo.domainid,
         account: store.getters.project && store.getters.project.id ? null : store.getters.userInfo.account
       }).then(json => {
@@ -2249,7 +2249,7 @@ export default {
       }
       this.form.userdataid = id
       this.userDataParams = []
-      api('listUserData', { id: id }).then(json => {
+      getAPI('listUserData', { id: id }).then(json => {
         const resp = json?.listuserdataresponse?.userdata || []
         if (resp) {
           var params = resp[0].params
@@ -2272,7 +2272,7 @@ export default {
       }
       this.templateUserDataParams = []
 
-      api('listUserData', { id: id }).then(json => {
+      getAPI('listUserData', { id: id }).then(json => {
         const resp = json?.listuserdataresponse?.userdata || []
         if (resp) {
           var params = resp[0].params
@@ -2298,7 +2298,7 @@ export default {
     async pollJob (jobId) {
       return new Promise(resolve => {
         const asyncJobInterval = setInterval(() => {
-          api('queryAsyncJobResult', { jobId }).then(async json => {
+          getAPI('queryAsyncJobResult', { jobId }).then(async json => {
             const result = json.queryasyncjobresultresponse
             if (result.jobstatus === 0) {
               return
@@ -2381,11 +2381,7 @@ export default {
           j++
         }
 
-        const httpMethod = createVmGroupData.userdata ? 'POST' : 'GET'
-        const args = httpMethod === 'POST' ? {} : params
-        const data = httpMethod === 'POST' ? params : {}
-
-        api('createAutoScaleVmProfile', args, httpMethod, data).then(async json => {
+        postAPI('createAutoScaleVmProfile', params).then(async json => {
           const jobId = json.autoscalevmprofileresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -2411,7 +2407,7 @@ export default {
           relationaloperator: relationaloperator,
           threshold: threshold
         }
-        api('createCondition', params).then(async json => {
+        postAPI('createCondition', params).then(async json => {
           const jobId = json.conditionresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -2439,7 +2435,7 @@ export default {
           quiettime: quiettime,
           conditionids: conditionIds
         }
-        api('createAutoScalePolicy', params).then(async json => {
+        postAPI('createAutoScalePolicy', params).then(async json => {
           const jobId = json.autoscalepolicyresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -2843,7 +2839,7 @@ export default {
           minmembers: values.minmembers,
           interval: values.interval
         }
-        api('createAutoScaleVmGroup', params).then(async response => {
+        postAPI('createAutoScaleVmGroup', params).then(async response => {
           const jobId = response.autoscalevmgroupresponse.jobid
           const result = await this.pollJob(jobId)
           if (result.jobstatus === 2) {
@@ -2899,7 +2895,7 @@ export default {
         const param = this.params.zones
         const args = { showicon: true }
         if (zoneId) args.id = zoneId
-        api(param.list, args).then(json => {
+        postAPI(param.list, args).then(json => {
           const zoneResponse = (json.listzonesresponse.zone || []).filter(item => item.securitygroupsenabled === false)
           if (listZoneAllow && listZoneAllow.length > 0) {
             zoneResponse.map(zone => {
@@ -2931,7 +2927,7 @@ export default {
         if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'dynamicScalingVmConfig', 'hypervisors'].includes(name)) {
           options.listall = true
         }
-        api(param.list, options).then((response) => {
+        postAPI(param.list, options).then((response) => {
           param.loading = false
           _.map(response, (responseItem, responseKey) => {
             if (Object.keys(responseItem).length === 0) {
@@ -3002,7 +2998,7 @@ export default {
       delete args.featured
 
       return new Promise((resolve, reject) => {
-        api('listTemplates', args).then((response) => {
+        getAPI('listTemplates', args).then((response) => {
           resolve(response)
         }).catch((reason) => {
           // ToDo: Handle errors
diff --git a/ui/src/views/compute/CreateKubernetesCluster.vue b/ui/src/views/compute/CreateKubernetesCluster.vue
index 70cd06a20dd3..ac9d3f5fd8ae 100644
--- a/ui/src/views/compute/CreateKubernetesCluster.vue
+++ b/ui/src/views/compute/CreateKubernetesCluster.vue
@@ -430,7 +430,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -574,7 +574,7 @@ export default {
       const params = {}
       this.zoneLoading = true
       params.showicon = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         var listZones = json.listzonesresponse.zone
         if (listZones) {
           listZones = listZones.filter(x => x.allocationstate === 'Enabled')
@@ -606,7 +606,7 @@ export default {
         params.zoneid = this.selectedZone.id
       }
       this.kubernetesVersionLoading = true
-      api('listKubernetesSupportedVersions', params).then(json => {
+      getAPI('listKubernetesSupportedVersions', params).then(json => {
         const versionObjs = json.listkubernetessupportedversionsresponse.kubernetessupportedversion
         if (this.arrayHasItems(versionObjs)) {
           for (var i = 0; i < versionObjs.length; i++) {
@@ -631,7 +631,7 @@ export default {
       this.serviceOfferings = []
       const params = {}
       this.serviceOfferingLoading = true
-      api('listServiceOfferings', params).then(json => {
+      getAPI('listServiceOfferings', params).then(json => {
         var items = json.listserviceofferingsresponse.serviceoffering
         var minCpu = 2
         var minMemory = 2048
@@ -674,7 +674,7 @@ export default {
           forcks: true
         }
         this.templateLoading = true
-        api('listTemplates', params).then(json => {
+        getAPI('listTemplates', params).then(json => {
           var templates = json?.listtemplatesresponse?.template || []
           ckstemplates.push(...templates)
         }).finally(() => {
@@ -690,7 +690,7 @@ export default {
       }
       this.networkLoading = true
       this.networks = []
-      api('listNetworks', params).then(json => {
+      getAPI('listNetworks', params).then(json => {
         var listNetworks = json.listnetworksresponse.network
         if (this.arrayHasItems(listNetworks)) {
           listNetworks = listNetworks.filter(n => n.type !== 'L2')
@@ -707,7 +707,7 @@ export default {
     fetchKeyPairData () {
       const params = {}
       this.keyPairLoading = true
-      api('listSSHKeyPairs', params).then(json => {
+      getAPI('listSSHKeyPairs', params).then(json => {
         const listKeyPairs = json.listsshkeypairsresponse.sshkeypair
         if (this.arrayHasItems(listKeyPairs)) {
           for (var i = 0; i < listKeyPairs.length; i++) {
@@ -730,7 +730,7 @@ export default {
       }
       this.hypervisorLoading = true
 
-      api('listHypervisors', params).then(json => {
+      getAPI('listHypervisors', params).then(json => {
         const listResponse = json.listhypervisorsresponse.hypervisor || []
         if (listResponse) {
           this.selectedZoneHypervisors = listResponse
@@ -747,7 +747,7 @@ export default {
         name: 'cloud.kubernetes.cluster.network.offering'
       }
       this.configLoading = true
-      api('listConfigurations', params).then(json => {
+      getAPI('listConfigurations', params).then(json => {
         if (json.listconfigurationsresponse.configuration !== null) {
           const config = json.listconfigurationsresponse.configuration[0]
           if (config && config.name === params.name) {
@@ -766,7 +766,7 @@ export default {
           name: offeringName
         }
 
-        api('listNetworkOfferings', args).then(json => {
+        getAPI('listNetworkOfferings', args).then(json => {
           const listNetworkOfferings = json.listnetworkofferingsresponse.networkoffering || []
           resolve(listNetworkOfferings)
           this.cksNetworkOffering = listNetworkOfferings[0] || {}
@@ -779,13 +779,13 @@ export default {
       const params = {}
       params.zoneid = this.selectedZone.id
       params.isallocated = false
-      api('listASNumbers', params).then(json => {
+      getAPI('listASNumbers', params).then(json => {
         this.asNumbersZone = json.listasnumbersresponse.asnumber
       })
     },
     fetchCniConfigurations () {
       this.cniConfigLoading = true
-      api('listCniConfiguration', {}).then(
+      getAPI('listCniConfiguration', {}).then(
         response => {
           const listResponse = response.listcniconfigurationresponse.cniconfig || []
           if (listResponse) {
@@ -802,7 +802,7 @@ export default {
       }
       this.form.cniconfigurationid = id
       this.cniConfigParams = []
-      api('listCniConfiguration', { id: id }).then(json => {
+      getAPI('listCniConfiguration', { id: id }).then(json => {
         const resp = json?.listcniconfigurationresponse?.cniconfig || []
         if (resp) {
           var params = resp[0].params
@@ -913,7 +913,7 @@ export default {
           params.asnumber = values.asnumber
         }
 
-        api('createKubernetesCluster', params).then(json => {
+        postAPI('createKubernetesCluster', params).then(json => {
           const jobId = json.createkubernetesclusterresponse.jobid
           this.$pollJob({
             jobId,
diff --git a/ui/src/views/compute/CreateSSHKeyPair.vue b/ui/src/views/compute/CreateSSHKeyPair.vue
index 3b1c5476856a..0fabdaf1eca8 100644
--- a/ui/src/views/compute/CreateSSHKeyPair.vue
+++ b/ui/src/views/compute/CreateSSHKeyPair.vue
@@ -94,7 +94,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -156,7 +156,7 @@ export default {
     fetchDomainData () {
       const params = {}
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         const listdomains = json.listdomainsresponse.domain
         this.domains = this.domains.concat(listdomains)
       }).finally(() => {
@@ -190,7 +190,7 @@ export default {
         }
         if (this.isValidValueForKey(values, 'publickey') && values.publickey.length > 0) {
           params.publickey = values.publickey
-          api('registerSSHKeyPair', params).then(json => {
+          postAPI('registerSSHKeyPair', params).then(json => {
             this.$message.success(this.$t('message.success.register.keypair') + ' ' + values.name)
           }).catch(error => {
             this.$notifyError(error)
@@ -200,7 +200,7 @@ export default {
             this.closeAction()
           })
         } else {
-          api('createSSHKeyPair', params).then(json => {
+          postAPI('createSSHKeyPair', params).then(json => {
             this.$message.success(this.$t('message.success.create.keypair') + ' ' + values.name)
             if (json.createsshkeypairresponse?.keypair?.privatekey) {
               this.isSubmitted = true
diff --git a/ui/src/views/compute/CreateSnapshotWizard.vue b/ui/src/views/compute/CreateSnapshotWizard.vue
index d19208a18085..e320f2d65bf5 100644
--- a/ui/src/views/compute/CreateSnapshotWizard.vue
+++ b/ui/src/views/compute/CreateSnapshotWizard.vue
@@ -78,7 +78,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -124,7 +124,7 @@ export default {
         this.hypervisorSupportsQuiesceVm = true
       }
 
-      api('listVolumes', { virtualMachineId: this.resource.id, listall: true })
+      getAPI('listVolumes', { virtualMachineId: this.resource.id, listall: true })
         .then(json => {
           this.listVolumes = json.listvolumesresponse.volume || []
         })
@@ -155,7 +155,7 @@ export default {
 
         this.loading = true
 
-        api('createSnapshot', params)
+        postAPI('createSnapshot', params)
           .then(json => {
             const jobId = json.createsnapshotresponse.jobid
             if (jobId) {
diff --git a/ui/src/views/compute/DeployVM.vue b/ui/src/views/compute/DeployVM.vue
index 710a4445bbde..c477fde88f24 100644
--- a/ui/src/views/compute/DeployVM.vue
+++ b/ui/src/views/compute/DeployVM.vue
@@ -880,7 +880,7 @@
 <script>
 import { ref, reactive, toRaw, nextTick, h } from 'vue'
 import { Button } from 'ant-design-vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import _ from 'lodash'
 import { mixin, mixinDevice } from '@/utils/mixin.js'
 import store from '@/store'
@@ -1781,7 +1781,7 @@ export default {
         }
         if (!apiName) return resolve(zones)
 
-        api(apiName, params).then(json => {
+        postAPI(apiName, params).then(json => {
           let objectName
           const responseName = [apiName.toLowerCase(), 'response'].join('')
           for (const key in json[responseName]) {
@@ -1879,7 +1879,7 @@ export default {
     },
     fetchInstaceGroups () {
       this.options.instanceGroups = []
-      api('listInstanceGroups', {
+      getAPI('listInstanceGroups', {
         account: this.$store.getters.project?.id ? null : this.$store.getters.userInfo.account,
         domainid: this.$store.getters.project?.id ? null : this.$store.getters.userInfo.domainid,
         listall: true
@@ -2025,7 +2025,7 @@ export default {
 
       this.form.userdataid = id
       this.userDataParams = []
-      api('listUserData', { id: id }).then(json => {
+      getAPI('listUserData', { id: id }).then(json => {
         const resp = json?.listuserdataresponse?.userdata || []
         if (resp[0]) {
           const params = resp[0].params
@@ -2045,7 +2045,7 @@ export default {
       }
       this.templateUserDataParams = []
 
-      api('listUserData', { id: id }).then(json => {
+      getAPI('listUserData', { id: id }).then(json => {
         const resp = json.listuserdataresponse.userdata || []
         if (resp.length > 0) {
           var params = resp[0].params
@@ -2378,11 +2378,7 @@ export default {
           }
         }
 
-        const httpMethod = deployVmData.userdata ? 'POST' : 'GET'
-        const args = httpMethod === 'POST' ? {} : deployVmData
-        const data = httpMethod === 'POST' ? deployVmData : {}
-
-        api('deployVirtualMachine', args, httpMethod, data).then(response => {
+        postAPI('deployVirtualMachine', deployVmData).then(response => {
           const jobId = response.deployvirtualmachineresponse.jobid
           if (jobId) {
             this.$pollJob({
@@ -2479,7 +2475,7 @@ export default {
         const param = this.params.zones
         const args = { showicon: true }
         if (zoneId) args.id = zoneId
-        api(param.list, args).then(json => {
+        postAPI(param.list, args).then(json => {
           const zoneResponse = json.listzonesresponse.zone || []
           if (listZoneAllow && listZoneAllow.length > 0) {
             zoneResponse.map(zone => {
@@ -2511,7 +2507,7 @@ export default {
         if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'dynamicScalingVmConfig', 'hypervisors'].includes(name)) {
           options.listall = true
         }
-        api(param.list, options).then((response) => {
+        postAPI(param.list, options).then((response) => {
           param.loading = false
           _.map(response, (responseItem, responseKey) => {
             if (Object.keys(responseItem).length === 0) {
@@ -2591,7 +2587,7 @@ export default {
       delete args.featured
 
       return new Promise((resolve, reject) => {
-        api('listTemplates', args).then((response) => {
+        getAPI('listTemplates', args).then((response) => {
           resolve(response)
         }).catch((reason) => {
           // ToDo: Handle errors
@@ -2625,7 +2621,7 @@ export default {
       delete args.featured
 
       return new Promise((resolve, reject) => {
-        api('listIsos', args).then((response) => {
+        getAPI('listIsos', args).then((response) => {
           resolve(response)
         }).catch((reason) => {
           // ToDo: Handle errors
diff --git a/ui/src/views/compute/DeployVnfAppliance.vue b/ui/src/views/compute/DeployVnfAppliance.vue
index 4c971788b774..19939634259d 100644
--- a/ui/src/views/compute/DeployVnfAppliance.vue
+++ b/ui/src/views/compute/DeployVnfAppliance.vue
@@ -836,7 +836,7 @@
 
 <script>
 import { ref, reactive, toRaw, nextTick } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import _ from 'lodash'
 import { mixin, mixinDevice } from '@/utils/mixin.js'
 import store from '@/store'
@@ -1720,7 +1720,7 @@ export default {
         }
         if (!apiName) return resolve(zones)
 
-        api(apiName, params).then(json => {
+        postAPI(apiName, params).then(json => {
           let objectName
           const responseName = [apiName.toLowerCase(), 'response'].join('')
           for (const key in json[responseName]) {
@@ -1817,7 +1817,7 @@ export default {
     },
     fetchInstaceGroups () {
       this.options.instanceGroups = []
-      api('listInstanceGroups', {
+      getAPI('listInstanceGroups', {
         account: this.$store.getters.userInfo.account,
         domainid: this.$store.getters.userInfo.domainid,
         listall: true
@@ -1947,7 +1947,7 @@ export default {
       }
       this.form.userdataid = id
       this.userDataParams = []
-      api('listUserData', { id: id }).then(json => {
+      getAPI('listUserData', { id: id }).then(json => {
         const resp = json.listuserdataresponse?.userdata || []
         if (resp.length > 0) {
           var params = resp[0]?.params || null
@@ -1970,7 +1970,7 @@ export default {
       }
       this.templateUserDataParams = []
 
-      api('listUserData', { id: id }).then(json => {
+      getAPI('listUserData', { id: id }).then(json => {
         const resp = json?.listuserdataresponse?.userdata || []
         if (resp) {
           var params = resp[0]?.params || null
@@ -2349,11 +2349,7 @@ export default {
           }
         }
 
-        const httpMethod = createVnfAppData.userdata ? 'POST' : 'GET'
-        const args = httpMethod === 'POST' ? {} : createVnfAppData
-        const data = httpMethod === 'POST' ? createVnfAppData : {}
-
-        api('deployVnfAppliance', args, httpMethod, data).then(response => {
+        postAPI('deployVnfAppliance', createVnfAppData).then(response => {
           const jobId = response.deployvirtualmachineresponse.jobid
           if (jobId) {
             this.$pollJob({
@@ -2450,7 +2446,7 @@ export default {
         const param = this.params.zones
         const args = { showicon: true }
         if (zoneId) args.id = zoneId
-        api(param.list, args).then(json => {
+        postAPI(param.list, args).then(json => {
           const zoneResponse = json.listzonesresponse.zone || []
           if (listZoneAllow && listZoneAllow.length > 0) {
             zoneResponse.map(zone => {
@@ -2482,7 +2478,7 @@ export default {
         if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'dynamicScalingVmConfig', 'hypervisors'].includes(name)) {
           options.listall = true
         }
-        api(param.list, options).then((response) => {
+        postAPI(param.list, options).then((response) => {
           param.loading = false
           _.map(response, (responseItem, responseKey) => {
             if (Object.keys(responseItem).length === 0) {
@@ -2558,7 +2554,7 @@ export default {
       delete args.featured
 
       return new Promise((resolve, reject) => {
-        api('listVnfTemplates', args).then((response) => {
+        getAPI('listVnfTemplates', args).then((response) => {
           resolve(response)
         }).catch((reason) => {
           // ToDo: Handle errors
diff --git a/ui/src/views/compute/DestroyVM.vue b/ui/src/views/compute/DestroyVM.vue
index 13448252fb85..81937809ef41 100644
--- a/ui/src/views/compute/DestroyVM.vue
+++ b/ui/src/views/compute/DestroyVM.vue
@@ -141,7 +141,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import BulkActionProgress from '@/components/view/BulkActionProgress'
 
@@ -228,7 +228,7 @@ export default {
     callListVolume (vmId) {
       return new Promise((resolve) => {
         this.volumes = []
-        api('listVolumes', {
+        getAPI('listVolumes', {
           virtualMachineId: vmId,
           type: 'DATADISK',
           details: 'min',
@@ -304,7 +304,7 @@ export default {
     },
     destroyVM (params) {
       return new Promise((resolve, reject) => {
-        api('destroyVirtualMachine', params).then(json => {
+        postAPI('destroyVirtualMachine', params).then(json => {
           const jobId = json.destroyvirtualmachineresponse.jobid
           return resolve(jobId)
         }).catch(error => {
diff --git a/ui/src/views/compute/EditVM.vue b/ui/src/views/compute/EditVM.vue
index 468b1af3628b..f7b7649b96b2 100644
--- a/ui/src/views/compute/EditVM.vue
+++ b/ui/src/views/compute/EditVM.vue
@@ -156,7 +156,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -243,7 +243,7 @@ export default {
       this.fetchUserData()
     },
     fetchZoneDetails () {
-      api('listZones', {
+      getAPI('listZones', {
         id: this.resource.zoneid
       }).then(response => {
         const zone = response?.listzonesresponse?.zone || []
@@ -252,7 +252,7 @@ export default {
     },
     fetchSecurityGroups () {
       this.securitygroups.loading = true
-      api('listSecurityGroups', {
+      getAPI('listSecurityGroups', {
         zoneid: this.resource.zoneid
       }).then(json => {
         const items = json.listsecuritygroupsresponse.securitygroup || []
@@ -275,7 +275,7 @@ export default {
       params.id = this.resource.serviceofferingid
       params.isrecursive = true
       var apiName = 'listServiceOfferings'
-      api(apiName, params).then(json => {
+      getAPI(apiName, params).then(json => {
         const offerings = json?.listserviceofferingsresponse?.serviceoffering || []
         this.serviceOffering = offerings[0] || {}
       })
@@ -286,7 +286,7 @@ export default {
       params.isrecursive = true
       params.templatefilter = 'all'
       var apiName = 'listTemplates'
-      api(apiName, params).then(json => {
+      getAPI(apiName, params).then(json => {
         const templateResponses = json.listtemplatesresponse.template
         this.template = templateResponses[0]
       })
@@ -296,7 +296,7 @@ export default {
       params.name = 'enable.dynamic.scale.vm'
       params.zoneid = this.resource.zoneid
       var apiName = 'listConfigurations'
-      api(apiName, params).then(json => {
+      getAPI(apiName, params).then(json => {
         const configResponse = json.listconfigurationsresponse.configuration
         this.dynamicScalingVmConfig = configResponse[0]?.value === 'true'
       })
@@ -307,7 +307,7 @@ export default {
     fetchOsTypes () {
       this.osTypes.loading = true
       this.osTypes.opts = []
-      api('listOsTypes').then(json => {
+      getAPI('listOsTypes').then(json => {
         this.osTypes.opts = json.listostypesresponse.ostype || []
       }).catch(error => {
         this.$notifyError(error)
@@ -325,7 +325,7 @@ export default {
       } else {
         params.account = this.$store.getters.userInfo.account
       }
-      api('listInstanceGroups', params).then(json => {
+      getAPI('listInstanceGroups', params).then(json => {
         const groups = json.listinstancegroupsresponse.instancegroup || []
         groups.forEach(x => {
           this.groups.opts.push({ id: x.name, value: x.name })
@@ -352,7 +352,7 @@ export default {
         id: networkId,
         listall: true
       }
-      api(`listNetworks`, listNetworkParams).then(json => {
+      getAPI(`listNetworks`, listNetworkParams).then(json => {
         json.listnetworksresponse.network[0].service.forEach(service => {
           if (service.name === 'UserData') {
             this.userDataEnabled = true
@@ -362,7 +362,7 @@ export default {
               userdata: true,
               listall: true
             }
-            api('listVirtualMachines', listVmParams).then(json => {
+            getAPI('listVirtualMachines', listVmParams).then(json => {
               this.form.userdata = atob(json.listvirtualmachinesresponse.virtualmachine[0].userdata || '')
             })
           }
@@ -403,7 +403,7 @@ export default {
         }
         this.loading = true
 
-        api('updateVirtualMachine', {}, 'POST', params).then(json => {
+        postAPI('updateVirtualMachine', params).then(json => {
           this.$message.success({
             content: `${this.$t('label.action.edit.instance')} - ${values.name}`,
             duration: 2
diff --git a/ui/src/views/compute/InstanceSchedules.vue b/ui/src/views/compute/InstanceSchedules.vue
index 67e1f6ed749d..30c545ccd06b 100644
--- a/ui/src/views/compute/InstanceSchedules.vue
+++ b/ui/src/views/compute/InstanceSchedules.vue
@@ -253,7 +253,7 @@
 <script>
 
 import { reactive, ref, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ListView from '@/components/view/ListView'
 import Status from '@/components/widgets/Status'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -373,7 +373,7 @@ export default {
       this.showAddModal()
     },
     removeVMSchedule (schedule) {
-      api('deleteVMSchedule', {
+      postAPI('deleteVMSchedule', {
         id: schedule.id,
         virtualmachineid: this.virtualmachine.id
       }).then(() => {
@@ -429,7 +429,7 @@ export default {
           command = 'updateVMSchedule'
         }
 
-        api(command, params).then(response => {
+        postAPI(command, params).then(response => {
           this.$notification.success({
             message: this.$t('label.schedule'),
             description: this.$t('message.success.config.vm.schedule')
@@ -485,7 +485,7 @@ export default {
         listall: true
       }
       this.tabLoading = true
-      api('listVMSchedule', params).then(json => {
+      getAPI('listVMSchedule', params).then(json => {
         this.schedules = []
         this.totalCount = json?.listvmscheduleresponse?.count || 0
         this.schedules = json?.listvmscheduleresponse?.vmschedule || []
diff --git a/ui/src/views/compute/InstanceTab.vue b/ui/src/views/compute/InstanceTab.vue
index d2007e0f2430..fa50e6e79b79 100644
--- a/ui/src/views/compute/InstanceTab.vue
+++ b/ui/src/views/compute/InstanceTab.vue
@@ -127,7 +127,7 @@
 
 <script>
 
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import ResourceLayout from '@/layouts/ResourceLayout'
 import DetailsTab from '@/components/view/DetailsTab'
@@ -238,14 +238,14 @@ export default {
       if (!this.vm || !this.vm.id) {
         return
       }
-      api('listAnnotations', { entityid: this.dataResource.id, entitytype: 'VM', annotationfilter: 'all' }).then(json => {
+      getAPI('listAnnotations', { entityid: this.dataResource.id, entitytype: 'VM', annotationfilter: 'all' }).then(json => {
         if (json.listannotationsresponse && json.listannotationsresponse.annotation) {
           this.annotations = json.listannotationsresponse.annotation
         }
       })
     },
     listDiskOfferings () {
-      api('listDiskOfferings', {
+      getAPI('listDiskOfferings', {
         listAll: 'true',
         zoneid: this.vm.zoneid
       }).then(response => {
@@ -276,7 +276,7 @@ export default {
       this.securitygroupids = securitygroupids || []
     },
     updateSecurityGroups () {
-      api('updateVirtualMachine', { id: this.vm.id, securitygroupids: this.securitygroupids.join(',') }).catch(error => {
+      postAPI('updateVirtualMachine', { id: this.vm.id, securitygroupids: this.securitygroupids.join(',') }).catch(error => {
         this.$notifyError(error)
       }).finally(() => {
         this.closeModals()
diff --git a/ui/src/views/compute/KubernetesServiceTab.vue b/ui/src/views/compute/KubernetesServiceTab.vue
index dc68b7223604..fc8f9c60213a 100644
--- a/ui/src/views/compute/KubernetesServiceTab.vue
+++ b/ui/src/views/compute/KubernetesServiceTab.vue
@@ -174,7 +174,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin } from '@/role'
 import { mixinDevice } from '@/utils/mixin.js'
 import DetailsTab from '@/components/view/DetailsTab'
@@ -343,7 +343,7 @@ export default {
     },
     fetchComments () {
       this.clusterConfigLoading = true
-      api('listAnnotations', { entityid: this.resource.id, entitytype: 'KUBERNETES_CLUSTER', annotationfilter: 'all' }).then(json => {
+      getAPI('listAnnotations', { entityid: this.resource.id, entitytype: 'KUBERNETES_CLUSTER', annotationfilter: 'all' }).then(json => {
         if (json.listannotationsresponse?.annotation) {
           this.annotations = json.listannotationsresponse.annotation
         }
@@ -359,7 +359,7 @@ export default {
       if (!this.isObjectEmpty(this.resource)) {
         var params = {}
         params.id = this.resource.id
-        api('getKubernetesClusterConfig', params).then(json => {
+        getAPI('getKubernetesClusterConfig', params).then(json => {
           const config = json.getkubernetesclusterconfigresponse.clusterconfig
           if (!this.isObjectEmpty(config) &&
             this.isValidValueForKey(config, 'configdata') &&
@@ -387,7 +387,7 @@ export default {
         this.resource.kubernetesversionid !== '') {
         var params = {}
         params.id = this.resource.kubernetesversionid
-        api('listKubernetesSupportedVersions', params).then(json => {
+        getAPI('listKubernetesSupportedVersions', params).then(json => {
           const versionObjs = json.listkubernetessupportedversionsresponse.kubernetessupportedversion
           if (this.arrayHasItems(versionObjs)) {
             this.kubernetesVersion = versionObjs[0]
@@ -416,7 +416,7 @@ export default {
     fetchNetwork () {
       this.networkLoading = true
       return new Promise((resolve, reject) => {
-        api('listNetworks', {
+        getAPI('listNetworks', {
           listAll: true,
           id: this.resource.networkid
         }).then(json => {
@@ -449,7 +449,7 @@ export default {
           params.associatednetworkid = this.resource.networkid
         }
       }
-      api('listPublicIpAddresses', params).then(json => {
+      getAPI('listPublicIpAddresses', params).then(json => {
         let ips = json.listpublicipaddressesresponse.publicipaddress
         if (this.arrayHasItems(ips)) {
           ips = ips.filter(x => x.issourcenat)
@@ -465,7 +465,7 @@ export default {
       const params = {}
       params.name = 'cloud.kubernetes.etcd.node.start.port'
       var apiName = 'listConfigurations'
-      api(apiName, params).then(json => {
+      getAPI(apiName, params).then(json => {
         const configResponse = json.listconfigurationsresponse.configuration
         this.etcdSshPort = configResponse[0]?.value
       })
@@ -489,7 +489,7 @@ export default {
         id: this.resource.id,
         nodeids: node.id
       }
-      api('scaleKubernetesCluster', params).then(json => {
+      postAPI('scaleKubernetesCluster', params).then(json => {
         const jobId = json.scalekubernetesclusterresponse.jobid
         console.log(jobId)
         this.$store.dispatch('AddAsyncJob', {
diff --git a/ui/src/views/compute/MigrateVMStorage.vue b/ui/src/views/compute/MigrateVMStorage.vue
index 139ff856a2a2..07e9b3d3a4fe 100644
--- a/ui/src/views/compute/MigrateVMStorage.vue
+++ b/ui/src/views/compute/MigrateVMStorage.vue
@@ -54,7 +54,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import StoragePoolSelectView from '@/components/view/StoragePoolSelectView'
 import InstanceVolumesStoragePoolSelectListView from '@/components/view/InstanceVolumesStoragePoolSelectListView'
@@ -158,7 +158,7 @@ export default {
       } else {
         params.storageid = storageId
       }
-      api(migrateApi, params).then(response => {
+      postAPI(migrateApi, params).then(response => {
         const jobId = response[migrateApi.toLowerCase() + 'response'].jobid
         this.$pollJob({
           title: `${this.$t('label.migrating')} ${this.resource.name}`,
diff --git a/ui/src/views/compute/MigrateWizard.vue b/ui/src/views/compute/MigrateWizard.vue
index 70f40f7433a5..e559d45d81b7 100644
--- a/ui/src/views/compute/MigrateWizard.vue
+++ b/ui/src/views/compute/MigrateWizard.vue
@@ -124,7 +124,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import InstanceVolumesStoragePoolSelectListView from '@/components/view/InstanceVolumesStoragePoolSelectListView'
 
@@ -213,7 +213,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('findHostsForMigration', {
+      getAPI('findHostsForMigration', {
         virtualmachineid: this.resource.id,
         keyword: this.searchQuery,
         page: this.page,
@@ -264,7 +264,7 @@ export default {
     fetchVolumes () {
       this.loading = true
       this.volumes = []
-      api('listVolumes', {
+      getAPI('listVolumes', {
         listAll: true,
         virtualmachineid: this.resource.id
       }).then(response => {
@@ -312,7 +312,7 @@ export default {
           params['migrateto[' + i + '].pool'] = mapping.pool
         }
       }
-      api(migrateApi, params).then(response => {
+      postAPI(migrateApi, params).then(response => {
         const jobId = response[migrateApi.toLowerCase() + 'response'].jobid
         this.$pollJob({
           jobId: jobId,
diff --git a/ui/src/views/compute/RegisterUserData.vue b/ui/src/views/compute/RegisterUserData.vue
index 67dce17234db..4631ad70e7df 100644
--- a/ui/src/views/compute/RegisterUserData.vue
+++ b/ui/src/views/compute/RegisterUserData.vue
@@ -129,7 +129,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -192,7 +192,7 @@ export default {
     fetchDomainData () {
       const params = {}
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         const listdomains = json.listdomainsresponse.domain
         this.domains = this.domains.concat(listdomains)
       }).finally(() => {
@@ -240,7 +240,7 @@ export default {
           params.params = userdataparams
         }
 
-        api(apiName, {}, 'POST', params).then(json => {
+        postAPI(apiName, params).then(json => {
           this.$message.success(this.$t('message.success.register.user.data') + ' ' + values.name)
         }).catch(error => {
           this.$notifyError(error)
diff --git a/ui/src/views/compute/ReinstallVm.vue b/ui/src/views/compute/ReinstallVm.vue
index a87d2b056978..982c4543a37d 100644
--- a/ui/src/views/compute/ReinstallVm.vue
+++ b/ui/src/views/compute/ReinstallVm.vue
@@ -131,7 +131,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import DiskOfferingSelection from '@views/compute/wizard/DiskOfferingSelection'
 import DiskSizeSelection from '@views/compute/wizard/DiskSizeSelection'
 import OsBasedImageSelection from '@views/compute/wizard/OsBasedImageSelection'
@@ -270,7 +270,7 @@ export default {
         params.rootdisksize = this.overrideRootDiskSize
       }
       params.expunge = this.expungeDisk
-      api('restoreVirtualMachine', params).then(response => {
+      postAPI('restoreVirtualMachine', params).then(response => {
         this.$pollJob({
           jobId: response.restorevmresponse.jobid,
           successMessage: this.$t('label.reinstall.vm') + ' ' + this.$t('label.success'),
@@ -308,7 +308,7 @@ export default {
         featured: true,
         showicon: true
       }
-      api('listOsCategories', params).then((response) => {
+      getAPI('listOsCategories', params).then((response) => {
         this.options.guestOsCategories = response?.listoscategoriesresponse?.oscategory || []
         if (this.showUserCategoryForModernImageSelection) {
           const userCategory = {
@@ -374,7 +374,7 @@ export default {
       args.showicon = 'true'
 
       return new Promise((resolve, reject) => {
-        api('listTemplates', args).then((response) => {
+        getAPI('listTemplates', args).then((response) => {
           resolve(response)
         }).catch((reason) => {
           reject(reason)
@@ -382,7 +382,7 @@ export default {
       })
     },
     fetchDiskOfferings (params) {
-      api('listDiskOfferings', { zoneid: this.resource.zoneid, listall: true, ...params }).then((response) => {
+      getAPI('listDiskOfferings', { zoneid: this.resource.zoneid, listall: true, ...params }).then((response) => {
         this.options.diskOfferings = response?.listdiskofferingsresponse?.diskoffering || []
         this.count.diskOfferings = response?.listdiskofferingsresponse?.count || 0
       })
diff --git a/ui/src/views/compute/ResetSshKeyPair.vue b/ui/src/views/compute/ResetSshKeyPair.vue
index cc64caa86b47..65e65d8c2931 100644
--- a/ui/src/views/compute/ResetSshKeyPair.vue
+++ b/ui/src/views/compute/ResetSshKeyPair.vue
@@ -60,7 +60,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { genericCompare } from '@/utils/sort.js'
 
 export default {
@@ -115,7 +115,7 @@ export default {
       this.loading = true
       this.items = []
       this.total = 0
-      api('listSSHKeyPairs', this.options).then(response => {
+      getAPI('listSSHKeyPairs', this.options).then(response => {
         this.total = response.listsshkeypairsresponse.count
         if (this.total !== 0) {
           this.items = response.listsshkeypairsresponse.sshkeypair
@@ -140,7 +140,7 @@ export default {
     handleSubmit () {
       if (this.loading) return
       this.loading = true
-      api('resetSSHKeyForVirtualMachine', {
+      postAPI('resetSSHKeyForVirtualMachine', {
         id: this.resource.id,
         keypairs: this.selectedRowKeys.join(',')
       }).then(response => {
diff --git a/ui/src/views/compute/ResetUserData.vue b/ui/src/views/compute/ResetUserData.vue
index ccceab4d78f6..462a0901b88a 100644
--- a/ui/src/views/compute/ResetUserData.vue
+++ b/ui/src/views/compute/ResetUserData.vue
@@ -124,7 +124,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { genericCompare } from '@/utils/sort.js'
 import UserDataSelection from '@views/compute/wizard/UserDataSelection'
 
@@ -231,7 +231,7 @@ export default {
       this.loadingData = true
       this.items = []
       this.total = 0
-      api('listUserData', this.options).then(response => {
+      getAPI('listUserData', this.options).then(response => {
         this.total = response.listuserdataresponse.count
         if (this.total !== 0) {
           this.items = response.listuserdataresponse.userdata
@@ -246,7 +246,7 @@ export default {
       params.isrecursive = true
       params.templatefilter = 'all'
       var apiName = 'listTemplates'
-      api(apiName, params).then(json => {
+      getAPI(apiName, params).then(json => {
         const templateResponses = json.listtemplatesresponse.template
         this.template = templateResponses[0]
         this.updateTemplateLinkedUserData(this.template.userdataid)
@@ -259,7 +259,7 @@ export default {
       }
       this.templateUserDataParams = []
 
-      api('listUserData', { id: id }).then(json => {
+      getAPI('listUserData', { id: id }).then(json => {
         const resp = json?.listuserdataresponse?.userdata || []
         if (resp) {
           var params = resp[0].params
@@ -303,7 +303,7 @@ export default {
       }
       this.form.userdataid = id
       this.userDataParams = []
-      api('listUserData', { id: id }).then(json => {
+      getAPI('listUserData', { id: id }).then(json => {
         const resp = json?.listuserdataresponse?.userdata || []
         if (resp.length > 0) {
           var params = resp[0].params
@@ -362,11 +362,8 @@ export default {
       params.id = this.resource.resetUserDataResourceId ? this.resource.resetUserDataResourceId : this.resource.id
 
       const resetUserDataApiName = this.resource.resetUserDataApiName ? this.resource.resetUserDataApiName : 'resetUserDataForVirtualMachine'
-      const httpMethod = params.userdata ? 'POST' : 'GET'
-      const args = httpMethod === 'POST' ? {} : params
-      const data = httpMethod === 'POST' ? params : {}
 
-      api(resetUserDataApiName, args, httpMethod, data).then(json => {
+      postAPI(resetUserDataApiName, params).then(json => {
         this.$message.success({
           content: `${this.$t('label.action.userdata.reset')} - ${this.$t('label.success')}`,
           duration: 2
diff --git a/ui/src/views/compute/ScaleKubernetesCluster.vue b/ui/src/views/compute/ScaleKubernetesCluster.vue
index 3fe552004f75..837860061684 100644
--- a/ui/src/views/compute/ScaleKubernetesCluster.vue
+++ b/ui/src/views/compute/ScaleKubernetesCluster.vue
@@ -149,7 +149,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -239,7 +239,7 @@ export default {
       }
       var minCpu = 0
       var minMemory = 0
-      api('listServiceOfferings', params).then(json => {
+      getAPI('listServiceOfferings', params).then(json => {
         var items = json?.listserviceofferingsresponse?.serviceoffering || []
         if (this.arrayHasItems(items) && !this.isObjectEmpty(items[0])) {
           minCpu = items[0].cpunumber
@@ -256,7 +256,7 @@ export default {
       }
       var minCpu = 0
       var minMemory = 0
-      api('listKubernetesSupportedVersions', params).then(json => {
+      getAPI('listKubernetesSupportedVersions', params).then(json => {
         const versionObjs = json?.listkubernetessupportedversionsresponse?.kubernetessupportedversion || []
         if (this.arrayHasItems(versionObjs) && !this.isObjectEmpty(versionObjs[0])) {
           minCpu = versionObjs[0].mincpunumber
@@ -278,7 +278,7 @@ export default {
         memory: minMemory
       }
       this.serviceOfferingLoading = true
-      api('listServiceOfferings', params).then(json => {
+      getAPI('listServiceOfferings', params).then(json => {
         var items = json?.listserviceofferingsresponse?.serviceoffering || []
         if (this.arrayHasItems(items)) {
           for (var i = 0; i < items.length; i++) {
@@ -358,7 +358,7 @@ export default {
           params['nodeofferings[' + advancedOfferings + '].offering'] = this.etcdOfferings[values.etcdofferingid].id
           advancedOfferings++
         }
-        api('scaleKubernetesCluster', params).then(json => {
+        postAPI('scaleKubernetesCluster', params).then(json => {
           const jobId = json.scalekubernetesclusterresponse.jobid
           this.$pollJob({
             jobId,
diff --git a/ui/src/views/compute/ScaleVM.vue b/ui/src/views/compute/ScaleVM.vue
index 4ae02e7a80bd..17e64d0fa91d 100644
--- a/ui/src/views/compute/ScaleVM.vue
+++ b/ui/src/views/compute/ScaleVM.vue
@@ -80,7 +80,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ComputeOfferingSelection from '@views/compute/wizard/ComputeOfferingSelection'
 import ComputeSelection from '@views/compute/wizard/ComputeSelection'
 import DiskSizeSelection from '@views/compute/wizard/DiskSizeSelection'
@@ -137,7 +137,7 @@ export default {
       this.total = 0
       this.offerings = []
       this.offeringsMap = []
-      api('listServiceOfferings', {
+      getAPI('listServiceOfferings', {
         virtualmachineid: this.resource.id,
         keyword: options.keyword,
         page: options.page,
@@ -186,7 +186,7 @@ export default {
     },
     getTemplate () {
       return new Promise((resolve, reject) => {
-        api('listTemplates', {
+        getAPI('listTemplates', {
           templatefilter: 'all',
           id: this.resource.templateid
         }).then(response => {
@@ -223,7 +223,7 @@ export default {
       this.selectedOffering = this.offeringsMap[id]
       this.selectedDiskOffering = null
       if (this.selectedOffering.diskofferingid) {
-        api('listDiskOfferings', {
+        getAPI('listDiskOfferings', {
           id: this.selectedOffering.diskofferingid
         }).then(response => {
           const diskOfferings = response.listdiskofferingsresponse.diskoffering || []
@@ -253,7 +253,7 @@ export default {
         delete this.params[this.cpuSpeedKey]
       }
 
-      api('scaleVirtualMachine', this.params).then(response => {
+      postAPI('scaleVirtualMachine', this.params).then(response => {
         const jobId = response.scalevirtualmachineresponse.jobid
         if (jobId) {
           this.$pollJob({
diff --git a/ui/src/views/compute/StartVirtualMachine.vue b/ui/src/views/compute/StartVirtualMachine.vue
index 4e1a63b82df3..d85b33ceaed9 100644
--- a/ui/src/views/compute/StartVirtualMachine.vue
+++ b/ui/src/views/compute/StartVirtualMachine.vue
@@ -115,7 +115,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -169,7 +169,7 @@ export default {
       this.pods = []
       this.podsLoading = true
       const params = { zoneid: this.resource.zoneid }
-      api('listPods', params).then(json => {
+      getAPI('listPods', params).then(json => {
         this.pods = json.listpodsresponse.pod || []
         if (this.pods.length === 0) {
           this.$notification.error({
@@ -188,7 +188,7 @@ export default {
       if (podid) {
         params.podid = podid
       }
-      api('listClusters', params).then(json => {
+      getAPI('listClusters', params).then(json => {
         this.clusters = json.listclustersresponse.cluster || []
         if (this.clusters.length === 0) {
           this.$notification.error({
@@ -210,7 +210,7 @@ export default {
       if (clusterid) {
         params.clusterid = clusterid
       }
-      api('listHosts', params).then(json => {
+      getAPI('listHosts', params).then(json => {
         this.hosts = json.listhostsresponse.host || []
         if (this.hosts.length === 0) {
           this.$notification.error({
@@ -247,7 +247,7 @@ export default {
             params[key] = values[key]
           }
         }
-        api('startVirtualMachine', params).then(json => {
+        postAPI('startVirtualMachine', params).then(json => {
           const jobId = json.startvirtualmachineresponse.jobid
           this.$pollJob({
             jobId,
diff --git a/ui/src/views/compute/UpgradeKubernetesCluster.vue b/ui/src/views/compute/UpgradeKubernetesCluster.vue
index 22cfb0fd0ec0..36dc517f7936 100644
--- a/ui/src/views/compute/UpgradeKubernetesCluster.vue
+++ b/ui/src/views/compute/UpgradeKubernetesCluster.vue
@@ -60,7 +60,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -117,7 +117,7 @@ export default {
         params.minimumkubernetesversionid = this.resource.kubernetesversionid
       }
       this.kubernetesVersionLoading = true
-      api('listKubernetesSupportedVersions', params).then(json => {
+      getAPI('listKubernetesSupportedVersions', params).then(json => {
         const versionObjs = json.listkubernetessupportedversionsresponse.kubernetessupportedversion
         if (this.arrayHasItems(versionObjs)) {
           var clusterVersion = null
@@ -157,7 +157,7 @@ export default {
         if (this.isValidValueForKey(values, 'kubernetesversionid') && this.arrayHasItems(this.kubernetesVersions)) {
           params.kubernetesversionid = this.kubernetesVersions[values.kubernetesversionid].id
         }
-        api('upgradeKubernetesCluster', params).then(json => {
+        postAPI('upgradeKubernetesCluster', params).then(json => {
           this.$emit('refresh-data')
           const jobId = json.upgradekubernetesclusterresponse.jobid
           this.$pollJob({
diff --git a/ui/src/views/compute/backup/BackupSchedule.vue b/ui/src/views/compute/backup/BackupSchedule.vue
index bb3ffe5d00a7..0e1106e6504b 100644
--- a/ui/src/views/compute/backup/BackupSchedule.vue
+++ b/ui/src/views/compute/backup/BackupSchedule.vue
@@ -78,7 +78,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { timeZoneName } from '@/utils/timezone'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
@@ -169,7 +169,7 @@ export default {
       const params = {}
       params.virtualmachineid = record.virtualmachineid
       this.actionLoading = true
-      api('deleteBackupSchedule', params).then(json => {
+      postAPI('deleteBackupSchedule', params).then(json => {
         if (json.deletebackupscheduleresponse.success) {
           this.$notification.success({
             message: this.$t('label.scheduled.backups'),
diff --git a/ui/src/views/compute/backup/FormSchedule.vue b/ui/src/views/compute/backup/FormSchedule.vue
index 7940a618478c..5a6928cca1c8 100644
--- a/ui/src/views/compute/backup/FormSchedule.vue
+++ b/ui/src/views/compute/backup/FormSchedule.vue
@@ -155,7 +155,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { timeZone } from '@/utils/timezone'
 import { mixinForm } from '@/utils/mixin'
 import debounce from 'lodash/debounce'
@@ -276,7 +276,7 @@ export default {
             break
         }
         this.actionLoading = true
-        api('createBackupSchedule', params).then(json => {
+        postAPI('createBackupSchedule', params).then(json => {
           this.$notification.success({
             message: this.$t('label.scheduled.backups'),
             description: this.$t('message.success.config.backup.schedule')
diff --git a/ui/src/views/compute/wizard/MultiDiskSelection.vue b/ui/src/views/compute/wizard/MultiDiskSelection.vue
index 8344508ad33c..f9ae73860e68 100644
--- a/ui/src/views/compute/wizard/MultiDiskSelection.vue
+++ b/ui/src/views/compute/wizard/MultiDiskSelection.vue
@@ -72,7 +72,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import CheckBoxSelectPair from '@/components/CheckBoxSelectPair'
 
 export default {
@@ -179,7 +179,7 @@ export default {
     fetchDiskOfferings () {
       this.diskOfferings = []
       this.loading = true
-      api('listDiskOfferings', {
+      getAPI('listDiskOfferings', {
         zoneid: this.zoneId,
         listall: true
       }).then(response => {
diff --git a/ui/src/views/compute/wizard/MultiNetworkSelection.vue b/ui/src/views/compute/wizard/MultiNetworkSelection.vue
index 92d4a4375994..5c241061c0d8 100644
--- a/ui/src/views/compute/wizard/MultiNetworkSelection.vue
+++ b/ui/src/views/compute/wizard/MultiNetworkSelection.vue
@@ -81,7 +81,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import _ from 'lodash'
 import CheckBoxInputPair from '@/components/CheckBoxInputPair'
 
@@ -221,7 +221,7 @@ export default {
         params.domainid = this.domainid
         params.account = this.account
       }
-      api('listNetworks', params).then(response => {
+      getAPI('listNetworks', params).then(response => {
         this.networks = response.listnetworksresponse.network || []
       }).catch(() => {
         this.networks = []
diff --git a/ui/src/views/compute/wizard/NetworkSelection.vue b/ui/src/views/compute/wizard/NetworkSelection.vue
index f2dabc0012a2..3a4fd8c88f90 100644
--- a/ui/src/views/compute/wizard/NetworkSelection.vue
+++ b/ui/src/views/compute/wizard/NetworkSelection.vue
@@ -101,7 +101,7 @@
 
 <script>
 import _ from 'lodash'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { isAdmin } from '@/role'
 import store from '@/store'
 import CreateNetwork from '@/views/network/CreateNetwork'
@@ -251,7 +251,7 @@ export default {
       }
     },
     loading () {
-      api('listZones', { id: this.zoneId }).then(json => {
+      getAPI('listZones', { id: this.zoneId }).then(json => {
         const zoneResponse = json.listzonesresponse.zone || []
         this.showCreateButton = false
         if ('createNetwork' in store.getters.apis && zoneResponse && zoneResponse.length > 0 && (!zoneResponse[0].securitygroupsenabled || (isAdmin() && zoneResponse[0].networktype === 'Advanced'))) {
@@ -314,7 +314,7 @@ export default {
     if (projectId) {
       params.projectid = projectId
     }
-    api('listVPCs', {
+    getAPI('listVPCs', {
       params
     }).then((response) => {
       this.vpcs = _.get(response, 'listvpcsresponse.vpc')
@@ -327,7 +327,7 @@ export default {
       if (!projectId) {
         return false
       }
-      api('listVPCs', {
+      getAPI('listVPCs', {
         projectid: store.getters.project.id
       }).then((response) => {
         this.vpcs = _.get(response, 'listvpcsresponse.vpc')
@@ -383,7 +383,7 @@ export default {
         args.specifyvlan = false
         args.state = 'Enabled'
 
-        api('listNetworkOfferings', args).then(json => {
+        getAPI('listNetworkOfferings', args).then(json => {
           const listNetworkOfferings = json.listnetworkofferingsresponse.networkoffering || []
           resolve(listNetworkOfferings)
         }).catch(error => {
diff --git a/ui/src/views/compute/wizard/OwnershipSelection.vue b/ui/src/views/compute/wizard/OwnershipSelection.vue
index a2c7ea4c1f8c..59f781a75aa5 100644
--- a/ui/src/views/compute/wizard/OwnershipSelection.vue
+++ b/ui/src/views/compute/wizard/OwnershipSelection.vue
@@ -128,7 +128,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon.vue'
 
 export default {
@@ -157,7 +157,7 @@ export default {
   methods: {
     fetchData () {
       this.loading = true
-      api('listDomains', {
+      getAPI('listDomains', {
         response: 'json',
         listAll: true,
         showicon: true,
@@ -188,7 +188,7 @@ export default {
     },
     fetchAccounts () {
       this.loading = true
-      api('listAccounts', {
+      getAPI('listAccounts', {
         response: 'json',
         domainId: this.selectedDomain,
         showicon: true,
@@ -218,7 +218,7 @@ export default {
     },
     fetchProjects () {
       this.loading = true
-      api('listProjects', {
+      getAPI('listProjects', {
         response: 'json',
         domainId: this.selectedDomain,
         state: 'Active',
diff --git a/ui/src/views/compute/wizard/SecurityGroupSelection.vue b/ui/src/views/compute/wizard/SecurityGroupSelection.vue
index 87bf62ddac21..9d91cc1cbe19 100644
--- a/ui/src/views/compute/wizard/SecurityGroupSelection.vue
+++ b/ui/src/views/compute/wizard/SecurityGroupSelection.vue
@@ -54,7 +54,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import _ from 'lodash'
 
 export default {
@@ -154,7 +154,7 @@ export default {
       this.items = []
       this.fetchLoading = true
 
-      api('listSecurityGroups', params).then(json => {
+      getAPI('listSecurityGroups', params).then(json => {
         const items = json.listsecuritygroupsresponse.securitygroup || []
         this.rowCount = json.listsecuritygroupsresponse.count || 0
         if (items && items.length > 0) {
diff --git a/ui/src/views/dashboard/CapacityDashboard.vue b/ui/src/views/dashboard/CapacityDashboard.vue
index 53a3d87aa23c..7e0b8180ac84 100644
--- a/ui/src/views/dashboard/CapacityDashboard.vue
+++ b/ui/src/views/dashboard/CapacityDashboard.vue
@@ -332,7 +332,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 import ChartCard from '@/components/widgets/ChartCard'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -456,7 +456,7 @@ export default {
     },
     listCapacity (zone, latest = false, additive = false) {
       this.capacityLoading = true
-      api('listCapacity', { zoneid: zone.id, fetchlatest: latest }).then(json => {
+      getAPI('listCapacity', { zoneid: zone.id, fetchlatest: latest }).then(json => {
         this.capacityLoading = false
         let stats = []
         if (json && json.listcapacityresponse && json.listcapacityresponse.capacity) {
@@ -502,56 +502,56 @@ export default {
         routers: 0
       }
       this.loading = true
-      api('listPods', { zoneid: zone.id }).then(json => {
+      getAPI('listPods', { zoneid: zone.id }).then(json => {
         this.loading = false
         this.data.pods = json?.listpodsresponse?.count
         if (!this.data.pods) {
           this.data.pods = 0
         }
       })
-      api('listClusters', { zoneid: zone.id }).then(json => {
+      getAPI('listClusters', { zoneid: zone.id }).then(json => {
         this.loading = false
         this.data.clusters = json?.listclustersresponse?.count
         if (!this.data.clusters) {
           this.data.clusters = 0
         }
       })
-      api('listHosts', { zoneid: zone.id, listall: true, details: 'min', type: 'routing', page: 1, pagesize: 1 }).then(json => {
+      getAPI('listHosts', { zoneid: zone.id, listall: true, details: 'min', type: 'routing', page: 1, pagesize: 1 }).then(json => {
         this.loading = false
         this.data.totalHosts = json?.listhostsresponse?.count
         if (!this.data.totalHosts) {
           this.data.totalHosts = 0
         }
       })
-      api('listHosts', { zoneid: zone.id, listall: true, details: 'min', type: 'routing', state: 'alert', page: 1, pagesize: 1 }).then(json => {
+      getAPI('listHosts', { zoneid: zone.id, listall: true, details: 'min', type: 'routing', state: 'alert', page: 1, pagesize: 1 }).then(json => {
         this.loading = false
         this.data.alertHosts = json?.listhostsresponse?.count
         if (!this.data.alertHosts) {
           this.data.alertHosts = 0
         }
       })
-      api('listStoragePools', { zoneid: zone.id }).then(json => {
+      getAPI('listStoragePools', { zoneid: zone.id }).then(json => {
         this.loading = false
         this.data.pools = json?.liststoragepoolsresponse?.count
         if (!this.data.pools) {
           this.data.pools = 0
         }
       })
-      api('listSystemVms', { zoneid: zone.id }).then(json => {
+      getAPI('listSystemVms', { zoneid: zone.id }).then(json => {
         this.loading = false
         this.data.systemvms = json?.listsystemvmsresponse?.count
         if (!this.data.systemvms) {
           this.data.systemvms = 0
         }
       })
-      api('listRouters', { zoneid: zone.id, listall: true, projectid: '-1' }).then(json => {
+      getAPI('listRouters', { zoneid: zone.id, listall: true, projectid: '-1' }).then(json => {
         this.loading = false
         this.data.routers = json?.listroutersresponse?.count
         if (!this.data.routers) {
           this.data.routers = 0
         }
       })
-      api('listVirtualMachines', { zoneid: zone.id, listall: true, projectid: '-1', details: 'min', page: 1, pagesize: 1 }).then(json => {
+      getAPI('listVirtualMachines', { zoneid: zone.id, listall: true, projectid: '-1', details: 'min', page: 1, pagesize: 1 }).then(json => {
         this.loading = false
         this.data.instances = json?.listvirtualmachinesresponse?.count
         if (!this.data.instances) {
@@ -566,7 +566,7 @@ export default {
         listall: true
       }
       this.loading = true
-      api('listAlerts', params).then(json => {
+      getAPI('listAlerts', params).then(json => {
         this.alerts = []
         this.loading = false
         if (json && json.listalertsresponse && json.listalertsresponse.alert) {
@@ -581,7 +581,7 @@ export default {
         listall: true
       }
       this.loading = true
-      api('listEvents', params).then(json => {
+      getAPI('listEvents', params).then(json => {
         this.events = []
         this.loading = false
         if (json && json.listeventsresponse && json.listeventsresponse.event) {
@@ -599,7 +599,7 @@ export default {
       return 'blue'
     },
     listZones () {
-      api('listZones', { showicon: true }).then(json => {
+      getAPI('listZones', { showicon: true }).then(json => {
         if (json && json.listzonesresponse && json.listzonesresponse.zone) {
           this.zones = json.listzonesresponse.zone
           if (this.zones.length > 0) {
diff --git a/ui/src/views/dashboard/Dashboard.vue b/ui/src/views/dashboard/Dashboard.vue
index b1cfe975cd56..bea607d6ac95 100644
--- a/ui/src/views/dashboard/Dashboard.vue
+++ b/ui/src/views/dashboard/Dashboard.vue
@@ -30,7 +30,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import store from '@/store'
 import CapacityDashboard from './CapacityDashboard'
 import UsageDashboard from './UsageDashboard'
@@ -84,7 +84,7 @@ export default {
       if (!['Admin'].includes(this.$store.getters.userInfo.roletype)) {
         return
       }
-      api('listZones').then(json => {
+      getAPI('listZones').then(json => {
         this.showOnboarding = json.listzonesresponse.count ? json.listzonesresponse.count === 0 : true
       })
     }
diff --git a/ui/src/views/dashboard/SetupTwoFaAtLogin.vue b/ui/src/views/dashboard/SetupTwoFaAtLogin.vue
index 2300a7ab4a7c..70f418386189 100644
--- a/ui/src/views/dashboard/SetupTwoFaAtLogin.vue
+++ b/ui/src/views/dashboard/SetupTwoFaAtLogin.vue
@@ -139,7 +139,7 @@
 </template>
 <script>
 
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { ref, reactive, toRaw } from 'vue'
 import store from '@/store'
 import VueQrious from 'vue-qrious'
@@ -192,7 +192,7 @@ export default {
     },
     handleSelectChange (val) {
       if (this.twoFAenabled) {
-        api('setupUserTwoFactorAuthentication', { enable: 'false' }).then(response => {
+        postAPI('setupUserTwoFactorAuthentication', { enable: 'false' }).then(response => {
           this.pin = ''
           this.username = ''
           this.totpUrl = ''
@@ -220,7 +220,7 @@ export default {
         } else {
           provider = this.selectedProvider
         }
-        api('setupUserTwoFactorAuthentication', { provider: provider }).then(response => {
+        postAPI('setupUserTwoFactorAuthentication', { provider: provider }).then(response => {
           this.pin = response.setupusertwofactorauthenticationresponse.setup2fa.secretcode
           if (this.selectedProvider === 'totp' || this.selectedProvider === 'othertotp') {
             this.username = response.setupusertwofactorauthenticationresponse.setup2fa.username
@@ -247,7 +247,7 @@ export default {
       })
     },
     disable2FAProvider () {
-      api('setupUserTwoFactorAuthentication', { enable: false }).then(response => {
+      postAPI('setupUserTwoFactorAuthentication', { enable: false }).then(response => {
         this.showPin = false
         this.twoFAenabled = false
         this.twoFAverified = false
@@ -259,7 +259,7 @@ export default {
       })
     },
     list2FAProviders () {
-      api('listUserTwoFactorAuthenticatorProviders', {}).then(response => {
+      getAPI('listUserTwoFactorAuthenticatorProviders', {}).then(response => {
         var providerlist = response.listusertwofactorauthenticatorprovidersresponse.providers || []
         var providernames = []
         for (const provider of providerlist) {
@@ -277,7 +277,7 @@ export default {
         if (values.code !== null) {
           this.verifybuttonstate = true
         }
-        api('validateUserTwoFactorAuthenticationCode', { codefor2fa: values.code }).then(response => {
+        postAPI('validateUserTwoFactorAuthenticationCode', { codefor2fa: values.code }).then(response => {
           this.$message.success({
             content: `${this.$t('label.action.enable.two.factor.authentication')}`,
             duration: 2
diff --git a/ui/src/views/dashboard/UsageDashboard.vue b/ui/src/views/dashboard/UsageDashboard.vue
index f0e9b8414210..f1fc415c6b79 100644
--- a/ui/src/views/dashboard/UsageDashboard.vue
+++ b/ui/src/views/dashboard/UsageDashboard.vue
@@ -359,7 +359,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import store from '@/store'
 
 import ChartCard from '@/components/widgets/ChartCard'
@@ -468,7 +468,7 @@ export default {
     },
     listAccount () {
       this.loading = true
-      api('listAccounts', { id: this.$store.getters.userInfo.accountid }).then(json => {
+      getAPI('listAccounts', { id: this.$store.getters.userInfo.accountid }).then(json => {
         this.loading = false
         if (json && json.listaccountsresponse && json.listaccountsresponse.account) {
           this.account = json.listaccountsresponse.account[0]
@@ -481,7 +481,7 @@ export default {
         id: store.getters.project.id,
         listall: true
       }
-      api('listProjects', params).then(json => {
+      getAPI('listProjects', params).then(json => {
         this.loading = false
         if (json?.listprojectsresponse?.project) {
           this.project = json.listprojectsresponse.project[0]
@@ -505,49 +505,49 @@ export default {
       this.listEvents()
       if ('listKubernetesClusters' in this.$store.getters.apis) {
         this.loading = true
-        api('listKubernetesClusters', { listall: true, page: 1, pagesize: 1 }).then(json => {
+        getAPI('listKubernetesClusters', { listall: true, page: 1, pagesize: 1 }).then(json => {
           this.loading = false
           this.data.kubernetes = json?.listkubernetesclustersresponse?.count
         })
       }
       if ('listVolumes' in this.$store.getters.apis) {
         this.loading = true
-        api('listVolumes', { listall: true, page: 1, pagesize: 1 }).then(json => {
+        getAPI('listVolumes', { listall: true, page: 1, pagesize: 1 }).then(json => {
           this.loading = false
           this.data.volumes = json?.listvolumesresponse?.count
         })
       }
       if ('listSnapshots' in this.$store.getters.apis) {
         this.loading = true
-        api('listSnapshots', { listall: true, page: 1, pagesize: 1 }).then(json => {
+        getAPI('listSnapshots', { listall: true, page: 1, pagesize: 1 }).then(json => {
           this.loading = false
           this.data.snapshots = json?.listsnapshotsresponse?.count
         })
       }
       if ('listNetworks' in this.$store.getters.apis) {
         this.loading = true
-        api('listNetworks', { listall: true, page: 1, pagesize: 1 }).then(json => {
+        getAPI('listNetworks', { listall: true, page: 1, pagesize: 1 }).then(json => {
           this.loading = false
           this.data.networks = json?.listnetworksresponse?.count
         })
       }
       if ('listVPCs' in this.$store.getters.apis) {
         this.loading = true
-        api('listVPCs', { listall: true, page: 1, pagesize: 1 }).then(json => {
+        getAPI('listVPCs', { listall: true, page: 1, pagesize: 1 }).then(json => {
           this.loading = false
           this.data.vpcs = json?.listvpcsresponse?.count
         })
       }
       if ('listPublicIpAddresses' in this.$store.getters.apis) {
         this.loading = true
-        api('listPublicIpAddresses', { listall: true, page: 1, pagesize: 1 }).then(json => {
+        getAPI('listPublicIpAddresses', { listall: true, page: 1, pagesize: 1 }).then(json => {
           this.loading = false
           this.data.ips = json?.listpublicipaddressesresponse?.count
         })
       }
       if ('listTemplates' in this.$store.getters.apis) {
         this.loading = true
-        api('listTemplates', { templatefilter: 'self', listall: true, page: 1, pagesize: 1 }).then(json => {
+        getAPI('listTemplates', { templatefilter: 'self', listall: true, page: 1, pagesize: 1 }).then(json => {
           this.loading = false
           this.data.templates = json?.listtemplatesresponse?.count
         })
@@ -558,20 +558,20 @@ export default {
         return
       }
       this.loading = true
-      api('listVirtualMachines', { listall: true, details: 'min', page: 1, pagesize: 1 }).then(json => {
+      getAPI('listVirtualMachines', { listall: true, details: 'min', page: 1, pagesize: 1 }).then(json => {
         this.loading = false
         this.data.instances = json?.listvirtualmachinesresponse?.count
       })
-      api('listVirtualMachines', { listall: true, details: 'min', state: 'running', page: 1, pagesize: 1 }).then(json => {
+      getAPI('listVirtualMachines', { listall: true, details: 'min', state: 'running', page: 1, pagesize: 1 }).then(json => {
         this.loading = false
         this.data.running = json?.listvirtualmachinesresponse?.count
       })
-      api('listVirtualMachines', { listall: true, details: 'min', state: 'stopped', page: 1, pagesize: 1 }).then(json => {
+      getAPI('listVirtualMachines', { listall: true, details: 'min', state: 'stopped', page: 1, pagesize: 1 }).then(json => {
         this.loading = false
         this.data.stopped = json?.listvirtualmachinesresponse?.count
       })
       if (this.isLeaseFeatureEnabled) {
-        api('listVirtualMachines', { leased: true, listall: true, details: 'min', page: 1, pagesize: 1 }).then(json => {
+        getAPI('listVirtualMachines', { leased: true, listall: true, details: 'min', page: 1, pagesize: 1 }).then(json => {
           this.loading = false
           this.data.leasedinstances = json?.listvirtualmachinesresponse?.count
           if (!this.data.leasedinstances) {
@@ -590,7 +590,7 @@ export default {
         listall: true
       }
       this.loading = true
-      api('listEvents', params).then(json => {
+      getAPI('listEvents', params).then(json => {
         this.events = []
         this.loading = false
         if (json && json.listeventsresponse && json.listeventsresponse.event) {
diff --git a/ui/src/views/dashboard/VerifyOauth.vue b/ui/src/views/dashboard/VerifyOauth.vue
index ab3062a7318c..a4734aa5127a 100644
--- a/ui/src/views/dashboard/VerifyOauth.vue
+++ b/ui/src/views/dashboard/VerifyOauth.vue
@@ -23,7 +23,7 @@
 <script>
 import store from '@/store'
 import { mapActions } from 'vuex'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { OAUTH_DOMAIN, OAUTH_PROVIDER } from '@/store/mutation-types'
 
 export default {
@@ -47,7 +47,7 @@ export default {
       const code = params.get('code')
       const provider = this.$localStorage.get(OAUTH_PROVIDER)
       this.state.loginBtn = true
-      api('verifyOAuthCodeAndGetUser', { provider: provider, secretcode: code }).then(response => {
+      getAPI('verifyOAuthCodeAndGetUser', { provider: provider, secretcode: code }).then(response => {
         const email = response.verifyoauthcodeandgetuserresponse.oauthemail.email
         const loginParams = {}
         loginParams.email = email
diff --git a/ui/src/views/dashboard/VerifyTwoFa.vue b/ui/src/views/dashboard/VerifyTwoFa.vue
index 6c0f5f8a3808..a8018338592f 100644
--- a/ui/src/views/dashboard/VerifyTwoFa.vue
+++ b/ui/src/views/dashboard/VerifyTwoFa.vue
@@ -55,7 +55,7 @@
 </template>
 <script>
 
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { ref, reactive, toRaw } from 'vue'
 
 export default {
@@ -94,7 +94,7 @@ export default {
         if (values.code !== null) {
           this.buttonstate = true
         }
-        api('validateUserTwoFactorAuthenticationCode', { codefor2fa: values.code }).then(response => {
+        postAPI('validateUserTwoFactorAuthenticationCode', { codefor2fa: values.code }).then(response => {
           this.twoFAresponse = true
           if (this.twoFAresponse) {
             this.$notification.destroy()
diff --git a/ui/src/views/iam/AddAccount.vue b/ui/src/views/iam/AddAccount.vue
index b39c8b9dab8e..9118a61e7fe8 100644
--- a/ui/src/views/iam/AddAccount.vue
+++ b/ui/src/views/iam/AddAccount.vue
@@ -191,7 +191,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { timeZone } from '@/utils/timezone'
 import debounce from 'lodash/debounce'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -293,7 +293,7 @@ export default {
       params.pagesize = 100
       params.page = page
       var count
-      api(apiToCall, params).then(json => {
+      getAPI(apiToCall, params).then(json => {
         const listDomains = json.listdomainsresponse.domain
         count = json.listdomainsresponse.count
         this.domainsList = this.domainsList.concat(listDomains)
@@ -309,7 +309,7 @@ export default {
       this.roleLoading = true
       const params = {}
       params.state = 'enabled'
-      api('listRoles', params).then(response => {
+      getAPI('listRoles', params).then(response => {
         this.roles = response.listrolesresponse.role || []
         this.form.roleid = this.roles[0].id
         if (this.isDomainAdmin()) {
@@ -333,7 +333,7 @@ export default {
     },
     fetchIdps () {
       this.idpLoading = true
-      api('listIdps').then(response => {
+      getAPI('listIdps').then(response => {
         this.idps = response.listidpsresponse.idp || []
         this.form.samlentity = this.idps[0].id || ''
       }).finally(() => {
@@ -366,7 +366,7 @@ export default {
           params.networkdomain = values.networkdomain
         }
 
-        api('createAccount', {}, 'POST', params).then(response => {
+        postAPI('createAccount', params).then(response => {
           this.$emit('refresh-data')
           this.$notification.success({
             message: this.$t('label.create.account'),
@@ -375,7 +375,7 @@ export default {
           const users = response.createaccountresponse.account.user
           if (values.samlenable && users) {
             for (var i = 0; i < users.length; i++) {
-              api('authorizeSamlSso', {
+              postAPI('authorizeSamlSso', {
                 enable: values.samlenable,
                 entityid: values.samlentity,
                 userid: users[i].id
diff --git a/ui/src/views/iam/AddLdapAccount.vue b/ui/src/views/iam/AddLdapAccount.vue
index fadb5385741e..f65b9e6a5dac 100644
--- a/ui/src/views/iam/AddLdapAccount.vue
+++ b/ui/src/views/iam/AddLdapAccount.vue
@@ -164,7 +164,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { timeZone } from '@/utils/timezone'
 import store from '@/store'
 
@@ -313,7 +313,7 @@ export default {
           params.domainid = result[0].id
         }
       }
-      api('listLdapUsers', params).then(json => {
+      getAPI('listLdapUsers', params).then(json => {
         const listLdapUsers = json.ldapuserresponse.LdapUser
         if (listLdapUsers) {
           const ldapUserLength = listLdapUsers.length
@@ -332,7 +332,7 @@ export default {
     fetchListDomains () {
       return new Promise((resolve, reject) => {
         const params = {}
-        api('listDomains', params).then(json => {
+        getAPI('listDomains', params).then(json => {
           const listDomains = json.listdomainsresponse.domain
           resolve(listDomains)
         }).catch(error => {
@@ -343,7 +343,7 @@ export default {
     fetchListRoles () {
       return new Promise((resolve, reject) => {
         const params = {}
-        api('listRoles', params).then(json => {
+        getAPI('listRoles', params).then(json => {
           const listRoles = json.listrolesresponse.role
           resolve(listRoles)
         }).catch(error => {
@@ -353,7 +353,7 @@ export default {
     },
     fetchIdps () {
       return new Promise((resolve, reject) => {
-        api('listIdps').then(json => {
+        getAPI('listIdps').then(json => {
           const listIdps = json.listidpsresponse.idp || []
           if (listIdps.length !== 0) {
             this.form.samlEntity = listIdps[0].id
@@ -384,7 +384,7 @@ export default {
           params.group = values.group
           apiName = 'importLdapUsers'
           promises.push(new Promise((resolve, reject) => {
-            api(apiName, params).then(json => {
+            postAPI(apiName, params).then(json => {
               resolve(json)
             }).catch(error => {
               reject(error)
@@ -394,7 +394,7 @@ export default {
           this.selectedRowKeys.forEach(username => {
             params.username = username
             promises.push(new Promise((resolve, reject) => {
-              api(apiName, params).then(json => {
+              postAPI(apiName, params).then(json => {
                 resolve(json)
               }).catch(error => {
                 reject(error)
@@ -467,7 +467,7 @@ export default {
         params.userid = users[i].id
         params.entityid = entityId
         promises.push(new Promise((resolve, reject) => {
-          api('authorizeSamlSso', params).catch(error => {
+          postAPI('authorizeSamlSso', params).catch(error => {
             reject(error)
           })
         }))
diff --git a/ui/src/views/iam/AddUser.vue b/ui/src/views/iam/AddUser.vue
index e922c404ca9f..374d81c51d13 100644
--- a/ui/src/views/iam/AddUser.vue
+++ b/ui/src/views/iam/AddUser.vue
@@ -180,7 +180,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { timeZone } from '@/utils/timezone'
 import debounce from 'lodash/debounce'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -256,7 +256,7 @@ export default {
         showicon: true,
         details: 'min'
       }
-      api('listDomains', params).then(response => {
+      getAPI('listDomains', params).then(response => {
         this.domainsList = response.listdomainsresponse.domain || []
       }).catch(error => {
         this.$notification.error({
@@ -278,7 +278,7 @@ export default {
       if (domainid) {
         params.domainid = domainid
       }
-      api('listAccounts', params).then(response => {
+      getAPI('listAccounts', params).then(response => {
         this.accountList = response.listaccountsresponse.account || []
       }).catch(error => {
         this.$notification.error({
@@ -300,7 +300,7 @@ export default {
     },
     fetchIdps () {
       this.idpLoading = true
-      api('listIdps').then(response => {
+      getAPI('listIdps').then(response => {
         this.idps = response.listidpsresponse.idp || []
         this.form.samlentity = this.idps[0].id || ''
       }).finally(() => {
@@ -331,7 +331,7 @@ export default {
 
         const user = userCreationResponse?.createuserresponse?.user
         if (values.samlenable && user) {
-          await api('authorizeSamlSso', {
+          await postAPI('authorizeSamlSso', {
             enable: values.samlenable,
             entityid: values.samlentity,
             userid: user.id
@@ -385,7 +385,7 @@ export default {
         params.timezone = rawParams.timezone
       }
 
-      return api('createUser', {}, 'POST', params)
+      return postAPI('createUser', params)
     },
     async validateConfirmPassword (rule, value) {
       if (!value || value.length === 0) {
diff --git a/ui/src/views/iam/ChangeUserPassword.vue b/ui/src/views/iam/ChangeUserPassword.vue
index f37b65a1bba3..d5c52b8f637e 100644
--- a/ui/src/views/iam/ChangeUserPassword.vue
+++ b/ui/src/views/iam/ChangeUserPassword.vue
@@ -61,7 +61,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -134,7 +134,7 @@ export default {
         if (this.isValidValueForKey(values, 'currentpassword') && values.currentpassword.length > 0) {
           params.currentpassword = values.currentpassword
         }
-        api('updateUser', {}, 'POST', params).then(json => {
+        postAPI('updateUser', params).then(json => {
           this.$notification.success({
             message: this.$t('label.action.change.password'),
             description: `${this.$t('message.success.change.password')} ${this.resource.username}`
diff --git a/ui/src/views/iam/ConfigureSamlSsoAuth.vue b/ui/src/views/iam/ConfigureSamlSsoAuth.vue
index 15e2b780b64a..89073724c4de 100644
--- a/ui/src/views/iam/ConfigureSamlSsoAuth.vue
+++ b/ui/src/views/iam/ConfigureSamlSsoAuth.vue
@@ -52,7 +52,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 export default {
   name: 'ConfigureSamlSsoAuth',
@@ -81,14 +81,14 @@ export default {
     fetchData () {
       this.IsUserSamlAuthorized()
       this.loading = true
-      api('listIdps').then(response => {
+      getAPI('listIdps').then(response => {
         this.idps = response.listidpsresponse.idp || []
       }).finally(() => {
         this.loading = false
       })
     },
     IsUserSamlAuthorized () {
-      api('listSamlAuthorization', {
+      getAPI('listSamlAuthorization', {
         userid: this.resource.id
       }).then(response => {
         this.form.samlEnable = response.listsamlauthorizationsresponse.samlauthorization[0].status || false
@@ -103,7 +103,7 @@ export default {
       if (this.loading) return
       this.formRef.value.validate().then(() => {
         const values = toRaw(this.form)
-        api('authorizeSamlSso', {
+        postAPI('authorizeSamlSso', {
           enable: values.samlEnable,
           userid: this.resource.id,
           entityid: values.samlEntity
diff --git a/ui/src/views/iam/CreateRole.vue b/ui/src/views/iam/CreateRole.vue
index e3513b62a3f5..3f6013acd808 100644
--- a/ui/src/views/iam/CreateRole.vue
+++ b/ui/src/views/iam/CreateRole.vue
@@ -117,7 +117,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -196,7 +196,7 @@ export default {
     },
     createRole (params) {
       this.loading = true
-      api('createRole', params).then(json => {
+      postAPI('createRole', params).then(json => {
         const role = json.createroleresponse.role
         if (role) {
           this.$emit('refresh-data')
@@ -214,7 +214,7 @@ export default {
     },
     fetchRoles () {
       const params = {}
-      api('listRoles', params).then(json => {
+      getAPI('listRoles', params).then(json => {
         if (json && json.listrolesresponse && json.listrolesresponse.role) {
           this.roles = json.listrolesresponse.role
         }
diff --git a/ui/src/views/iam/DeleteAccount.vue b/ui/src/views/iam/DeleteAccount.vue
index 0e7c6139e4cc..95bc36fbac84 100644
--- a/ui/src/views/iam/DeleteAccount.vue
+++ b/ui/src/views/iam/DeleteAccount.vue
@@ -55,7 +55,7 @@
 
 <script>
 import { ref, reactive } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'DeleteAccount',
@@ -106,7 +106,7 @@ export default {
         this.$router.push({ path: '/account' })
           .then(() => {
             // After successful navigation, start the deletion job
-            api('deleteAccount', {
+            postAPI('deleteAccount', {
               id: accountId
             }).then(response => {
               this.$pollJob({
@@ -128,7 +128,7 @@ export default {
             this.isDeleting = false
             // If navigation fails, still try to delete the account
             // but don't navigate afterwards
-            api('deleteAccount', {
+            postAPI('deleteAccount', {
               id: accountId
             }).then(response => {
               this.$pollJob({
diff --git a/ui/src/views/iam/DomainActionForm.vue b/ui/src/views/iam/DomainActionForm.vue
index ab53a5974e40..8ee185f7e28f 100644
--- a/ui/src/views/iam/DomainActionForm.vue
+++ b/ui/src/views/iam/DomainActionForm.vue
@@ -134,7 +134,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { ref, reactive, toRaw } from 'vue'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -242,7 +242,7 @@ export default {
             delete params[key]
           }
         })
-        api(this.action.api, params).then(json => {
+        postAPI(this.action.api, params).then(json => {
           for (const obj in json) {
             if (obj.includes('response')) {
               for (const res in json[obj]) {
diff --git a/ui/src/views/iam/DomainView.vue b/ui/src/views/iam/DomainView.vue
index ed875151a133..a865b4383b13 100644
--- a/ui/src/views/iam/DomainView.vue
+++ b/ui/src/views/iam/DomainView.vue
@@ -78,7 +78,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import store from '@/store'
 import { mixinDevice } from '@/utils/mixin.js'
 
@@ -173,7 +173,7 @@ export default {
 
       this.loading = true
       params.showicon = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         const domains = json.listdomainsresponse.domain || []
         this.treeData = this.generateTreeData(domains)
         this.resource = domains[0] || {}
@@ -274,23 +274,20 @@ export default {
       }
       param.loading = true
       param.opts = []
-      api(possibleApi, params).then(json => {
-        param.loading = false
-        for (const obj in json) {
-          if (obj.includes('response')) {
-            for (const res in json[obj]) {
-              if (res === 'count') {
-                continue
-              }
-              param.opts = json[obj][res]
-              break
+      postAPI(possibleApi, params)
+        .then(json => {
+          param.loading = false
+          const responseObj = Object.values(json).find(obj => obj.includes('response'))
+          if (responseObj) {
+            const responseData = Object.entries(responseObj).find(([res, value]) => res !== 'count')
+            if (responseData) {
+              param.opts = responseData[1]
             }
-            break
           }
-        }
-      }).catch(() => {
-        param.loading = false
-      })
+        })
+        .catch(() => {
+          param.loading = false
+        })
     },
     generateTreeData (treeData) {
       const result = []
diff --git a/ui/src/views/iam/EditAccount.vue b/ui/src/views/iam/EditAccount.vue
index 7775bb2b8259..011e1a93ec5a 100644
--- a/ui/src/views/iam/EditAccount.vue
+++ b/ui/src/views/iam/EditAccount.vue
@@ -77,7 +77,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -128,7 +128,7 @@ export default {
       this.roleLoading = true
       const params = {}
       params.state = 'enabled'
-      api('listRoles', params).then(response => {
+      getAPI('listRoles', params).then(response => {
         this.roles = response.listrolesresponse.role || []
         this.form.roleid = this.resource.roleid
       }).finally(() => {
@@ -154,7 +154,7 @@ export default {
           params.networkdomain = values.networkdomain
         }
 
-        api('updateAccount', params).then(response => {
+        getAPI('updateAccount', params).then(response => {
           this.$emit('refresh-data')
           this.$notification.success({
             message: this.$t('label.edit.account'),
diff --git a/ui/src/views/iam/EditUser.vue b/ui/src/views/iam/EditUser.vue
index 18f22b6f1e80..c062e545b185 100644
--- a/ui/src/views/iam/EditUser.vue
+++ b/ui/src/views/iam/EditUser.vue
@@ -102,7 +102,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { timeZone } from '@/utils/timezone'
 import debounce from 'lodash/debounce'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -209,7 +209,7 @@ export default {
           params.timezone = values.timezone
         }
 
-        api('updateUser', params).then(response => {
+        postAPI('updateUser', params).then(response => {
           this.$emit('refresh-data')
           this.$notification.success({
             message: this.$t('label.edit.user'),
diff --git a/ui/src/views/iam/ImportRole.vue b/ui/src/views/iam/ImportRole.vue
index 857787244746..c4dcf8f93b7d 100644
--- a/ui/src/views/iam/ImportRole.vue
+++ b/ui/src/views/iam/ImportRole.vue
@@ -105,7 +105,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -207,7 +207,7 @@ export default {
     },
     importRole (params) {
       this.loading = true
-      api('importRole', {}, 'POST', params).then(json => {
+      postAPI('importRole', params).then(json => {
         const role = json.importroleresponse.role
         if (role) {
           this.$emit('refresh-data')
diff --git a/ui/src/views/iam/RolePermissionTab.vue b/ui/src/views/iam/RolePermissionTab.vue
index 18181d4d4074..70e27f3935f0 100644
--- a/ui/src/views/iam/RolePermissionTab.vue
+++ b/ui/src/views/iam/RolePermissionTab.vue
@@ -115,7 +115,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import draggable from 'vuedraggable'
 import PermissionEditable from './PermissionEditable'
 import RuleDelete from './RuleDelete'
@@ -180,7 +180,7 @@ export default {
     },
     fetchData (callback = null) {
       if (!this.resource.id) return
-      api('listRolePermissions', { roleid: this.resource.id }).then(response => {
+      getAPI('listRolePermissions', { roleid: this.resource.id }).then(response => {
         this.rules = response.listrolepermissionsresponse.rolepermission
         this.totalRules = this.rules
       }).catch(error => {
@@ -200,7 +200,7 @@ export default {
     },
     changeOrder () {
       this.updateTable = true
-      api('updateRolePermission', {}, 'POST', {
+      postAPI('updateRolePermission', {
         roleid: this.resource.id,
         ruleorder: this.rules.map(rule => rule.id)
       }).catch(error => {
@@ -212,7 +212,7 @@ export default {
     },
     onRuleDelete (key) {
       this.updateTable = true
-      api('deleteRolePermission', { id: key }).catch(error => {
+      postAPI('deleteRolePermission', { id: key }).catch(error => {
         this.$notifyError(error)
       }).finally(() => {
         this.updateTable = false
@@ -225,7 +225,7 @@ export default {
       if (!record) return
 
       this.updateTable = true
-      api('updateRolePermission', {
+      postAPI('updateRolePermission', {
         roleid: this.resource.id,
         ruleid: record.id,
         permission: value
@@ -247,7 +247,7 @@ export default {
       }
 
       this.updateTable = true
-      api('createRolePermission', {
+      postAPI('createRolePermission', {
         rule: this.newRule,
         permission: this.newRulePermission,
         description: this.newRuleDescription,
diff --git a/ui/src/views/iam/SSLCertificateTab.vue b/ui/src/views/iam/SSLCertificateTab.vue
index 4015e20fdafb..e5890ac13370 100644
--- a/ui/src/views/iam/SSLCertificateTab.vue
+++ b/ui/src/views/iam/SSLCertificateTab.vue
@@ -72,7 +72,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
 export default {
@@ -160,7 +160,7 @@ export default {
 
       this.loading = true
 
-      api('listSslCerts', params).then(json => {
+      getAPI('listSslCerts', params).then(json => {
         const listSslResponse = json.listsslcertsresponse.sslcert
 
         // check exists json response
@@ -191,7 +191,7 @@ export default {
       const message = `${this.$t('label.delete.certificate')} ${this.$t('label.in.progress.for')} ${row.name}`
       const loading = this.$message.loading(message, 0)
 
-      api('deleteSslCert', params).then(json => {
+      postAPI('deleteSslCert', params).then(json => {
         const jsonResponse = json.deletesslcertresponse
 
         // hide loading
diff --git a/ui/src/views/iam/SetupTwoFaAtUserProfile.vue b/ui/src/views/iam/SetupTwoFaAtUserProfile.vue
index df6466a7dc6e..28350a0a8c00 100644
--- a/ui/src/views/iam/SetupTwoFaAtUserProfile.vue
+++ b/ui/src/views/iam/SetupTwoFaAtUserProfile.vue
@@ -130,7 +130,7 @@
 </template>
 <script>
 
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { ref, reactive, toRaw } from 'vue'
 import store from '@/store'
 import VueQrious from 'vue-qrious'
@@ -183,7 +183,7 @@ export default {
     },
     handleSelectChange (val) {
       if (this.twoFAenabled) {
-        api('setupUserTwoFactorAuthentication', { enable: 'false' }).then(response => {
+        postAPI('setupUserTwoFactorAuthentication', { enable: 'false' }).then(response => {
           this.pin = ''
           this.username = ''
           this.totpUrl = ''
@@ -211,7 +211,7 @@ export default {
         } else {
           provider = this.selectedProvider
         }
-        api('setupUserTwoFactorAuthentication', { provider: provider }).then(response => {
+        postAPI('setupUserTwoFactorAuthentication', { provider: provider }).then(response => {
           this.pin = response.setupusertwofactorauthenticationresponse.setup2fa.secretcode
           if (this.selectedProvider === 'totp' || this.selectedProvider === 'othertotp') {
             this.username = response.setupusertwofactorauthenticationresponse.setup2fa.username
@@ -238,7 +238,7 @@ export default {
       })
     },
     disable2FAProvider () {
-      api('setupUserTwoFactorAuthentication', { enable: false }).then(response => {
+      postAPI('setupUserTwoFactorAuthentication', { enable: false }).then(response => {
         this.showPin = false
         this.twoFAenabled = false
         this.twoFAverified = false
@@ -250,7 +250,7 @@ export default {
       })
     },
     list2FAProviders () {
-      api('listUserTwoFactorAuthenticatorProviders', {}).then(response => {
+      getAPI('listUserTwoFactorAuthenticatorProviders', {}).then(response => {
         var providerlist = response.listusertwofactorauthenticatorprovidersresponse.providers || []
         var providernames = []
         for (const provider of providerlist) {
@@ -268,7 +268,7 @@ export default {
         if (values.code !== null) {
           this.verifybuttonstate = true
         }
-        api('validateUserTwoFactorAuthenticationCode', { codefor2fa: values.code }).then(response => {
+        postAPI('validateUserTwoFactorAuthenticationCode', { codefor2fa: values.code }).then(response => {
           this.$message.success({
             content: `${this.$t('label.action.enable.two.factor.authentication')}`,
             duration: 2
diff --git a/ui/src/views/image/AddKubernetesSupportedVersion.vue b/ui/src/views/image/AddKubernetesSupportedVersion.vue
index 4043ba46f7dd..f7b388d0a7fd 100644
--- a/ui/src/views/image/AddKubernetesSupportedVersion.vue
+++ b/ui/src/views/image/AddKubernetesSupportedVersion.vue
@@ -137,7 +137,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -229,7 +229,7 @@ export default {
       const params = {}
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZones = json.listzonesresponse.zone
         if (listZones) {
           this.zones = this.zones.concat(listZones)
@@ -281,7 +281,7 @@ export default {
         if (this.isValidValueForKey(values, 'minmemory') && values.minmemory > 0) {
           params.minmemory = values.minmemory
         }
-        api('addKubernetesSupportedVersion', params).then(json => {
+        postAPI('addKubernetesSupportedVersion', params).then(json => {
           this.$message.success(`${this.$t('message.success.add.kuberversion')}: ${values.semanticversion}`)
           this.$emit('refresh-data')
           this.closeAction()
diff --git a/ui/src/views/image/IsoZones.vue b/ui/src/views/image/IsoZones.vue
index 8702aba0f7c2..a3d62c327145 100644
--- a/ui/src/views/image/IsoZones.vue
+++ b/ui/src/views/image/IsoZones.vue
@@ -210,7 +210,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import OsLogo from '@/components/widgets/OsLogo'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -369,7 +369,7 @@ export default {
       this.dataSource = []
       this.itemCount = 0
       this.fetchLoading = true
-      api('listIsos', params).then(json => {
+      getAPI('listIsos', params).then(json => {
         this.dataSource = json.listisosresponse.iso || []
         this.itemCount = json.listisosresponse.count || 0
       }).catch(error => {
@@ -455,7 +455,7 @@ export default {
         zoneid: record.zoneid
       }
       this.deleteLoading = true
-      api('deleteIso', params).then(json => {
+      postAPI('deleteIso', params).then(json => {
         const jobId = json.deleteisoresponse.jobid
         eventBus.emit('update-job-details', { jobId, resourceId: null })
         const singleZone = (this.dataSource.length === 1)
@@ -504,7 +504,7 @@ export default {
     fetchZoneData () {
       this.zones = []
       this.zoneLoading = true
-      api('listZones', { showicon: true }).then(json => {
+      getAPI('listZones', { showicon: true }).then(json => {
         const zones = json.listzonesresponse.zone || []
         this.zones = zones
         this.copyZones = [...zones.filter((zone) => this.currentRecord.zoneid !== zone.id)]
@@ -539,7 +539,7 @@ export default {
       if (!needed) {
         return
       }
-      api('listOsTypes', { id: this.resource.ostypeid }).then(json => {
+      getAPI('listOsTypes', { id: this.resource.ostypeid }).then(json => {
         this.osCategoryId = json?.listostypesresponse?.ostype?.[0]?.oscategoryid || null
       })
     },
@@ -564,7 +564,7 @@ export default {
           destzoneids: values.zoneid.join()
         }
         this.copyLoading = true
-        api('copyIso', params).then(json => {
+        postAPI('copyIso', params).then(json => {
           const jobId = json.copytemplateresponse.jobid
           eventBus.emit('update-job-details', { jobId, resourceId: null })
           this.$pollJob({
diff --git a/ui/src/views/image/RegisterOrUploadIso.vue b/ui/src/views/image/RegisterOrUploadIso.vue
index 6c26f08b581e..cb86d745e3cd 100644
--- a/ui/src/views/image/RegisterOrUploadIso.vue
+++ b/ui/src/views/image/RegisterOrUploadIso.vue
@@ -307,7 +307,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import store from '@/store'
 import { axios } from '../../utils/request'
 import { mixinForm } from '@/utils/mixin'
@@ -408,7 +408,7 @@ export default {
       if (store.getters.userInfo.roletype === 'Admin') {
         this.allowed = true
       }
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZones = json.listzonesresponse.zone
         if (listZones) {
           this.zones = this.zones.concat(listZones)
@@ -422,7 +422,7 @@ export default {
     fetchOsType () {
       this.osTypeLoading = true
 
-      api('listOsTypes').then(json => {
+      getAPI('listOsTypes').then(json => {
         const listOsTypes = json.listostypesresponse.ostype
         this.osTypes = this.osTypes.concat(listOsTypes)
       }).finally(() => {
@@ -437,7 +437,7 @@ export default {
       this.userdata.opts = []
       this.userdata.loading = true
 
-      api('listUserData', params).then(json => {
+      getAPI('listUserData', params).then(json => {
         const listUserdata = json.listuserdataresponse.userdata
         this.userdata.opts = listUserdata
       }).finally(() => {
@@ -545,7 +545,7 @@ export default {
 
         if (this.currentForm === 'Create') {
           this.loading = true
-          api('registerIso', params).then(json => {
+          postAPI('registerIso', params).then(json => {
             if (this.userdataid !== null) {
               this.linkUserdataToTemplate(this.userdataid, json.registerisoresponse.iso[0].id, this.userdatapolicy)
             }
@@ -566,7 +566,7 @@ export default {
           }
           params.format = 'ISO'
           this.loading = true
-          api('getUploadParamsForIso', params).then(json => {
+          getAPI('getUploadParamsForIso', params).then(json => {
             this.uploadParams = (json.postuploadisoresponse && json.postuploadisoresponse.getuploadparams) ? json.postuploadisoresponse.getuploadparams : ''
             const response = this.handleUpload()
             if (this.userdataid !== null) {
@@ -600,7 +600,7 @@ export default {
       if (userdatapolicy) {
         params.userdatapolicy = userdatapolicy
       }
-      api('linkUserDataToTemplate', params).then(json => {
+      postAPI('linkUserDataToTemplate', params).then(json => {
         this.closeAction()
       }).catch(error => {
         this.$notifyError(error)
@@ -614,7 +614,7 @@ export default {
       params.showicon = true
       params.details = 'min'
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         this.domains = json.listdomainsresponse.domain
       }).finally(() => {
         this.domainLoading = false
@@ -630,7 +630,7 @@ export default {
       }
     },
     fetchAccounts () {
-      api('listAccounts', {
+      getAPI('listAccounts', {
         domainid: this.domainid
       }).then(response => {
         this.accounts = response.listaccountsresponse.account || []
diff --git a/ui/src/views/image/RegisterOrUploadTemplate.vue b/ui/src/views/image/RegisterOrUploadTemplate.vue
index 446f3a9576c8..7467d965b870 100644
--- a/ui/src/views/image/RegisterOrUploadTemplate.vue
+++ b/ui/src/views/image/RegisterOrUploadTemplate.vue
@@ -473,7 +473,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import store from '@/store'
 import { axios } from '../../utils/request'
 import { mixinForm } from '@/utils/mixin'
@@ -655,7 +655,7 @@ export default {
         name: 'hypervisor.custom.display.name'
       }
       this.loading = true
-      api('listConfigurations', params).then(json => {
+      getAPI('listConfigurations', params).then(json => {
         if (json.listconfigurationsresponse.configuration !== null) {
           const config = json.listconfigurationsresponse.configuration[0]
           if (config && config.name === params.name) {
@@ -684,7 +684,7 @@ export default {
       this.zones.loading = true
       this.zones.opts = []
 
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZonesResponse = json.listzonesresponse.zone
         listZones = listZones.concat(listZonesResponse)
         this.zones.opts = listZones
@@ -703,7 +703,7 @@ export default {
       this.hyperVisor.loading = true
       let listhyperVisors = this.hyperVisor.opts || []
 
-      api('listHypervisors', params).then(json => {
+      getAPI('listHypervisors', params).then(json => {
         const listResponse = json.listhypervisorsresponse.hypervisor || []
         if (listResponse) {
           listhyperVisors = listhyperVisors.concat(listResponse)
@@ -722,7 +722,7 @@ export default {
       this.osTypes.opts = []
       this.osTypes.loading = true
 
-      api('listOsTypes').then(json => {
+      getAPI('listOsTypes').then(json => {
         const listOsTypes = json.listostypesresponse.ostype
         this.osTypes.opts = listOsTypes
         this.defaultOsType = this.osTypes.opts[1].description
@@ -738,7 +738,7 @@ export default {
       this.userdata.opts = []
       this.userdata.loading = true
 
-      api('listUserData', params).then(json => {
+      getAPI('listUserData', params).then(json => {
         const listUserdata = json.listuserdataresponse.userdata
         this.userdata.opts = listUserdata
       }).finally(() => {
@@ -751,7 +751,7 @@ export default {
 
       this.form.xenserverToolsVersion61plus = true
 
-      api('listConfigurations', params).then(json => {
+      getAPI('listConfigurations', params).then(json => {
         if (json.listconfigurationsresponse.configuration !== null && json.listconfigurationsresponse.configuration[0].value !== 'xenserver61') {
           this.form.xenserverToolsVersion61plus = false
         }
@@ -1079,7 +1079,7 @@ export default {
         }
         if (this.currentForm === 'Create') {
           this.loading = true
-          api('registerTemplate', params).then(json => {
+          postAPI('registerTemplate', params).then(json => {
             if (this.userdataid !== null) {
               this.linkUserdataToTemplate(this.userdataid, json.registertemplateresponse.template[0].id, this.userdatapolicy)
             }
@@ -1103,7 +1103,7 @@ export default {
               duration: 0
             })
           }
-          api('getUploadParamsForTemplate', params).then(json => {
+          getAPI('getUploadParamsForTemplate', params).then(json => {
             this.uploadParams = (json.postuploadtemplateresponse && json.postuploadtemplateresponse.getuploadparams) ? json.postuploadtemplateresponse.getuploadparams : ''
             this.handleUpload()
             if (this.userdataid !== null) {
@@ -1145,7 +1145,7 @@ export default {
       if (userdatapolicy) {
         params.userdatapolicy = userdatapolicy
       }
-      api('linkUserDataToTemplate', params).then(json => {
+      postAPI('linkUserDataToTemplate', params).then(json => {
         this.closeAction()
       }).catch(error => {
         this.$notifyError(error)
@@ -1164,7 +1164,7 @@ export default {
       params.showicon = true
       params.details = 'min'
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         this.domains = json.listdomainsresponse.domain
       }).finally(() => {
         this.domainLoading = false
@@ -1180,7 +1180,7 @@ export default {
       }
     },
     fetchAccounts () {
-      api('listAccounts', {
+      getAPI('listAccounts', {
         domainid: this.domainid
       }).then(response => {
         this.accounts = response.listaccountsresponse.account || []
diff --git a/ui/src/views/image/TemplateVnfSettings.vue b/ui/src/views/image/TemplateVnfSettings.vue
index 401e6a4fd830..8dc8882dab73 100644
--- a/ui/src/views/image/TemplateVnfSettings.vue
+++ b/ui/src/views/image/TemplateVnfSettings.vue
@@ -381,7 +381,7 @@
 
 <script>
 import { ref, reactive } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -533,7 +533,7 @@ export default {
           }
         })
       }
-      api('listDetailOptions', { resourcetype: this.resourceType }).then(json => {
+      getAPI('listDetailOptions', { resourcetype: this.resourceType }).then(json => {
         this.vnfDetailOptionsInApi = json.listdetailoptionsresponse.detailoptions.details
         this.vnfDetailOptions = {}
         Object.keys(this.vnfDetailOptionsInApi).sort().forEach(k => {
@@ -719,7 +719,7 @@ export default {
         }
       }
 
-      api(apiName, params).then(json => {
+      postAPI(apiName, params).then(json => {
         this.vnfNics = json.updatetemplateresponse.template.vnfnics || []
         const details = json.updatetemplateresponse.template.vnfdetails || []
         this.vnfDetails = Object.keys(details).map(k => {
diff --git a/ui/src/views/image/TemplateZones.vue b/ui/src/views/image/TemplateZones.vue
index 2889e7478674..bcfe61be5240 100644
--- a/ui/src/views/image/TemplateZones.vue
+++ b/ui/src/views/image/TemplateZones.vue
@@ -255,7 +255,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import OsLogo from '@/components/widgets/OsLogo'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipButton from '@/components/widgets/TooltipButton'
@@ -418,7 +418,7 @@ export default {
       this.dataSource = []
       this.itemCount = 0
       this.fetchLoading = true
-      api('listTemplates', params).then(json => {
+      getAPI('listTemplates', params).then(json => {
         this.dataSource = json.listtemplatesresponse.template || []
         this.itemCount = json.listtemplatesresponse.count || 0
       }).catch(error => {
@@ -522,7 +522,7 @@ export default {
         zoneid: template.zoneid
       }
       this.deleteLoading = true
-      api('deleteTemplate', params).then(json => {
+      postAPI('deleteTemplate', params).then(json => {
         const jobId = json.deletetemplateresponse.jobid
         eventBus.emit('update-job-details', { jobId, resourceId: null })
         const singleZone = (this.dataSource.length === 1)
@@ -572,7 +572,7 @@ export default {
     fetchZoneData () {
       this.zones = []
       this.zoneLoading = true
-      api('listZones', { showicon: true }).then(json => {
+      getAPI('listZones', { showicon: true }).then(json => {
         const zones = json.listzonesresponse.zone || []
         this.zones = zones
         this.copyZones = [...zones.filter((zone) => this.currentRecord.zoneid !== zone.id)]
@@ -607,7 +607,7 @@ export default {
       if (!needed) {
         return
       }
-      api('listOsTypes', { id: this.resource.ostypeid }).then(json => {
+      getAPI('listOsTypes', { id: this.resource.ostypeid }).then(json => {
         this.osCategoryId = json?.listostypesresponse?.ostype?.[0]?.oscategoryid || null
       })
     },
@@ -646,7 +646,7 @@ export default {
           destzoneids: values.zoneid.join()
         }
         this.copyLoading = true
-        api('copyTemplate', params).then(json => {
+        postAPI('copyTemplate', params).then(json => {
           const jobId = json.copytemplateresponse.jobid
           eventBus.emit('update-job-details', { jobId, resourceId: null })
           this.$pollJob({
diff --git a/ui/src/views/image/UpdateISO.vue b/ui/src/views/image/UpdateISO.vue
index 00e1cc536c28..856038f2d5f9 100644
--- a/ui/src/views/image/UpdateISO.vue
+++ b/ui/src/views/image/UpdateISO.vue
@@ -150,7 +150,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -228,7 +228,7 @@ export default {
       params.listAll = true
       this.osTypes.opts = []
       this.osTypes.loading = true
-      api('listOsTypes', params).then(json => {
+      getAPI('listOsTypes', params).then(json => {
         const listOsTypes = json.listostypesresponse.ostype
         this.osTypes.opts = listOsTypes
       }).finally(() => {
@@ -262,7 +262,7 @@ export default {
       this.userdata.opts = []
       this.userdata.loading = true
 
-      api('listUserData', params).then(json => {
+      getAPI('listUserData', params).then(json => {
         const userdataIdAndName = []
         const userdataOpts = json.listuserdataresponse.userdata
         userdataIdAndName.push({
@@ -295,7 +295,7 @@ export default {
           if (!this.isValidValueForKey(values, key)) continue
           params[key] = values[key]
         }
-        api('updateIso', params).then(json => {
+        postAPI('updateIso', params).then(json => {
           if (this.userdataid !== null) {
             this.linkUserdataToTemplate(this.userdataid, json.updateisoresponse.iso.id, this.userdatapolicy)
           }
@@ -325,7 +325,7 @@ export default {
       if (userdatapolicy) {
         params.userdatapolicy = userdatapolicy
       }
-      api('linkUserDataToTemplate', params).then(json => {
+      postAPI('linkUserDataToTemplate', params).then(json => {
         this.closeAction()
       }).catch(error => {
         this.$notifyError(error)
diff --git a/ui/src/views/image/UpdateKubernetesSupportedVersion.vue b/ui/src/views/image/UpdateKubernetesSupportedVersion.vue
index 8d2b4e47a353..2bb93e4c7c0a 100644
--- a/ui/src/views/image/UpdateKubernetesSupportedVersion.vue
+++ b/ui/src/views/image/UpdateKubernetesSupportedVersion.vue
@@ -52,7 +52,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'UpdateKubernetesSupportedVersion',
@@ -127,7 +127,7 @@ export default {
         if (this.isValidValueForKey(values, 'state') && this.arrayHasItems(this.states)) {
           params.state = this.states[values.state].id
         }
-        api('updateKubernetesSupportedVersion', params).then(json => {
+        postAPI('updateKubernetesSupportedVersion', params).then(json => {
           this.$message.success(`${this.$t('message.success.update.kubeversion')}: ${this.resource.name}`)
           this.$emit('refresh-data')
           this.closeAction()
diff --git a/ui/src/views/image/UpdateTemplate.vue b/ui/src/views/image/UpdateTemplate.vue
index 23a4f33acdab..75a41accecba 100644
--- a/ui/src/views/image/UpdateTemplate.vue
+++ b/ui/src/views/image/UpdateTemplate.vue
@@ -223,7 +223,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -334,7 +334,7 @@ export default {
       params.listAll = true
       this.osTypes.opts = []
       this.osTypes.loading = true
-      api('listOsTypes', params).then(json => {
+      getAPI('listOsTypes', params).then(json => {
         const listOsTypes = json.listostypesresponse.ostype
         this.osTypes.opts = listOsTypes
       }).finally(() => {
@@ -472,7 +472,7 @@ export default {
       this.userdata.opts = []
       this.userdata.loading = true
 
-      api('listUserData', params).then(json => {
+      getAPI('listUserData', params).then(json => {
         const userdataIdAndName = []
         const userdataOpts = json.listuserdataresponse.userdata
         userdataIdAndName.push({
@@ -510,7 +510,7 @@ export default {
           }
           params[key] = values[key]
         }
-        api('updateTemplate', params).then(json => {
+        postAPI('updateTemplate', params).then(json => {
           if (this.userdataid !== null) {
             this.linkUserdataToTemplate(this.userdataid, json.updatetemplateresponse.template.id, this.userdatapolicy)
           }
@@ -539,7 +539,7 @@ export default {
       if (userdatapolicy) {
         params.userdatapolicy = userdatapolicy
       }
-      api('linkUserDataToTemplate', params).then(json => {
+      postAPI('linkUserDataToTemplate', params).then(json => {
         this.closeAction()
       }).catch(error => {
         this.$notifyError(error)
diff --git a/ui/src/views/image/UpdateTemplateIsoPermissions.vue b/ui/src/views/image/UpdateTemplateIsoPermissions.vue
index 557574156b17..1d92c52acff8 100644
--- a/ui/src/views/image/UpdateTemplateIsoPermissions.vue
+++ b/ui/src/views/image/UpdateTemplateIsoPermissions.vue
@@ -126,7 +126,7 @@
   </div>
 </template>
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
 export default {
@@ -199,7 +199,7 @@ export default {
     },
     fetchAccounts () {
       this.loading = true
-      api('listAccounts', {
+      getAPI('listAccounts', {
         domainid: this.resource.domainid,
         showicon: true
       }).then(response => {
@@ -209,7 +209,7 @@ export default {
       })
     },
     fetchProjects () {
-      api('listProjects', {
+      getAPI('listProjects', {
         details: 'min',
         showicon: true,
         listall: true
@@ -221,7 +221,7 @@ export default {
     },
     fetchTemplatePermissions () {
       this.loading = true
-      api('listTemplatePermissions', {
+      getAPI('listTemplatePermissions', {
         id: this.resource.id
       }).then(response => {
         const permission = response.listtemplatepermissionsresponse.templatepermission
@@ -237,7 +237,7 @@ export default {
     },
     fetchIsoPermissions () {
       this.loading = true
-      api('listIsoPermissions', {
+      getAPI('listIsoPermissions', {
         id: this.resource.id
       }).then(response => {
         const permission = response.listtemplatepermissionsresponse.templatepermission
@@ -281,7 +281,7 @@ export default {
       this.loading = true
       const apiName = this.isImageTypeIso ? 'updateIsoPermissions' : 'updateTemplatePermissions'
       const resourceType = this.isImageTypeIso ? 'ISO' : 'template'
-      api(apiName, {
+      postAPI(apiName, {
         [variableKey]: variableValue,
         id: this.resource.id,
         ispublic: this.resource.isPublic,
diff --git a/ui/src/views/infra/AddObjectStorage.vue b/ui/src/views/infra/AddObjectStorage.vue
index 38c2e7661971..dca3b719b6c7 100644
--- a/ui/src/views/infra/AddObjectStorage.vue
+++ b/ui/src/views/infra/AddObjectStorage.vue
@@ -92,7 +92,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
@@ -189,7 +189,7 @@ export default {
     },
     addObjectStore (params) {
       return new Promise((resolve, reject) => {
-        api('addObjectStoragePool', params).then(json => {
+        getAPI('addObjectStoragePool', params).then(json => {
           resolve()
         }).catch(error => {
           reject(error)
diff --git a/ui/src/views/infra/AddPrimaryStorage.vue b/ui/src/views/infra/AddPrimaryStorage.vue
index 01532f3071b8..d46396bbb3a5 100644
--- a/ui/src/views/infra/AddPrimaryStorage.vue
+++ b/ui/src/views/infra/AddPrimaryStorage.vue
@@ -430,7 +430,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import _ from 'lodash'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -526,7 +526,7 @@ export default {
     },
     getInfraData () {
       this.loading = true
-      api('listZones', { showicon: true }).then(json => {
+      getAPI('listZones', { showicon: true }).then(json => {
         this.zones = json.listzonesresponse.zone || []
         this.changeZone(this.zones[0] ? this.zones[0].id : '')
       }).finally(() => {
@@ -548,7 +548,7 @@ export default {
         this.form.pod = ''
         return
       }
-      api('listPods', {
+      getAPI('listPods', {
         zoneid: this.form.zone
       }).then(json => {
         this.pods = json.listpodsresponse.pod || []
@@ -561,7 +561,7 @@ export default {
         this.form.cluster = ''
         return
       }
-      api('listClusters', {
+      getAPI('listClusters', {
         podid: this.form.pod
       }).then(json => {
         this.clusters = json.listclustersresponse.cluster || []
@@ -570,7 +570,7 @@ export default {
           this.fetchHypervisor()
         }
       }).then(() => {
-        api('listHosts', {
+        getAPI('listHosts', {
           clusterid: this.form.cluster
         }).then(json => {
           this.hosts = json.listhostsresponse.host || []
@@ -583,7 +583,7 @@ export default {
     listStorageProviders () {
       this.providers = []
       this.loading = true
-      api('listStorageProviders', { type: 'primary' }).then(json => {
+      getAPI('listStorageProviders', { type: 'primary' }).then(json => {
         var providers = json.liststorageprovidersresponse.dataStoreProvider || []
         for (const provider of providers) {
           this.providers.push(provider.name)
@@ -594,7 +594,7 @@ export default {
     },
     listStorageTags () {
       this.loading = true
-      api('listStorageTags').then(json => {
+      getAPI('listStorageTags').then(json => {
         this.storageTags = json.liststoragetagsresponse.storagetag || []
         if (this.storageTags) {
           this.storageTags = _.uniqBy(this.storageTags, 'name')
@@ -928,7 +928,7 @@ export default {
           params.tags = this.selectedTags.join()
         }
         this.loading = true
-        api('createStoragePool', {}, 'POST', params).then(json => {
+        postAPI('createStoragePool', params).then(json => {
           this.$notification.success({
             message: this.$t('label.add.primary.storage'),
             description: this.$t('label.add.primary.storage')
diff --git a/ui/src/views/infra/AddSecondaryStorage.vue b/ui/src/views/infra/AddSecondaryStorage.vue
index 4adc4e9a1d64..7c3ef7fd437f 100644
--- a/ui/src/views/infra/AddSecondaryStorage.vue
+++ b/ui/src/views/infra/AddSecondaryStorage.vue
@@ -169,7 +169,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
@@ -230,7 +230,7 @@ export default {
       this.$emit('close-action')
     },
     listZones () {
-      api('listZones', { showicon: true }).then(json => {
+      getAPI('listZones', { showicon: true }).then(json => {
         if (json && json.listzonesresponse && json.listzonesresponse.zone) {
           this.zones = json.listzonesresponse.zone
           if (this.zones.length > 0) {
@@ -385,7 +385,7 @@ export default {
     },
     addImageStore (params) {
       return new Promise((resolve, reject) => {
-        api('addImageStore', params).then(json => {
+        postAPI('addImageStore', params).then(json => {
           resolve()
         }).catch(error => {
           reject(error)
@@ -394,7 +394,7 @@ export default {
     },
     createSecondaryStagingStore (params) {
       return new Promise((resolve, reject) => {
-        api('createSecondaryStagingStore', params).then(json => {
+        postAPI('createSecondaryStagingStore', params).then(json => {
           resolve()
         }).catch(error => {
           reject(error)
diff --git a/ui/src/views/infra/AsyncJobsTab.vue b/ui/src/views/infra/AsyncJobsTab.vue
index 7b514a4eca95..19fe4486c594 100644
--- a/ui/src/views/infra/AsyncJobsTab.vue
+++ b/ui/src/views/infra/AsyncJobsTab.vue
@@ -36,7 +36,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -91,7 +91,7 @@ export default {
   methods: {
     fetchData () {
       this.jobs = []
-      api('listAsyncJobs', {
+      getAPI('listAsyncJobs', {
         listall: true,
         isrecursive: true,
         managementserverid: this.resource.id
diff --git a/ui/src/views/infra/ChangeHostPassword.vue b/ui/src/views/infra/ChangeHostPassword.vue
index d67b8413d8d2..37513e2f8c13 100644
--- a/ui/src/views/infra/ChangeHostPassword.vue
+++ b/ui/src/views/infra/ChangeHostPassword.vue
@@ -60,7 +60,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -116,7 +116,7 @@ export default {
           hostId: this.resource.id,
           password: values.password
         }
-        api('updateHostPassword', {}, 'POST', params).then(json => {
+        postAPI('updateHostPassword', params).then(json => {
           this.$notification.success({
             message: this.$t('label.action.change.password'),
             description: `${this.$t('message.success.change.host.password', { name: this.resource.name })}`
diff --git a/ui/src/views/infra/ChangeStoragePoolScope.vue b/ui/src/views/infra/ChangeStoragePoolScope.vue
index 1e1c14201b9a..7c1565fe9590 100644
--- a/ui/src/views/infra/ChangeStoragePoolScope.vue
+++ b/ui/src/views/infra/ChangeStoragePoolScope.vue
@@ -68,7 +68,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import DedicateDomain from '../../components/view/DedicateDomain'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -119,7 +119,7 @@ export default {
       if (!zoneId) return
       this.zoneId = zoneId
       this.loading = true
-      api('listClusters', { zoneid: zoneId }).then(response => {
+      getAPI('listClusters', { zoneid: zoneId }).then(response => {
         this.clustersList = response.listclustersresponse.cluster || []
         this.form.clusterid = this.clustersList[0].id || null
         if (this.form.clusterid) {
@@ -166,7 +166,7 @@ export default {
       this.$emit('close-action')
     },
     changeStoragePoolScope (args) {
-      api('changeStoragePoolScope', args).then(json => {
+      postAPI('changeStoragePoolScope', args).then(json => {
         this.$pollJob({
           jobId: json.changestoragepoolscoperesponse.jobid,
           title: this.$t('message.success.change.scope'),
diff --git a/ui/src/views/infra/ClusterAdd.vue b/ui/src/views/infra/ClusterAdd.vue
index 0a55544058d5..f59521588de5 100644
--- a/ui/src/views/infra/ClusterAdd.vue
+++ b/ui/src/views/infra/ClusterAdd.vue
@@ -157,7 +157,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import DedicateDomain from '../../components/view/DedicateDomain'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
@@ -220,7 +220,7 @@ export default {
     },
     fetchZones () {
       this.loading = true
-      api('listZones', { showicon: true }).then(response => {
+      getAPI('listZones', { showicon: true }).then(response => {
         this.zonesList = response.listzonesresponse.zone || []
         this.zoneId = this.zonesList[0].id || null
         this.fetchPods()
@@ -232,7 +232,7 @@ export default {
     },
     fetchHypervisors () {
       this.loading = true
-      api('listHypervisors').then(response => {
+      getAPI('listHypervisors').then(response => {
         this.hypervisorsList = response.listhypervisorsresponse.hypervisor || []
         this.hypervisor = this.hypervisorsList[0].name || null
       }).catch(error => {
@@ -243,7 +243,7 @@ export default {
     },
     fetchPods () {
       this.loading = true
-      api('listPods', {
+      getAPI('listPods', {
         zoneid: this.zoneId
       }).then(response => {
         this.podsList = response.listpodsresponse.pod || []
@@ -257,7 +257,7 @@ export default {
     fetchVMwareCred () {
       this.loading = true
       this.clustertype = 'ExternalManaged'
-      api('listVmwareDcs', {
+      getAPI('listVmwareDcs', {
         zoneid: this.zoneId
       }).then(response => {
         var vmwaredcs = response.listvmwaredcsresponse.VMwareDC
@@ -342,7 +342,7 @@ export default {
       if (this.password) {
         data.password = this.password
       }
-      api('addCluster', {}, 'POST', data).then(response => {
+      postAPI('addCluster', data).then(response => {
         const cluster = response.addclusterresponse.cluster[0] || {}
         if (cluster.id && this.showDedicated) {
           this.dedicateCluster(cluster.id)
@@ -362,7 +362,7 @@ export default {
     },
     dedicateCluster (clusterId) {
       this.loading = true
-      api('dedicateCluster', {
+      postAPI('dedicateCluster', {
         clusterId,
         domainId: this.dedicatedDomainId,
         account: this.dedicatedAccount
diff --git a/ui/src/views/infra/ClusterDRSTab.vue b/ui/src/views/infra/ClusterDRSTab.vue
index d53199ced87a..24fc87fe7e68 100644
--- a/ui/src/views/infra/ClusterDRSTab.vue
+++ b/ui/src/views/infra/ClusterDRSTab.vue
@@ -152,7 +152,7 @@
 <script>
 
 import { reactive } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 export default {
   name: 'ClusterDrsTab',
@@ -244,7 +244,7 @@ export default {
   methods: {
     fetchDRSPlans () {
       if (!this.resource || !this.resource.id) return
-      api('listClusterDrsPlan', { page: 1, pageSize: 500, clusterid: this.resource.id }).then(json => {
+      getAPI('listClusterDrsPlan', { page: 1, pageSize: 500, clusterid: this.resource.id }).then(json => {
         this.drsPlans = json.listclusterdrsplanresponse.drsPlan
       })
     },
@@ -259,7 +259,7 @@ export default {
         params['migrateto[' + i + '].host'] = mapping.destinationhostid
       }
 
-      api('executeClusterDrsPlan', params).then(json => {
+      postAPI('executeClusterDrsPlan', params).then(json => {
         this.$message.success(this.$t('message.drs.plan.executed'))
       }).catch(error => {
         console.error(error)
@@ -271,7 +271,7 @@ export default {
     },
     generateDrsPlan () {
       this.loading = true
-      api('generateClusterDrsPlan', { id: this.resource.id, migrations: this.maxMigrations }).then(json => {
+      postAPI('generateClusterDrsPlan', { id: this.resource.id, migrations: this.maxMigrations }).then(json => {
         this.generatedMigrations = json?.generateclusterdrsplanresponse?.generateclusterdrsplanresponse?.migrations || []
         this.loading = false
         this.showModal = true
@@ -279,9 +279,9 @@ export default {
     },
     fetchDrsConfig () {
       this.loading = true
-      api('listConfigurations', { clusterid: this.resource.id, name: 'drs.algorithm' }).then(json => {
+      getAPI('listConfigurations', { clusterid: this.resource.id, name: 'drs.algorithm' }).then(json => {
         this.algorithm = json.listconfigurationsresponse.configuration[0].value
-        api('listConfigurations', { clusterid: this.resource.id, name: 'drs.max.migrations' }).then(json => {
+        getAPI('listConfigurations', { clusterid: this.resource.id, name: 'drs.max.migrations' }).then(json => {
           this.maxMigrations = json.listconfigurationsresponse.configuration[0].value
           this.loading = false
         }).catch((err) => {
diff --git a/ui/src/views/infra/ClusterUpdate.vue b/ui/src/views/infra/ClusterUpdate.vue
index c2f295c008d2..a0284a6f6c8f 100644
--- a/ui/src/views/infra/ClusterUpdate.vue
+++ b/ui/src/views/infra/ClusterUpdate.vue
@@ -82,7 +82,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -130,7 +130,7 @@ export default {
     fetchStorageAccessGroupsData () {
       const params = {}
       this.storageAccessGroupsLoading = true
-      api('listStorageAccessGroups', params).then(json => {
+      getAPI('listStorageAccessGroups', params).then(json => {
         const sags = json.liststorageaccessgroupsresponse.storageaccessgroup || []
         for (const sag of sags) {
           if (!this.storageAccessGroups.includes(sag.name)) {
@@ -168,7 +168,7 @@ export default {
         params.clustername = values.name
         this.loading = true
 
-        api('updateCluster', params).then(json => {
+        postAPI('updateCluster', params).then(json => {
           this.$message.success({
             content: `${this.$t('label.action.update.cluster')} - ${values.name}`,
             duration: 2
@@ -181,7 +181,7 @@ export default {
           }
 
           if (params.storageaccessgroups !== undefined && (this.resource.storageaccessgroups ? this.resource.storageaccessgroups.split(',').join(',') : '') !== params.storageaccessgroups) {
-            api('configureStorageAccess', {
+            postAPI('configureStorageAccess', {
               clusterid: params.id,
               storageaccessgroups: params.storageaccessgroups
             }).then(response => {
diff --git a/ui/src/views/infra/ConfigureHostOOBM.vue b/ui/src/views/infra/ConfigureHostOOBM.vue
index d80ac68fc067..a873baab83fe 100644
--- a/ui/src/views/infra/ConfigureHostOOBM.vue
+++ b/ui/src/views/infra/ConfigureHostOOBM.vue
@@ -91,7 +91,7 @@
 <script>
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'ConfigureHostOOBM',
@@ -145,7 +145,7 @@ export default {
           driver: values.driver
         }
 
-        api('configureOutOfBandManagement', {}, 'POST', params).then(_ => {
+        postAPI('configureOutOfBandManagement', params).then(_ => {
           this.$message.success(this.$t('message.oobm.configured'))
           this.$emit('refresh-data')
           this.onCloseAction()
diff --git a/ui/src/views/infra/Confirmation.vue b/ui/src/views/infra/Confirmation.vue
index ea7b841522db..6f9084dc8141 100644
--- a/ui/src/views/infra/Confirmation.vue
+++ b/ui/src/views/infra/Confirmation.vue
@@ -78,7 +78,7 @@
 
 <script>
 
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { ref, reactive } from 'vue'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -142,7 +142,7 @@ export default {
           params.algorithm = this.form.algorithm
         }
         params.forced = this.form.forced
-        api(this.action.currentAction.api, params).then(() => {
+        postAPI(this.action.currentAction.api, params).then(() => {
           this.$message.success(this.$t(this.action.currentAction.label) + ' : ' + this.resource.name)
           this.closeAction()
           this.parentFetchData()
diff --git a/ui/src/views/infra/ConnectedAgentsTab.vue b/ui/src/views/infra/ConnectedAgentsTab.vue
index f7fcbc95fca7..c83182dcfe0f 100644
--- a/ui/src/views/infra/ConnectedAgentsTab.vue
+++ b/ui/src/views/infra/ConnectedAgentsTab.vue
@@ -31,7 +31,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -76,7 +76,7 @@ export default {
   methods: {
     fetchData () {
       this.hostAgents = []
-      api('listHosts', {
+      getAPI('listHosts', {
         listall: true,
         managementserverid: this.resource.id
       }).then(json => {
diff --git a/ui/src/views/infra/CpuSockets.vue b/ui/src/views/infra/CpuSockets.vue
index 97b27221647f..f3ffe67e1aa0 100644
--- a/ui/src/views/infra/CpuSockets.vue
+++ b/ui/src/views/infra/CpuSockets.vue
@@ -52,7 +52,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { genericCompare } from '@/utils/sort.js'
 import Breadcrumb from '@/components/widgets/Breadcrumb'
 import ListView from '@/components/view/ListView.vue'
@@ -100,7 +100,7 @@ export default {
     callListHostsWithPage (hypervisor, currentPage) {
       this.loading = true
       const pageSize = 100
-      api('listHosts', {
+      getAPI('listHosts', {
         type: 'routing',
         details: 'min',
         hypervisor: hypervisor,
diff --git a/ui/src/views/infra/HostAdd.vue b/ui/src/views/infra/HostAdd.vue
index def050a37e81..6119410af3e9 100644
--- a/ui/src/views/infra/HostAdd.vue
+++ b/ui/src/views/infra/HostAdd.vue
@@ -244,7 +244,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import DedicateDomain from '../../components/view/DedicateDomain'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -334,7 +334,7 @@ export default {
     },
     fetchZones () {
       this.loading = true
-      api('listZones', { showicon: true }).then(response => {
+      getAPI('listZones', { showicon: true }).then(response => {
         this.zonesList = response.listzonesresponse.zone || []
         this.form.zoneid = this.zonesList[0].id || null
         this.fetchPods(this.form.zoneid)
@@ -347,7 +347,7 @@ export default {
     fetchPods (zoneId) {
       this.form.zoneid = zoneId
       this.loading = true
-      api('listPods', {
+      getAPI('listPods', {
         zoneid: this.form.zoneid
       }).then(response => {
         this.podsList = response.listpodsresponse.pod || []
@@ -367,7 +367,7 @@ export default {
       if (!podId) return
       this.podId = podId
       this.loading = true
-      api('listClusters', {
+      getAPI('listClusters', {
         podid: this.form.podid
       }).then(response => {
         this.clustersList = response.listclustersresponse.cluster || []
@@ -385,7 +385,7 @@ export default {
     },
     fetchHostTags () {
       this.loading = true
-      api('listHostTags').then(response => {
+      getAPI('listHostTags').then(response => {
         const listTagExists = []
         const hostTagsList = response.listhosttagsresponse.hosttag || []
         hostTagsList.forEach(tag => {
@@ -451,7 +451,7 @@ export default {
         }
         Object.keys(args).forEach((key) => (args[key] == null) && delete args[key])
         this.loading = true
-        api('addHost', {}, 'POST', args).then(response => {
+        postAPI('addHost', args).then(response => {
           const host = response.addhostresponse.host[0] || {}
           if (host.id && this.showDedicated) {
             this.dedicateHost(host.id)
@@ -473,7 +473,7 @@ export default {
     },
     dedicateHost (hostId) {
       this.loading = true
-      api('dedicateHost', {
+      postAPI('dedicateHost', {
         hostId,
         domainId: this.dedicatedDomainId,
         account: this.dedicatedAccount
diff --git a/ui/src/views/infra/HostEnableDisable.vue b/ui/src/views/infra/HostEnableDisable.vue
index 0eb960cf8485..23690cae16fd 100644
--- a/ui/src/views/infra/HostEnableDisable.vue
+++ b/ui/src/views/infra/HostEnableDisable.vue
@@ -55,7 +55,7 @@
 
 <script>
 import { reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 export default {
   name: 'HostEnableDisable',
@@ -87,7 +87,7 @@ export default {
       if (this.resource.hypervisor !== 'KVM') {
         return
       }
-      api('listConfigurations', { name: 'enable.kvm.host.auto.enable.disable', clusterid: this.resource.clusterid }).then(json => {
+      getAPI('listConfigurations', { name: 'enable.kvm.host.auto.enable.disable', clusterid: this.resource.clusterid }).then(json => {
         if (json.listconfigurationsresponse.configuration?.[0]) {
           this.kvmAutoEnableDisableSetting = json?.listconfigurationsresponse?.configuration?.[0]?.value || false
         }
@@ -103,7 +103,7 @@ export default {
         if (values.reason) {
           data.annotation = values.reason
         }
-        api('updateHost', data).then(_ => {
+        postAPI('updateHost', data).then(_ => {
           this.$emit('close-action')
           this.$emit('refresh-data')
         }).catch(err => {
diff --git a/ui/src/views/infra/HostInfo.vue b/ui/src/views/infra/HostInfo.vue
index 2f385862ae4f..0fea5788a319 100644
--- a/ui/src/views/infra/HostInfo.vue
+++ b/ui/src/views/infra/HostInfo.vue
@@ -189,7 +189,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 export default {
   name: 'HostInfo',
@@ -228,7 +228,7 @@ export default {
   methods: {
     fetchData () {
       this.fetchLoading = true
-      api('listHosts', { id: this.resource.id }).then(json => {
+      getAPI('listHosts', { id: this.resource.id }).then(json => {
         this.host = json.listhostsresponse.host[0]
         const hosttags = this.host.hosttags?.split(',') || []
         const explicithosttags = this.host.explicithosttags?.split(',') || []
diff --git a/ui/src/views/infra/HostUpdate.vue b/ui/src/views/infra/HostUpdate.vue
index bb3cfea3bd97..956ea7298ef2 100644
--- a/ui/src/views/infra/HostUpdate.vue
+++ b/ui/src/views/infra/HostUpdate.vue
@@ -92,7 +92,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -147,7 +147,7 @@ export default {
     fetchStorageAccessGroupsData () {
       const params = {}
       this.storageAccessGroupsLoading = true
-      api('listStorageAccessGroups', params).then(json => {
+      getAPI('listStorageAccessGroups', params).then(json => {
         const sags = json.liststorageaccessgroupsresponse.storageaccessgroup || []
         for (const sag of sags) {
           if (!this.storageAccessGroups.includes(sag.name)) {
@@ -162,7 +162,7 @@ export default {
     fetchOsCategories () {
       this.osCategories.loading = true
       this.osCategories.opts = []
-      api('listOsCategories').then(json => {
+      getAPI('listOsCategories').then(json => {
         this.osCategories.opts = json.listoscategoriesresponse.oscategory || []
       }).catch(error => {
         this.$notifyError(error)
@@ -184,7 +184,7 @@ export default {
         }
         this.loading = true
 
-        api('updateHost', params).then(json => {
+        postAPI('updateHost', params).then(json => {
           this.$message.success({
             content: `${this.$t('label.action.update.host')} - ${values.name}`,
             duration: 2
@@ -196,7 +196,7 @@ export default {
           }
 
           if (params.storageaccessgroups !== undefined && (this.resource.storageaccessgroups ? this.resource.storageaccessgroups.split(',').join(',') : '') !== params.storageaccessgroups) {
-            api('configureStorageAccess', {
+            postAPI('configureStorageAccess', {
               hostid: params.id,
               storageaccessgroups: params.storageaccessgroups
             }).then(response => {
diff --git a/ui/src/views/infra/InfraSummary.vue b/ui/src/views/infra/InfraSummary.vue
index a35db46f7608..dc8559adb11b 100644
--- a/ui/src/views/infra/InfraSummary.vue
+++ b/ui/src/views/infra/InfraSummary.vue
@@ -169,7 +169,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import router from '@/router'
 
 import Breadcrumb from '@/components/widgets/Breadcrumb'
@@ -229,7 +229,7 @@ export default {
     },
     listInfra () {
       this.loading = true
-      api('listInfrastructure').then(json => {
+      getAPI('listInfrastructure').then(json => {
         this.stats = []
         if (json && json.listinfrastructureresponse && json.listinfrastructureresponse.infrastructure) {
           this.stats = json.listinfrastructureresponse.infrastructure
@@ -255,7 +255,7 @@ export default {
     },
 
     pollActionCompletion (jobId, count) {
-      api('queryAsyncJobResult', { jobid: jobId }).then(json => {
+      getAPI('queryAsyncJobResult', { jobid: jobId }).then(json => {
         const result = json.queryasyncjobresultresponse
         if (result.jobstatus === 1 && this.maxCerts === count) {
           this.$message.success(`${this.$t('label.certificate.upload')}: ${result.jobresult.customcertificate.message}`)
@@ -294,7 +294,7 @@ export default {
           domainsuffix: formValues.dns,
           name: 'root'
         }
-        api('uploadCustomCertificate', {}, 'POST', data).then(response => {
+        postAPI('uploadCustomCertificate', data).then(response => {
           this.pollActionCompletion(response.uploadcustomcertificateresponse.jobid, count)
         }).then(() => {
           this.sslModalClose()
@@ -309,7 +309,7 @@ export default {
               domainsuffix: formValues.dns,
               name: key
             }
-            api('uploadCustomCertificate', {}, 'POST', data).then(response => {
+            postAPI('uploadCustomCertificate', data).then(response => {
               this.pollActionCompletion(response.uploadcustomcertificateresponse.jobid, count)
             }).then(() => {
               this.sslModalClose()
@@ -324,7 +324,7 @@ export default {
           domainsuffix: formValues.dns,
           privatekey: formValues.pkcs
         }
-        api('uploadCustomCertificate', {}, 'POST', data).then(response => {
+        postAPI('uploadCustomCertificate', data).then(response => {
           this.pollActionCompletion(response.uploadcustomcertificateresponse.jobid, count)
         }).then(() => {
           this.sslModalClose()
diff --git a/ui/src/views/infra/ManagementServerPeerTab.vue b/ui/src/views/infra/ManagementServerPeerTab.vue
index 47cffca2eee1..36c33e6c7f2d 100644
--- a/ui/src/views/infra/ManagementServerPeerTab.vue
+++ b/ui/src/views/infra/ManagementServerPeerTab.vue
@@ -36,7 +36,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -99,7 +99,7 @@ export default {
   methods: {
     fetchData () {
       this.managementservers = []
-      api('listManagementServers', {
+      getAPI('listManagementServers', {
         peers: true,
         id: this.resource.id
       }).then(json => {
diff --git a/ui/src/views/infra/Metrics.vue b/ui/src/views/infra/Metrics.vue
index 010059b885e8..dc691751f24b 100644
--- a/ui/src/views/infra/Metrics.vue
+++ b/ui/src/views/infra/Metrics.vue
@@ -77,7 +77,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { genericCompare } from '@/utils/sort.js'
 import Breadcrumb from '@/components/widgets/Breadcrumb'
 
@@ -117,7 +117,7 @@ export default {
   methods: {
     fetchDbMetrics () {
       var metrics
-      api('listDbMetrics').then(json => {
+      getAPI('listDbMetrics').then(json => {
         metrics = this.mapToArray(json.listdbmetricsresponse.dbMetrics)
         this.dbMetrics = metrics
       })
@@ -125,7 +125,7 @@ export default {
     },
     fetchUsageMetrics () {
       var metrics
-      api('listUsageServerMetrics').then(json => {
+      getAPI('listUsageServerMetrics').then(json => {
         metrics = this.mapToArray(json.listusageservermetricsresponse.usageMetrics)
         this.usageMetrics = metrics
       })
diff --git a/ui/src/views/infra/MigrateData.vue b/ui/src/views/infra/MigrateData.vue
index f6c9f1fe8f32..320a308b6dc3 100644
--- a/ui/src/views/infra/MigrateData.vue
+++ b/ui/src/views/infra/MigrateData.vue
@@ -89,7 +89,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 export default {
   name: 'MigrateData',
@@ -121,7 +121,7 @@ export default {
     fetchImageStores () {
       return new Promise((resolve, reject) => {
         this.loading = true
-        api('listImageStores').then(json => {
+        getAPI('listImageStores').then(json => {
           this.imageStores = json.listimagestoresresponse.imagestore || []
           this.form.srcpool = this.imageStores[0].id || ''
           resolve(this.imageStores)
@@ -189,7 +189,7 @@ export default {
     },
     migrateData (args, title) {
       return new Promise((resolve, reject) => {
-        api('migrateSecondaryStorageData', args).then(async json => {
+        postAPI('migrateSecondaryStorageData', args).then(async json => {
           const jobId = json.migratesecondarystoragedataresponse.jobid
           if (jobId) {
             this.$pollJob({
diff --git a/ui/src/views/infra/PodAdd.vue b/ui/src/views/infra/PodAdd.vue
index a84f75960e88..8713c21bf8f7 100644
--- a/ui/src/views/infra/PodAdd.vue
+++ b/ui/src/views/infra/PodAdd.vue
@@ -110,7 +110,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import DedicateDomain from '../../components/view/DedicateDomain'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
@@ -166,7 +166,7 @@ export default {
     },
     fetchZones () {
       this.loading = true
-      api('listZones', { showicon: true }).then(response => {
+      getAPI('listZones', { showicon: true }).then(response => {
         this.zonesList = response.listzonesresponse.zone || []
         this.form.zoneid = this.zonesList[0].id
         this.params = this.$store.getters.apis.createPod.params
@@ -189,7 +189,7 @@ export default {
         const values = toRaw(this.form)
 
         this.loading = true
-        api('createPod', {
+        postAPI('createPod', {
           zoneId: values.zoneid,
           name: values.name,
           gateway: values.gateway,
@@ -218,7 +218,7 @@ export default {
     },
     dedicatePod (podId) {
       this.loading = true
-      api('dedicatePod', {
+      postAPI('dedicatePod', {
         podId,
         domainid: this.dedicatedDomainId,
         account: this.dedicatedAccount
diff --git a/ui/src/views/infra/PodUpdate.vue b/ui/src/views/infra/PodUpdate.vue
index a23356314bed..81c65930bcee 100644
--- a/ui/src/views/infra/PodUpdate.vue
+++ b/ui/src/views/infra/PodUpdate.vue
@@ -75,7 +75,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -124,7 +124,7 @@ export default {
     fetchStorageAccessGroupsData () {
       const params = {}
       this.storageAccessGroupsLoading = true
-      api('listStorageAccessGroups', params).then(json => {
+      getAPI('listStorageAccessGroups', params).then(json => {
         const sags = json.liststorageaccessgroupsresponse.storageaccessgroup || []
         for (const sag of sags) {
           if (!this.storageAccessGroups.includes(sag.name)) {
@@ -147,7 +147,7 @@ export default {
         params.name = values.name
         this.loading = true
 
-        api('updatePod', params).then(json => {
+        postAPI('updatePod', params).then(json => {
           this.$message.success({
             content: `${this.$t('label.action.update.pod')} - ${values.name}`,
             duration: 2
@@ -160,7 +160,7 @@ export default {
           }
 
           if (params.storageaccessgroups !== undefined && (this.resource.storageaccessgroups ? this.resource.storageaccessgroups.split(',').join(',') : '') !== params.storageaccessgroups) {
-            api('configureStorageAccess', {
+            postAPI('configureStorageAccess', {
               podid: params.id,
               storageaccessgroups: params.storageaccessgroups
             }).then(response => {
diff --git a/ui/src/views/infra/Resources.vue b/ui/src/views/infra/Resources.vue
index 3d0c4a27099d..cad1a026c0be 100644
--- a/ui/src/views/infra/Resources.vue
+++ b/ui/src/views/infra/Resources.vue
@@ -66,7 +66,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 export default {
   name: 'Resources',
@@ -102,7 +102,7 @@ export default {
       const params = {}
       params[entity] = this.resource.id
       this.fetchLoading = true
-      api('listCapacity', params).then(response => {
+      getAPI('listCapacity', params).then(response => {
         this.resourcesList = response.listcapacityresponse.capacity
         this.updateTaggedCapacities()
         this.animatePercentVals(this.resourcesList)
diff --git a/ui/src/views/infra/StorageBrowser.vue b/ui/src/views/infra/StorageBrowser.vue
index f547737b2810..e393d0b96640 100644
--- a/ui/src/views/infra/StorageBrowser.vue
+++ b/ui/src/views/infra/StorageBrowser.vue
@@ -163,7 +163,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import InfoCard from '@/components/view/InfoCard'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import MigrateImageStoreResource from '@/views/storage/MigrateImageStoreResource'
@@ -243,7 +243,7 @@ export default {
     },
     fetchImageStoreObjects () {
       this.loading = true
-      api('listImageStoreObjects', {
+      getAPI('listImageStoreObjects', {
         path: this.browserPath,
         id: this.resource.id,
         page: this.page,
@@ -257,7 +257,7 @@ export default {
     },
     fetchPrimaryStoreObjects () {
       this.loading = true
-      api('listStoragePoolObjects', {
+      getAPI('listStoragePoolObjects', {
         path: this.browserPath,
         id: this.resource.id,
         page: this.page,
@@ -324,7 +324,7 @@ export default {
         id: this.resource.id,
         path: `${this.browserPath}${record.name}`
       }
-      api('downloadImageStoreObject', params).then(response => {
+      postAPI('downloadImageStoreObject', params).then(response => {
         const jobId = response.downloadimagestoreobjectresponse.jobid
         this.$pollJob({
           jobId: jobId,
diff --git a/ui/src/views/infra/UpdatePrimaryStorage.vue b/ui/src/views/infra/UpdatePrimaryStorage.vue
index 9407f20c11ee..0fbe1df9fccb 100644
--- a/ui/src/views/infra/UpdatePrimaryStorage.vue
+++ b/ui/src/views/infra/UpdatePrimaryStorage.vue
@@ -115,7 +115,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -179,7 +179,7 @@ export default {
     fetchStorageAccessGroupsData () {
       const params = {}
       this.storageAccessGroupsLoading = true
-      api('listStorageAccessGroups', params).then(json => {
+      getAPI('listStorageAccessGroups', params).then(json => {
         const sags = json.liststorageaccessgroupsresponse.storageaccessgroup || []
         for (const sag of sags) {
           if (!this.storageAccessGroups.includes(sag.name)) {
@@ -218,7 +218,7 @@ export default {
       this.$emit('close-action')
     },
     updateStoragePool (args, values) {
-      api('updateStoragePool', args).then(json => {
+      postAPI('updateStoragePool', args).then(json => {
         this.$message.success(`${this.$t('message.success.edit.primary.storage')}: ${this.resource.name}`)
 
         if (values.storageaccessgroups != null && values.storageaccessgroups.length > 0) {
@@ -228,7 +228,7 @@ export default {
         }
 
         if (args.storageaccessgroups !== undefined && (this.resource.storageaccessgroups ? this.resource.storageaccessgroups.split(',').join(',') : '') !== args.storageaccessgroups) {
-          api('configureStorageAccess', {
+          postAPI('configureStorageAccess', {
             storageid: args.id,
             storageaccessgroups: args.storageaccessgroups
           }).then(response => {
diff --git a/ui/src/views/infra/UsageRecords.vue b/ui/src/views/infra/UsageRecords.vue
index feb1d88bd9b6..1a89efec1f47 100644
--- a/ui/src/views/infra/UsageRecords.vue
+++ b/ui/src/views/infra/UsageRecords.vue
@@ -351,7 +351,7 @@ import { ref, reactive, toRaw } from 'vue'
 import dayjs from 'dayjs'
 import relativeTime from 'dayjs/plugin/relativeTime'
 import utc from 'dayjs/plugin/utc'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { toCsv } from '@/utils/util.js'
 import { mixinForm } from '@/utils/mixin'
 
@@ -509,7 +509,7 @@ export default {
       }
 
       this.serverMetricsLoading = true
-      api('listUsageServerMetrics').then(json => {
+      getAPI('listUsageServerMetrics').then(json => {
         this.stats = []
         if (json && json.listusageservermetricsresponse && json.listusageservermetricsresponse.usageMetrics) {
           this.serverStats = json.listusageservermetricsresponse.usageMetrics
@@ -549,7 +549,7 @@ export default {
       }
     },
     getDomains () {
-      api('listDomains', { listAll: true }).then(json => {
+      getAPI('listDomains', { listAll: true }).then(json => {
         if (json && json.listdomainsresponse && json.listdomainsresponse.domain) {
           this.domains = [{ id: null, value: '' }, ...json.listdomainsresponse.domain.map(x => {
             return {
@@ -573,7 +573,7 @@ export default {
           this.formRef.value.resetFields('domain')
         }
       }
-      api('listAccounts', params).then(json => {
+      getAPI('listAccounts', params).then(json => {
         if (json && json.listaccountsresponse && json.listaccountsresponse.account) {
           this.accounts = [{ id: null, value: '' }, ...json.listaccountsresponse.account.map(x => {
             return {
@@ -626,7 +626,7 @@ export default {
         this.loading = false
         return
       }
-      api('listUsageRecords', params).then(json => {
+      getAPI('listUsageRecords', params).then(json => {
         if (json && json.listusagerecordsresponse) {
           this.usageRecords = json?.listusagerecordsresponse?.usagerecord || []
           this.totalUsageRecords = json?.listusagerecordsresponse?.count || 0
@@ -648,7 +648,7 @@ export default {
         return
       }
 
-      api('listUsageTypes').then(json => {
+      getAPI('listUsageTypes').then(json => {
         if (json && json.listusagetypesresponse && json.listusagetypesresponse.usagetype) {
           this.usageTypes = [{ id: null, value: '' }, ...json.listusagetypesresponse.usagetype.map(x => {
             return {
@@ -734,7 +734,7 @@ export default {
         this.downloadStatus = 'active'
         this.loading = true
         var params = this.getParams(1, 0) // to get count
-        api('listUsageRecords', params).then(json => {
+        getAPI('listUsageRecords', params).then(json => {
           if (Object.getOwnPropertyNames(json.listusagerecordsresponse).length === 0 || json.listusagerecordsresponse.count === 0) {
             this.$notifyError({
               response: { data: null },
@@ -787,7 +787,7 @@ export default {
     },
     fetchUsageRecords (params) {
       return new Promise((resolve, reject) => {
-        api('listUsageRecords', params).then(json => {
+        getAPI('listUsageRecords', params).then(json => {
           return resolve(json.listusagerecordsresponse.usagerecord)
         }).catch(error => {
           return reject(error)
@@ -795,7 +795,7 @@ export default {
       })
     },
     getAllUsageRecordColumns () {
-      api('listApis', { name: 'listUsageRecords' }).then(json => {
+      getAPI('listApis', { name: 'listUsageRecords' }).then(json => {
         if (json && json.listapisresponse && json.listapisresponse.api) {
           var apiResponse = json.listapisresponse.api.filter(x => x.name === 'listUsageRecords')[0].response
           this.usageRecordKeys = []
@@ -812,7 +812,7 @@ export default {
       return this.$toLocaleDate(dayjs(date))
     },
     generateUsageRecords () {
-      api('generateUsageRecords').then(json => {
+      postAPI('generateUsageRecords').then(json => {
         this.$message.success(this.$t('label.usage.records.generated'))
       }).catch(error => {
         this.$notifyError(error)
@@ -824,7 +824,7 @@ export default {
       var params = {
         interval: this.purgeDays
       }
-      api('removeRawUsageRecords', params).then(json => {
+      postAPI('removeRawUsageRecords', params).then(json => {
         this.$message.success(this.$t('label.purge.usage.records.success'))
       }).catch(error => {
         this.$message.error(this.$t('label.purge.usage.records.error') + ': ' + error.message)
diff --git a/ui/src/views/infra/ZoneUpdate.vue b/ui/src/views/infra/ZoneUpdate.vue
index 2369906ff024..cc6630da538e 100644
--- a/ui/src/views/infra/ZoneUpdate.vue
+++ b/ui/src/views/infra/ZoneUpdate.vue
@@ -126,7 +126,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -182,7 +182,7 @@ export default {
     fetchStorageAccessGroupsData () {
       const params = {}
       this.storageAccessGroupsLoading = true
-      api('listStorageAccessGroups', params).then(json => {
+      getAPI('listStorageAccessGroups', params).then(json => {
         const sags = json.liststorageaccessgroupsresponse.storageaccessgroup || []
         for (const sag of sags) {
           if (!this.storageAccessGroups.includes(sag.name)) {
@@ -202,7 +202,7 @@ export default {
 
         this.loading = true
 
-        api('updateZone', params).then(json => {
+        postAPI('updateZone', params).then(json => {
           this.$message.success({
             content: `${this.$t('label.action.update.zone')} - ${values.name}`,
             duration: 2
@@ -215,7 +215,7 @@ export default {
           }
 
           if (params.storageaccessgroups !== undefined && (this.resource.storageaccessgroups ? this.resource.storageaccessgroups.split(',').join(',') : '') !== params.storageaccessgroups) {
-            api('configureStorageAccess', {
+            postAPI('configureStorageAccess', {
               zoneid: params.id,
               storageaccessgroups: params.storageaccessgroups
             }).then(response => {
diff --git a/ui/src/views/infra/network/DedicatedVLANTab.vue b/ui/src/views/infra/network/DedicatedVLANTab.vue
index 7343b30b692e..9d47138f0ae7 100644
--- a/ui/src/views/infra/network/DedicatedVLANTab.vue
+++ b/ui/src/views/infra/network/DedicatedVLANTab.vue
@@ -174,7 +174,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
@@ -252,7 +252,7 @@ export default {
     },
     fetchData () {
       this.formLoading = true
-      api('listDedicatedGuestVlanRanges', {
+      getAPI('listDedicatedGuestVlanRanges', {
         physicalnetworkid: this.resource.id,
         page: this.page,
         pageSize: this.pageSize
@@ -271,7 +271,7 @@ export default {
       })
     },
     fetchDomains () {
-      api('listDomains', {
+      getAPI('listDomains', {
         details: 'min',
         showicon: true,
         listAll: true
@@ -291,7 +291,7 @@ export default {
     },
     fetchAccounts (e) {
       this.formLoading = true
-      api('listAccounts', {
+      getAPI('listAccounts', {
         domainid: e,
         details: 'min',
         showicon: true,
@@ -312,7 +312,7 @@ export default {
     },
     fetchProjects (e) {
       this.formLoading = true
-      api('listProjects', {
+      getAPI('listProjects', {
         domainid: e,
         showicon: true,
         details: 'min'
@@ -332,7 +332,7 @@ export default {
     },
     handleDelete (item) {
       this.parentStartLoading()
-      api('releaseDedicatedGuestVlanRange', {
+      postAPI('releaseDedicatedGuestVlanRange', {
         id: item.id
       }).then(response => {
         this.$pollJob({
@@ -370,7 +370,7 @@ export default {
         this.parentStartLoading()
         const fieldValues = toRaw(this.form)
 
-        api('dedicateGuestVlanRange', {
+        postAPI('dedicateGuestVlanRange', {
           physicalnetworkid: this.resource.id,
           vlanrange: fieldValues.range,
           domainid: fieldValues.domain,
diff --git a/ui/src/views/infra/network/EditTrafficLabel.vue b/ui/src/views/infra/network/EditTrafficLabel.vue
index f8f44d9d0b62..4739e81e8c9f 100644
--- a/ui/src/views/infra/network/EditTrafficLabel.vue
+++ b/ui/src/views/infra/network/EditTrafficLabel.vue
@@ -97,7 +97,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -147,7 +147,7 @@ export default {
     fetchData () {
       this.typeLoading = true
 
-      api('listTrafficTypes', { physicalnetworkid: this.resource.id })
+      getAPI('listTrafficTypes', { physicalnetworkid: this.resource.id })
         .then(json => {
           this.trafficTypes = json.listtraffictypesresponse.traffictype || []
           this.form.id = this.trafficTypes[0].id || undefined
@@ -181,7 +181,7 @@ export default {
         }
         const title = this.$t('label.update.traffic.label')
         const description = this.traffictype
-        api('updateTrafficType', params).then(response => {
+        postAPI('updateTrafficType', params).then(response => {
           this.$pollJob({
             jobId: response.updatetraffictyperesponse.jobid,
             title,
diff --git a/ui/src/views/infra/network/IpRangesTabGuest.vue b/ui/src/views/infra/network/IpRangesTabGuest.vue
index 2c575d7ac563..a7caea256a88 100644
--- a/ui/src/views/infra/network/IpRangesTabGuest.vue
+++ b/ui/src/views/infra/network/IpRangesTabGuest.vue
@@ -142,7 +142,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import CreateNetwork from '@/views/network/CreateNetwork'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipButton from '@/components/widgets/TooltipButton'
@@ -243,7 +243,7 @@ export default {
     },
     fetchData () {
       this.componentLoading = true
-      api('listNetworks', {
+      getAPI('listNetworks', {
         zoneid: this.resource.zoneid,
         physicalnetworkid: this.resource.id,
         showicon: true,
@@ -260,7 +260,7 @@ export default {
       this.fetchIpv6PrefixData()
     },
     fetchIpv6PrefixData () {
-      api('listGuestNetworkIpv6Prefixes', {
+      getAPI('listGuestNetworkIpv6Prefixes', {
         zoneid: this.resource.zoneid,
         page: this.page,
         pagesize: this.pageSize
@@ -308,7 +308,7 @@ export default {
           zoneid: this.resource.zoneid,
           prefix: values.prefix
         }
-        api('createGuestNetworkIpv6Prefix', params).then(response => {
+        postAPI('createGuestNetworkIpv6Prefix', params).then(response => {
           this.$pollJob({
             jobId: response.createguestnetworkipv6prefixresponse.jobid,
             title: this.$t('label.add.ip.v6.prefix'),
@@ -342,7 +342,7 @@ export default {
     },
     handleDeleteIpv6Prefix (prefix) {
       this.componentLoading = true
-      api('deleteGuestNetworkIpv6Prefix', { id: prefix.id }).then(response => {
+      postAPI('deleteGuestNetworkIpv6Prefix', { id: prefix.id }).then(response => {
         this.$pollJob({
           jobId: response.deleteguestnetworkipv6prefixresponse.jobid,
           title: this.$t('label.delete.ip.v6.prefix'),
diff --git a/ui/src/views/infra/network/IpRangesTabManagement.vue b/ui/src/views/infra/network/IpRangesTabManagement.vue
index f6d0029a66eb..8797fa471b43 100644
--- a/ui/src/views/infra/network/IpRangesTabManagement.vue
+++ b/ui/src/views/infra/network/IpRangesTabManagement.vue
@@ -129,7 +129,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
 export default {
@@ -226,7 +226,7 @@ export default {
     },
     fetchData () {
       this.componentLoading = true
-      api('listPods', {
+      getAPI('listPods', {
         zoneid: this.resource.zoneid,
         page: this.page,
         pagesize: this.pageSize
@@ -272,7 +272,7 @@ export default {
     },
     handleDeleteIpRange (record) {
       this.componentLoading = true
-      api('deleteManagementNetworkIpRange', {
+      postAPI('deleteManagementNetworkIpRange', {
         podid: record.id,
         startip: record.startip,
         endip: record.endip,
@@ -311,7 +311,7 @@ export default {
         const values = toRaw(this.form)
         this.componentLoading = true
         this.addIpRangeModal = false
-        api('createManagementNetworkIpRange', {
+        postAPI('createManagementNetworkIpRange', {
           podid: values.pod,
           gateway: values.gateway,
           netmask: values.netmask,
diff --git a/ui/src/views/infra/network/IpRangesTabPublic.vue b/ui/src/views/infra/network/IpRangesTabPublic.vue
index 3955b8c03591..e1137bd0419f 100644
--- a/ui/src/views/infra/network/IpRangesTabPublic.vue
+++ b/ui/src/views/infra/network/IpRangesTabPublic.vue
@@ -345,7 +345,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -478,7 +478,7 @@ export default {
     },
     fetchData () {
       this.componentLoading = true
-      api('listVlanIpRanges', {
+      getAPI('listVlanIpRanges', {
         networkid: this.network.id,
         zoneid: this.resource.zoneid,
         page: this.page,
@@ -495,7 +495,7 @@ export default {
     },
     fetchDomains () {
       this.domainsLoading = true
-      api('listDomains', {
+      getAPI('listDomains', {
         details: 'min',
         listAll: true
       }).then(response => {
@@ -512,7 +512,7 @@ export default {
     },
     fetchPods () {
       this.podsLoading = true
-      api('listPods', {
+      getAPI('listPods', {
         zoneid: this.resource.zoneid,
         page: this.page,
         pagesize: this.pageSize
@@ -545,7 +545,7 @@ export default {
         params.account = this.addAccount.account
       }
 
-      api('dedicatePublicIpRange', params).catch(error => {
+      postAPI('dedicatePublicIpRange', params).catch(error => {
         this.$notifyError(error)
       }).finally(() => {
         this.addAccountModal = false
@@ -555,7 +555,7 @@ export default {
     },
     handleRemoveAccount (id) {
       this.componentLoading = true
-      api('releasePublicIpRange', { id }).catch(error => {
+      postAPI('releasePublicIpRange', { id }).catch(error => {
         this.$notifyError(error)
       }).finally(() => {
         this.fetchData()
@@ -596,7 +596,7 @@ export default {
     },
     handleDeleteIpRange (id) {
       this.componentLoading = true
-      api('deleteVlanIpRange', { id }).then(() => {
+      postAPI('deleteVlanIpRange', { id }).then(() => {
         this.$notification.success({
           message: 'Removed IP Range'
         })
@@ -633,7 +633,7 @@ export default {
           params.podid = values.podid
           params.networkid = this.network.id
         }
-        api('createVlanIpRange', params).then(() => {
+        postAPI('createVlanIpRange', params).then(() => {
           this.$notification.success({
             message: this.$t('message.success.add.iprange')
           })
@@ -669,7 +669,7 @@ export default {
         for (const key of ipRangeKeys) {
           params[key] = values[key]
         }
-        api('updateVlanIpRange', params).then(() => {
+        postAPI('updateVlanIpRange', params).then(() => {
           this.$notification.success({
             message: this.$t('message.success.update.iprange')
           })
diff --git a/ui/src/views/infra/network/IpRangesTabStorage.vue b/ui/src/views/infra/network/IpRangesTabStorage.vue
index c8665d6d9b5b..88f73a9f7580 100644
--- a/ui/src/views/infra/network/IpRangesTabStorage.vue
+++ b/ui/src/views/infra/network/IpRangesTabStorage.vue
@@ -123,7 +123,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
 export default {
@@ -214,7 +214,7 @@ export default {
     fetchData () {
       this.fetchPods()
       this.componentLoading = true
-      api('listStorageNetworkIpRange', {
+      getAPI('listStorageNetworkIpRange', {
         zoneid: this.resource.zoneid,
         page: this.page,
         pageSize: this.pageSize
@@ -229,7 +229,7 @@ export default {
     },
     fetchPods () {
       this.componentLoading = true
-      api('listPods', {
+      getAPI('listPods', {
         zoneid: this.resource.zoneid
       }).then(response => {
         this.pods = response.listpodsresponse.pod ? response.listpodsresponse.pod : []
@@ -254,7 +254,7 @@ export default {
     },
     handleDeleteIpRange (id) {
       this.componentLoading = true
-      api('deleteStorageNetworkIpRange', { id }).then(response => {
+      postAPI('deleteStorageNetworkIpRange', { id }).then(response => {
         this.$pollJob({
           jobId: response.deletestoragenetworkiprangeresponse.jobid,
           title: this.$t('label.remove.ip.range'),
@@ -288,7 +288,7 @@ export default {
         const values = toRaw(this.form)
         this.componentLoading = true
         this.addIpRangeModal = false
-        api('createStorageNetworkIpRange', {
+        postAPI('createStorageNetworkIpRange', {
           podid: values.pod,
           zoneid: this.resource.zoneid,
           gateway: values.gateway,
diff --git a/ui/src/views/infra/network/ServiceProvidersTab.vue b/ui/src/views/infra/network/ServiceProvidersTab.vue
index 5eb8e3dbccec..06031b522782 100644
--- a/ui/src/views/infra/network/ServiceProvidersTab.vue
+++ b/ui/src/views/infra/network/ServiceProvidersTab.vue
@@ -140,7 +140,7 @@
 <script>
 import { ref, reactive, toRaw, shallowRef, defineAsyncComponent } from 'vue'
 import store from '@/store'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import Status from '@/components/widgets/Status'
 import ProviderItem from '@/views/infra/network/providers/ProviderItem'
@@ -1166,7 +1166,7 @@ export default {
     },
     fetchServiceProvider (name) {
       this.fetchLoading = true
-      api('listNetworkServiceProviders', { physicalnetworkid: this.resource.id, name: name }).then(json => {
+      getAPI('listNetworkServiceProviders', { physicalnetworkid: this.resource.id, name: name }).then(json => {
         const sps = json.listnetworkserviceprovidersresponse.networkserviceprovider || []
         console.log(sps)
         if (sps.length > 0) {
@@ -1255,7 +1255,7 @@ export default {
     addNetworkServiceProvider (args) {
       return new Promise((resolve, reject) => {
         let message = ''
-        api('addNetworkServiceProvider', args).then(async json => {
+        postAPI('addNetworkServiceProvider', args).then(async json => {
           const jobId = json.addnetworkserviceproviderresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -1275,7 +1275,7 @@ export default {
     async pollJob (jobId) {
       return new Promise(resolve => {
         const asyncJobInterval = setInterval(() => {
-          api('queryAsyncJobResult', { jobId }).then(async json => {
+          getAPI('queryAsyncJobResult', { jobId }).then(async json => {
             const result = json.queryasyncjobresultresponse
             if (result.jobstatus === 0) {
               return
@@ -1351,7 +1351,7 @@ export default {
       }
       field.loading = true
       field.opts = []
-      api(possibleApi, params).then(json => {
+      postAPI(possibleApi, params).then(json => {
         field.loading = false
         for (const obj in json) {
           if (obj.includes('response')) {
@@ -1402,7 +1402,7 @@ export default {
       return new Promise((resolve, reject) => {
         let hasJobId = false
         let message = ''
-        const promise = (method === 'POST') ? api(apiName, {}, method, args) : api(apiName, args)
+        const promise = postAPI(apiName, args)
         promise.then(json => {
           for (const obj in json) {
             if (obj.includes('response') || obj.includes(apiName)) {
diff --git a/ui/src/views/infra/network/TrafficTypesTab.vue b/ui/src/views/infra/network/TrafficTypesTab.vue
index 41da48d993c1..af5f931fc3e6 100644
--- a/ui/src/views/infra/network/TrafficTypesTab.vue
+++ b/ui/src/views/infra/network/TrafficTypesTab.vue
@@ -78,7 +78,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import IpRangesTabPublic from './IpRangesTabPublic'
 import IpRangesTabManagement from './IpRangesTabManagement'
@@ -129,7 +129,7 @@ export default {
     async fetchData () {
       this.fetchTrafficTypes()
       this.fetchLoading = true
-      api('listNetworks', {
+      getAPI('listNetworks', {
         listAll: true,
         trafficType: 'Public',
         isSystem: true,
@@ -152,7 +152,7 @@ export default {
     },
     fetchTrafficTypes () {
       this.fetchLoading = true
-      api('listTrafficTypes', { physicalnetworkid: this.resource.id }).then(json => {
+      getAPI('listTrafficTypes', { physicalnetworkid: this.resource.id }).then(json => {
         this.traffictypes = json.listtraffictypesresponse.traffictype
       }).catch(error => {
         this.$notifyError(error)
@@ -163,7 +163,7 @@ export default {
     fetchZones () {
       return new Promise((resolve, reject) => {
         this.fetchLoading = true
-        api('listZones', { id: this.resource.zoneid }).then(json => {
+        getAPI('listZones', { id: this.resource.zoneid }).then(json => {
           const zone = json.listzonesresponse.zone || []
           this.networkType = zone[0].networktype
           resolve(this.networkType)
@@ -176,7 +176,7 @@ export default {
       })
     },
     fetchGuestNetwork () {
-      api('listNetworks', {
+      getAPI('listNetworks', {
         listAll: true,
         trafficType: 'Guest',
         zoneId: this.resource.zoneid
@@ -193,7 +193,7 @@ export default {
       })
     },
     deleteTrafficType (trafficType) {
-      api('deleteTrafficType', { id: trafficType.id }).then(response => {
+      postAPI('deleteTrafficType', { id: trafficType.id }).then(response => {
         this.$pollJob({
           jobId: response.deletetraffictyperesponse.jobid,
           title: this.$t('label.delete.traffic.type'),
diff --git a/ui/src/views/infra/network/providers/AddF5LoadBalancer.vue b/ui/src/views/infra/network/providers/AddF5LoadBalancer.vue
index 7fd7f03d82c1..38a8f7c8c724 100644
--- a/ui/src/views/infra/network/providers/AddF5LoadBalancer.vue
+++ b/ui/src/views/infra/network/providers/AddF5LoadBalancer.vue
@@ -117,7 +117,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'AddF5LoadBalancer',
@@ -275,7 +275,7 @@ export default {
     },
     addNetworkServiceProvider (args) {
       return new Promise((resolve, reject) => {
-        api('addNetworkServiceProvider', args).then(async json => {
+        postAPI('addNetworkServiceProvider', args).then(async json => {
           this.$pollJob({
             jobId: json.addnetworkserviceproviderresponse.jobid,
             successMethod: (result) => {
@@ -296,7 +296,7 @@ export default {
     },
     addF5LoadBalancer (args) {
       return new Promise((resolve, reject) => {
-        api('addF5LoadBalancer', args).then(json => {
+        postAPI('addF5LoadBalancer', args).then(json => {
           const jobId = json.addf5bigiploadbalancerresponse.jobid || null
           resolve(jobId)
         }).catch(error => {
diff --git a/ui/src/views/infra/network/providers/AddNetscalerLoadBalancer.vue b/ui/src/views/infra/network/providers/AddNetscalerLoadBalancer.vue
index e3a051d39e67..bf1ce574395d 100644
--- a/ui/src/views/infra/network/providers/AddNetscalerLoadBalancer.vue
+++ b/ui/src/views/infra/network/providers/AddNetscalerLoadBalancer.vue
@@ -143,7 +143,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'AddNetscalerLoadBalancer',
@@ -312,7 +312,7 @@ export default {
     },
     addNetworkServiceProvider (args) {
       return new Promise((resolve, reject) => {
-        api('addNetworkServiceProvider', args).then(async json => {
+        postAPI('addNetworkServiceProvider', args).then(async json => {
           this.$pollJob({
             jobId: json.addnetworkserviceproviderresponse.jobid,
             successMethod: (result) => {
@@ -333,7 +333,7 @@ export default {
     },
     addNetscalerLoadBalancer (args) {
       return new Promise((resolve, reject) => {
-        api('addNetscalerLoadBalancer', args).then(json => {
+        postAPI('addNetscalerLoadBalancer', args).then(json => {
           const jobId = json.addnetscalerloadbalancerresponse.jobid || null
           resolve(jobId)
         }).catch(error => {
diff --git a/ui/src/views/infra/network/providers/AddNiciraNvpDevice.vue b/ui/src/views/infra/network/providers/AddNiciraNvpDevice.vue
index cde5c940ad4f..1d26d8e138a5 100644
--- a/ui/src/views/infra/network/providers/AddNiciraNvpDevice.vue
+++ b/ui/src/views/infra/network/providers/AddNiciraNvpDevice.vue
@@ -98,7 +98,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'AddNiciraNvpDevice',
@@ -187,7 +187,7 @@ export default {
     },
     addNetworkServiceProvider (args) {
       return new Promise((resolve, reject) => {
-        api('addNetworkServiceProvider', args).then(async json => {
+        postAPI('addNetworkServiceProvider', args).then(async json => {
           this.$pollJob({
             jobId: json.addnetworkserviceproviderresponse.jobid,
             successMethod: (result) => {
@@ -208,7 +208,7 @@ export default {
     },
     addNiciraNvpDevice (args) {
       return new Promise((resolve, reject) => {
-        api('addNiciraNvpDevice', args).then(json => {
+        postAPI('addNiciraNvpDevice', args).then(json => {
           const jobId = json.addniciranvpdeviceresponse.jobid || null
           resolve(jobId)
         }).catch(error => {
diff --git a/ui/src/views/infra/network/providers/AddPaloAltoFirewall.vue b/ui/src/views/infra/network/providers/AddPaloAltoFirewall.vue
index 1dd91505caf7..fd491c6a8b81 100644
--- a/ui/src/views/infra/network/providers/AddPaloAltoFirewall.vue
+++ b/ui/src/views/infra/network/providers/AddPaloAltoFirewall.vue
@@ -160,7 +160,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'AddPaloAltoFirewall',
@@ -399,7 +399,7 @@ export default {
     },
     addNetworkServiceProvider (args) {
       return new Promise((resolve, reject) => {
-        api('addNetworkServiceProvider', args).then(async json => {
+        postAPI('addNetworkServiceProvider', args).then(async json => {
           this.$pollJob({
             jobId: json.addnetworkserviceproviderresponse.jobid,
             successMethod: (result) => {
@@ -420,7 +420,7 @@ export default {
     },
     addPaloAltoFirewall (args) {
       return new Promise((resolve, reject) => {
-        api('addPaloAltoFirewall', args).then(json => {
+        postAPI('addPaloAltoFirewall', args).then(json => {
           const jobId = json.addpaloaltofirewallresponse.jobid || null
           resolve(jobId)
         }).catch(error => {
diff --git a/ui/src/views/infra/network/providers/ProviderItem.vue b/ui/src/views/infra/network/providers/ProviderItem.vue
index 125455b092b9..42ceef3838e1 100644
--- a/ui/src/views/infra/network/providers/ProviderItem.vue
+++ b/ui/src/views/infra/network/providers/ProviderItem.vue
@@ -51,7 +51,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import ActionButton from '@/components/view/ActionButton'
 import ProviderDetail from '@/views/infra/network/providers/ProviderDetail'
 import ProviderListView from '@/views/infra/network/providers/ProviderListView'
@@ -199,7 +199,7 @@ export default {
     },
     executeApi (apiName, params) {
       return new Promise((resolve, reject) => {
-        api(apiName, params).then(json => {
+        postAPI(apiName, params).then(json => {
           let responseName
           let objectName
           let itemCount = 0
diff --git a/ui/src/views/infra/network/providers/ProviderListView.vue b/ui/src/views/infra/network/providers/ProviderListView.vue
index 6c107e6eb02e..ced682aeaac3 100644
--- a/ui/src/views/infra/network/providers/ProviderListView.vue
+++ b/ui/src/views/infra/network/providers/ProviderListView.vue
@@ -117,7 +117,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
@@ -343,7 +343,7 @@ export default {
     executeDeleteRecord (apiName, args) {
       return new Promise((resolve, reject) => {
         let jobId = null
-        api(apiName, args).then(json => {
+        postAPI(apiName, args).then(json => {
           for (const obj in json) {
             if (obj.includes('response')) {
               for (const res in json[obj]) {
@@ -364,7 +364,7 @@ export default {
     },
     configureOvsElement (args) {
       return new Promise((resolve, reject) => {
-        api('configureOvsElement', args).then(json => {
+        postAPI('configureOvsElement', args).then(json => {
           const jobId = json.configureovselementresponse.jobid
           resolve(jobId)
         }).catch(error => {
diff --git a/ui/src/views/infra/routers/RouterHealthCheck.vue b/ui/src/views/infra/routers/RouterHealthCheck.vue
index a6f54f703c12..fbe3b658fa9f 100644
--- a/ui/src/views/infra/routers/RouterHealthCheck.vue
+++ b/ui/src/views/infra/routers/RouterHealthCheck.vue
@@ -81,7 +81,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -177,7 +177,7 @@ export default {
     checkConfigurationAndGetHealthChecks (performFreshChecks) {
       var params = { name: 'router.health.checks.enabled' }
       this.loading = true
-      api('listConfigurations', params).then(json => {
+      getAPI('listConfigurations', params).then(json => {
         this.routerHealthChecksEnabled = false
         if (json.listconfigurationsresponse.configuration !== null) {
           var config = json.listconfigurationsresponse.configuration[0]
@@ -200,7 +200,7 @@ export default {
         params.performfreshchecks = performFreshChecks
       }
       this.loading = true
-      api('getRouterHealthCheckResults', params).then(json => {
+      getAPI('getRouterHealthCheckResults', params).then(json => {
         this.healthChecks = json.getrouterhealthcheckresultsresponse.routerhealthchecks.healthchecks
       }).catch(error => {
         this.$notifyError(error)
diff --git a/ui/src/views/infra/zone/AsNumbersTab.vue b/ui/src/views/infra/zone/AsNumbersTab.vue
index aa3f17adb94a..4ee4d873a907 100644
--- a/ui/src/views/infra/zone/AsNumbersTab.vue
+++ b/ui/src/views/infra/zone/AsNumbersTab.vue
@@ -110,7 +110,7 @@
 <script>
 
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import { mixinDevice } from '@/utils/mixin.js'
 
@@ -163,7 +163,7 @@ export default {
     },
     fetchData () {
       this.fetchLoading = true
-      api('listASNRanges', { zoneid: this.resource.id }).then(json => {
+      getAPI('listASNRanges', { zoneid: this.resource.id }).then(json => {
         this.asnRanges = json?.listasnrangesresponse?.asnumberrange || []
       }).finally(() => { this.fetchLoading = false })
     },
@@ -179,7 +179,7 @@ export default {
         const values = toRaw(this.form)
         values.zoneid = this.resource.id
         this.loading = true
-        api('createASNRange', values).then(() => {
+        postAPI('createASNRange', values).then(() => {
           this.$notification.success({
             message: this.$t('message.success.create.asnrange')
           })
@@ -199,7 +199,7 @@ export default {
     },
     onDelete (rangeId) {
       this.loading = true
-      api('deleteASNRange', { id: rangeId }).then(() => {
+      postAPI('deleteASNRange', { id: rangeId }).then(() => {
         this.$notification.success({
           message: this.$t('message.success.delete.asnrange')
         })
diff --git a/ui/src/views/infra/zone/BgpPeersTab.vue b/ui/src/views/infra/zone/BgpPeersTab.vue
index a733a19f2234..e55daf02a413 100644
--- a/ui/src/views/infra/zone/BgpPeersTab.vue
+++ b/ui/src/views/infra/zone/BgpPeersTab.vue
@@ -341,7 +341,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import ChangeBgpPeersForNetwork from '@/views/network/ChangeBgpPeerForNetwork.vue'
@@ -458,7 +458,7 @@ export default {
     },
     fetchDomains () {
       this.domainsLoading = true
-      api('listDomains', {
+      getAPI('listDomains', {
         details: 'min',
         listAll: true
       }).then(response => {
@@ -482,7 +482,7 @@ export default {
     },
     fetchZoneBgpPeer () {
       this.componentLoading = true
-      api('listBgpPeers', {
+      getAPI('listBgpPeers', {
         zoneid: this.resource.id,
         projectid: -1,
         showicon: true,
@@ -516,7 +516,7 @@ export default {
         params.account = this.addAccountForBgpPeer.account
       }
 
-      api('dedicateBgpPeer', params).then(response => {
+      postAPI('dedicateBgpPeer', params).then(response => {
         this.$pollJob({
           jobId: response.dedicatebgppeerresponse.jobid,
           title: this.$t('label.dedicate.bgp.peer'),
@@ -546,7 +546,7 @@ export default {
     },
     handleRemoveAccountFromBgpPeer (id) {
       this.componentLoading = true
-      api('releaseBgpPeer', { id }).then(response => {
+      postAPI('releaseBgpPeer', { id }).then(response => {
         this.$pollJob({
           jobId: response.releasebgppeerresponse.jobid,
           title: this.$t('label.release.dedicated.bgp.peer'),
@@ -598,7 +598,7 @@ export default {
     },
     handleDeleteBgpPeer (id) {
       this.componentLoading = true
-      api('deleteBgpPeer', { id }).then(response => {
+      postAPI('deleteBgpPeer', { id }).then(response => {
         this.$pollJob({
           jobId: response.deletebgppeerresponse.jobid,
           title: this.$t('label.delete.bgp.peer'),
@@ -641,7 +641,7 @@ export default {
           domainid: values.domain,
           account: values.account
         }
-        api('createBgpPeer', params).then(response => {
+        postAPI('createBgpPeer', params).then(response => {
           this.$pollJob({
             jobId: response.createbgppeerresponse.jobid,
             title: this.$t('label.add.bgp.peer'),
@@ -689,7 +689,7 @@ export default {
           ip6address: values.ip6address,
           password: values.password
         }
-        api('updateBgpPeer', params).then(response => {
+        postAPI('updateBgpPeer', params).then(response => {
           this.$pollJob({
             jobId: response.updatebgppeerresponse.jobid,
             title: this.$t('label.update.bgp.peer'),
diff --git a/ui/src/views/infra/zone/Ipv4GuestSubnetsTab.vue b/ui/src/views/infra/zone/Ipv4GuestSubnetsTab.vue
index 226dd4f924f7..e9ce2381190a 100644
--- a/ui/src/views/infra/zone/Ipv4GuestSubnetsTab.vue
+++ b/ui/src/views/infra/zone/Ipv4GuestSubnetsTab.vue
@@ -262,7 +262,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
@@ -365,7 +365,7 @@ export default {
     },
     fetchDomains () {
       this.domainsLoading = true
-      api('listDomains', {
+      getAPI('listDomains', {
         details: 'min',
         listAll: true
       }).then(response => {
@@ -385,7 +385,7 @@ export default {
     },
     fetchZoneIpv4Subnet () {
       this.componentLoading = true
-      api('listIpv4SubnetsForZone', {
+      getAPI('listIpv4SubnetsForZone', {
         zoneid: this.resource.id,
         projectid: -1,
         showicon: true,
@@ -419,7 +419,7 @@ export default {
         params.account = this.addAccountForIpv4GuestSubnet.account
       }
 
-      api('dedicateIpv4SubnetForZone', params).then(response => {
+      postAPI('dedicateIpv4SubnetForZone', params).then(response => {
         this.$pollJob({
           jobId: response.dedicateipv4subnetforzoneresponse.jobid,
           title: this.$t('label.dedicate.ipv4.subnet'),
@@ -449,7 +449,7 @@ export default {
     },
     handleRemoveAccountFromIpv4GuestSubnet (id) {
       this.componentLoading = true
-      api('releaseIpv4SubnetForZone', { id }).then(response => {
+      postAPI('releaseIpv4SubnetForZone', { id }).then(response => {
         this.$pollJob({
           jobId: response.releaseipv4subnetforzoneresponse.jobid,
           title: this.$t('label.release.dedicated.ipv4.subnet'),
@@ -499,7 +499,7 @@ export default {
     },
     handleDeleteIpv4Subnet (id) {
       this.componentLoading = true
-      api('deleteIpv4SubnetForZone', { id }).then(response => {
+      postAPI('deleteIpv4SubnetForZone', { id }).then(response => {
         this.$pollJob({
           jobId: response.deleteipv4subnetforzoneresponse.jobid,
           successMessage: this.$t('message.success.delete.ipv4.subnet'),
@@ -538,7 +538,7 @@ export default {
           domainid: values.domain,
           account: values.account
         }
-        api('createIpv4SubnetForZone', params).then(response => {
+        postAPI('createIpv4SubnetForZone', params).then(response => {
           this.$pollJob({
             jobId: response.createipv4subnetforzoneresponse.jobid,
             title: this.$t('label.add.ipv4.subnet'),
@@ -584,7 +584,7 @@ export default {
           id: this.selectedIpv4GuestSubnet.id,
           subnet: values.subnet
         }
-        api('updateIpv4SubnetForZone', params).then(response => {
+        postAPI('updateIpv4SubnetForZone', params).then(response => {
           this.$pollJob({
             jobId: response.updateipv4subnetforzoneresponse.jobid,
             title: this.$t('label.update.ipv4.subnet'),
diff --git a/ui/src/views/infra/zone/PhysicalNetworksTab.vue b/ui/src/views/infra/zone/PhysicalNetworksTab.vue
index 932fdf09f068..17bfd700d9b6 100644
--- a/ui/src/views/infra/zone/PhysicalNetworksTab.vue
+++ b/ui/src/views/infra/zone/PhysicalNetworksTab.vue
@@ -152,7 +152,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -206,7 +206,7 @@ export default {
   methods: {
     fetchData () {
       this.fetchLoading = true
-      api('listPhysicalNetworks', { zoneid: this.resource.id }).then(json => {
+      getAPI('listPhysicalNetworks', { zoneid: this.resource.id }).then(json => {
         this.networks = json.listphysicalnetworksresponse.physicalnetwork || []
         this.fetchTrafficLabels()
       }).catch(error => {
@@ -217,7 +217,7 @@ export default {
       const promises = []
       for (const network of this.networks) {
         promises.push(new Promise((resolve, reject) => {
-          api('listTrafficTypes', { physicalnetworkid: network.id }).then(json => {
+          getAPI('listTrafficTypes', { physicalnetworkid: network.id }).then(json => {
             if (json.listtraffictypesresponse.traffictype) {
               network.traffictype = json.listtraffictypesresponse.traffictype.filter(e => { return e.traffictype }).map(e => { return e.traffictype }).join(', ')
             }
@@ -249,7 +249,7 @@ export default {
         if (values.tags) {
           values.tags = values.tags.join()
         }
-        api('createPhysicalNetwork', values).then(response => {
+        postAPI('createPhysicalNetwork', values).then(response => {
           this.$pollJob({
             jobId: response.createphysicalnetworkresponse.jobid,
             successMessage: this.$t('message.success.add.physical.network'),
diff --git a/ui/src/views/infra/zone/SystemVmsTab.vue b/ui/src/views/infra/zone/SystemVmsTab.vue
index 23576d196a5a..b387784cc88b 100644
--- a/ui/src/views/infra/zone/SystemVmsTab.vue
+++ b/ui/src/views/infra/zone/SystemVmsTab.vue
@@ -69,7 +69,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -110,7 +110,7 @@ export default {
   methods: {
     fetchData () {
       this.fetchLoading = true
-      api('listSystemVms', { zoneid: this.resource.id }).then(json => {
+      getAPI('listSystemVms', { zoneid: this.resource.id }).then(json => {
         this.vms = json.listsystemvmsresponse.systemvm || []
       }).catch(error => {
         this.$notifyError(error)
diff --git a/ui/src/views/infra/zone/ZoneWizardAddResources.vue b/ui/src/views/infra/zone/ZoneWizardAddResources.vue
index 9e6d8eda5967..dc7aeabf24ac 100644
--- a/ui/src/views/infra/zone/ZoneWizardAddResources.vue
+++ b/ui/src/views/infra/zone/ZoneWizardAddResources.vue
@@ -105,7 +105,7 @@
 </template>
 <script>
 import { nextTick } from 'vue'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import StaticInputsForm from '@views/infra/zone/StaticInputsForm'
 import store from '@/store'
@@ -1084,7 +1084,7 @@ export default {
       }
     },
     fetchNexusSwitchConfig () {
-      api('listConfigurations', { name: 'vmware.use.nexus.vswitch' }).then(json => {
+      getAPI('listConfigurations', { name: 'vmware.use.nexus.vswitch' }).then(json => {
         let vSwitchEnabled = false
         if (json.listconfigurationsresponse.configuration[0].value) {
           vSwitchEnabled = true
@@ -1094,7 +1094,7 @@ export default {
     },
     fetchDvSwitchConfig () {
       let dvSwitchEnabled = false
-      api('listConfigurations', { name: 'vmware.use.dvswitch' }).then(json => {
+      getAPI('listConfigurations', { name: 'vmware.use.dvswitch' }).then(json => {
         if (json.listconfigurationsresponse.configuration[0].value) {
           dvSwitchEnabled = true
         }
@@ -1103,7 +1103,7 @@ export default {
     },
     fetchProvider () {
       const storageProviders = []
-      api('listImageStores', { provider: 'S3' }).then(json => {
+      getAPI('listImageStores', { provider: 'S3' }).then(json => {
         const s3stores = json.listimagestoresresponse.imagestore
         if (s3stores != null && s3stores.length > 0) {
           storageProviders.push({ id: 'S3', description: 'S3' })
@@ -1118,7 +1118,7 @@ export default {
     },
     fetchPrimaryStorageProvider () {
       this.primaryStorageProviders = []
-      api('listStorageProviders', { type: 'primary' }).then(json => {
+      getAPI('listStorageProviders', { type: 'primary' }).then(json => {
         this.primaryStorageProviders = json.liststorageprovidersresponse.dataStoreProvider || []
         this.primaryStorageProviders.map((item, idx) => { this.primaryStorageProviders[idx].id = item.name })
       })
diff --git a/ui/src/views/infra/zone/ZoneWizardLaunchZone.vue b/ui/src/views/infra/zone/ZoneWizardLaunchZone.vue
index 571699a1f312..23703049c833 100644
--- a/ui/src/views/infra/zone/ZoneWizardLaunchZone.vue
+++ b/ui/src/views/infra/zone/ZoneWizardLaunchZone.vue
@@ -87,7 +87,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 const BASIC_ZONE = 'Basic'
 const ADVANCED_ZONE = 'Advanced'
@@ -1736,7 +1736,7 @@ export default {
     async pollJob (jobId) {
       return new Promise(resolve => {
         const asyncJobInterval = setInterval(() => {
-          api('queryAsyncJobResult', { jobId }).then(async json => {
+          getAPI('queryAsyncJobResult', { jobId }).then(async json => {
             const result = json.queryasyncjobresultresponse
             if (result.jobstatus === 0) {
               return
@@ -1752,7 +1752,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('createZone', args).then(json => {
+        postAPI('createZone', args).then(json => {
           const zone = json.createzoneresponse.zone
           resolve(zone)
         }).catch(error => {
@@ -1765,7 +1765,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('dedicateZone', args).then(json => {
+        postAPI('dedicateZone', args).then(json => {
           resolve()
         }).catch(error => {
           message = error.response.headers['x-description']
@@ -1777,7 +1777,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('createPhysicalNetwork', args).then(async json => {
+        postAPI('createPhysicalNetwork', args).then(async json => {
           const jobId = json.createphysicalnetworkresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -1805,7 +1805,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('addTrafficType', params).then(async json => {
+        postAPI('addTrafficType', params).then(async json => {
           const jobId = json.addtraffictyperesponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -1829,7 +1829,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('updatePhysicalNetwork', args).then(async json => {
+        postAPI('updatePhysicalNetwork', args).then(async json => {
           const jobId = json.updatephysicalnetworkresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -1851,7 +1851,7 @@ export default {
         let providerId = null
         let message = ''
 
-        api('listNetworkServiceProviders', params).then(json => {
+        getAPI('listNetworkServiceProviders', params).then(json => {
           const items = json.listnetworkserviceprovidersresponse.networkserviceprovider
           if (items != null && items.length > 0) {
             providerId = items[0].id
@@ -1873,7 +1873,7 @@ export default {
         let virtualRouterElementId = null
         let message = ''
 
-        api('listVirtualRouterElements', { nspid: virtualRouterProviderId }).then(json => {
+        getAPI('listVirtualRouterElements', { nspid: virtualRouterProviderId }).then(json => {
           const items = json.listvirtualrouterelementsresponse.virtualrouterelement
           if (items != null && items.length > 0) {
             virtualRouterElementId = items[0].id
@@ -1897,7 +1897,7 @@ export default {
         params.enabled = true
         params.id = virtualRouterElementId
 
-        api('configureVirtualRouterElement', params).then(async json => {
+        postAPI('configureVirtualRouterElement', params).then(async json => {
           const jobId = json.configurevirtualrouterelementresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -1922,7 +1922,7 @@ export default {
         params.id = providerId
         params.state = 'Enabled'
 
-        api('updateNetworkServiceProvider', params).then(async json => {
+        postAPI('updateNetworkServiceProvider', params).then(async json => {
           const jobId = json.updatenetworkserviceproviderresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -1953,7 +1953,7 @@ export default {
         let message = ''
         let ovsElementId = null
 
-        api('listOvsElements', { nspid: ovsProviderId }).then(json => {
+        getAPI('listOvsElements', { nspid: ovsProviderId }).then(json => {
           const items = json.listovselementsresponse.ovselement
           if (items != null && items.length > 0) {
             ovsElementId = items[0].id
@@ -1969,7 +1969,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('configureOvsElement', { enabled: true, id: ovsElementId }).then(async json => {
+        postAPI('configureOvsElement', { enabled: true, id: ovsElementId }).then(async json => {
           const jobId = json.configureovselementresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -1991,7 +1991,7 @@ export default {
         let internalLbElementId = null
         let message = ''
 
-        api('listInternalLoadBalancerElements', { nspid: internalLbProviderId }).then(json => {
+        getAPI('listInternalLoadBalancerElements', { nspid: internalLbProviderId }).then(json => {
           const items = json.listinternalloadbalancerelementsresponse.internalloadbalancerelement
           if (items != null && items.length > 0) {
             internalLbElementId = items[0].id
@@ -2011,7 +2011,7 @@ export default {
     configureInternalLoadBalancerElement (internalLbElementId) {
       return new Promise((resolve, reject) => {
         let message = ''
-        api('configureInternalLoadBalancerElement', { enabled: true, id: internalLbElementId }).then(async json => {
+        postAPI('configureInternalLoadBalancerElement', { enabled: true, id: internalLbElementId }).then(async json => {
           const jobId = json.configureinternalloadbalancerelementresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -2032,7 +2032,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('addNetworkServiceProvider', arg).then(async json => {
+        postAPI('addNetworkServiceProvider', arg).then(async json => {
           const jobId = json.addnetworkserviceproviderresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -2053,7 +2053,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('createNetwork', args).then(json => {
+        postAPI('createNetwork', args).then(json => {
           const returnedGuestNetwork = json.createnetworkresponse.network
           resolve(returnedGuestNetwork)
         }).catch(error => {
@@ -2066,7 +2066,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('createPod', args).then(json => {
+        postAPI('createPod', args).then(json => {
           const returnedPod = json.createpodresponse.pod
           resolve(returnedPod)
         }).catch(error => {
@@ -2079,7 +2079,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('createVlanIpRange', args).then(json => {
+        postAPI('createVlanIpRange', args).then(json => {
           const item = json.createvlaniprangeresponse.vlan
           resolve(item)
         }).catch(error => {
@@ -2092,7 +2092,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('createStorageNetworkIpRange', args).then(async json => {
+        postAPI('createStorageNetworkIpRange', args).then(async json => {
           const jobId = json.createstoragenetworkiprangeresponse.jobid
           resolve({
             jobid: jobId,
@@ -2108,7 +2108,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('addVmwareDc', {}, 'POST', args).then(json => {
+        postAPI('addVmwareDc', args).then(json => {
           const item = json.addvmwaredcresponse.vmwaredc
           resolve(item)
         }).catch(error => {
@@ -2121,7 +2121,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('addCluster', args, 'POST').then(json => {
+        postAPI('addCluster', args).then(json => {
           const result = json.addclusterresponse.cluster[0]
           resolve(result)
         }).catch(error => {
@@ -2134,7 +2134,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('addHost', {}, 'POST', args).then(json => {
+        postAPI('addHost', args).then(json => {
           const result = json.addhostresponse.host[0]
           resolve(result)
         }).catch(error => {
@@ -2147,7 +2147,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('updateConfiguration', args).then(json => {
+        postAPI('updateConfiguration', args).then(json => {
           resolve()
         }).catch(error => {
           message = error.response.headers['x-description']
@@ -2163,7 +2163,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('createStoragePool', args).then(json => {
+        postAPI('createStoragePool', args).then(json => {
           const result = json.createstoragepoolresponse.storagepool
           resolve(result)
         }).catch(error => {
@@ -2176,7 +2176,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('addImageStore', args).then(json => {
+        postAPI('addImageStore', args).then(json => {
           const result = json.addimagestoreresponse.secondarystorage
           resolve(result)
         }).catch(error => {
@@ -2189,7 +2189,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('createSecondaryStagingStore', args).then(json => {
+        postAPI('createSecondaryStagingStore', args).then(json => {
           const result = json.addimagestoreresponse.secondarystorage
           resolve(result)
         }).catch(error => {
@@ -2202,7 +2202,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('addNetscalerLoadBalancer', {}, 'POST', args).then(async json => {
+        postAPI('addNetscalerLoadBalancer', args).then(async json => {
           const jobId = json.addnetscalerloadbalancerresponse.jobid
           if (jobId) {
             const result = await this.pollJob(jobId)
@@ -2223,7 +2223,7 @@ export default {
       return new Promise((resolve, reject) => {
         let message = ''
 
-        api('updateZone', args).then(json => {
+        postAPI('updateZone', args).then(json => {
           const result = json.updatezoneresponse.zone
           resolve(result)
         }).catch(error => {
@@ -2234,7 +2234,7 @@ export default {
     },
     createTungstenFabricProvider (args) {
       return new Promise((resolve, reject) => {
-        api('createTungstenFabricProvider', {}, 'POST', args).then(json => {
+        postAPI('createTungstenFabricProvider', args).then(json => {
           resolve()
         }).catch(error => {
           const message = error.response.headers['x-description']
@@ -2244,7 +2244,7 @@ export default {
     },
     addNsxController (args) {
       return new Promise((resolve, reject) => {
-        api('addNsxController', {}, 'POST', args).then(json => {
+        postAPI('addNsxController', args).then(json => {
           resolve()
         }).catch(error => {
           const message = error.response.headers['x-description']
@@ -2254,7 +2254,7 @@ export default {
     },
     configTungstenFabricService (args) {
       return new Promise((resolve, reject) => {
-        api('configTungstenFabricService', {}, 'POST', args).then(json => {
+        postAPI('configTungstenFabricService', args).then(json => {
           resolve()
         }).catch(error => {
           const message = error.response.headers['x-description']
@@ -2264,7 +2264,7 @@ export default {
     },
     createTungstenFabricManagementNetwork (args) {
       return new Promise((resolve, reject) => {
-        api('createTungstenFabricManagementNetwork', args).then(json => {
+        postAPI('createTungstenFabricManagementNetwork', args).then(json => {
           resolve()
         }).catch(error => {
           const message = error.response.headers['x-description']
@@ -2274,7 +2274,7 @@ export default {
     },
     createTungstenFabricPublicNetwork (args) {
       return new Promise((resolve, reject) => {
-        api('createTungstenFabricPublicNetwork', args).then(json => {
+        postAPI('createTungstenFabricPublicNetwork', args).then(json => {
           resolve()
         }).catch(error => {
           const message = error.response.headers['x-description']
diff --git a/ui/src/views/infra/zone/ZoneWizardNetworkSetupStep.vue b/ui/src/views/infra/zone/ZoneWizardNetworkSetupStep.vue
index 24efe448b252..b14886cfeed1 100644
--- a/ui/src/views/infra/zone/ZoneWizardNetworkSetupStep.vue
+++ b/ui/src/views/infra/zone/ZoneWizardNetworkSetupStep.vue
@@ -143,7 +143,7 @@
 
 <script>
 import { nextTick } from 'vue'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import ZoneWizardPhysicalNetworkSetupStep from '@views/infra/zone/ZoneWizardPhysicalNetworkSetupStep'
 import IpAddressRangeForm from '@views/infra/zone/IpAddressRangeForm'
@@ -647,7 +647,7 @@ export default {
     },
     fetchConfiguration () {
       this.skipGuestTrafficStep = false
-      api('listConfigurations', { name: 'sdn.ovs.controller' }).then(json => {
+      getAPI('listConfigurations', { name: 'sdn.ovs.controller' }).then(json => {
         const items = json.listconfigurationsresponse.configuration
         items.forEach(item => {
           if (item.name === 'sdn.ovs.controller') {
diff --git a/ui/src/views/infra/zone/ZoneWizardZoneDetailsStep.vue b/ui/src/views/infra/zone/ZoneWizardZoneDetailsStep.vue
index 05c5adc1bd20..80d034b201b9 100644
--- a/ui/src/views/infra/zone/ZoneWizardZoneDetailsStep.vue
+++ b/ui/src/views/infra/zone/ZoneWizardZoneDetailsStep.vue
@@ -248,7 +248,7 @@
 <script>
 
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 export default {
   props: {
@@ -455,7 +455,7 @@ export default {
       })
     },
     fetchData () {
-      api('listHypervisors').then(json => {
+      getAPI('listHypervisors').then(json => {
         this.hypervisors = json.listhypervisorsresponse.hypervisor
         if ('listSimulatorHAStateTransitions' in this.$store.getters.apis) {
           this.hypervisors.push({ name: 'Simulator' })
@@ -465,7 +465,7 @@ export default {
       })
 
       if (!this.isAdvancedZone || this.securityGroupsEnabled) {
-        api('listNetworkOfferings', { state: 'Enabled', guestiptype: 'Shared' }).then(json => {
+        getAPI('listNetworkOfferings', { state: 'Enabled', guestiptype: 'Shared' }).then(json => {
           this.networkOfferings = {}
           json.listnetworkofferingsresponse.networkoffering.forEach(offering => {
             this.setupNetworkOfferingAdditionalFlags(offering)
@@ -477,7 +477,7 @@ export default {
         })
       }
 
-      api('listDomains', { listAll: true }).then(json => {
+      getAPI('listDomains', { listAll: true }).then(json => {
         this.domains = {}
         json.listdomainsresponse.domain.forEach(dom => {
           this.domains[dom.id] = dom
diff --git a/ui/src/views/network/AclListRulesTab.vue b/ui/src/views/network/AclListRulesTab.vue
index e01e61289e50..df1b8ac10bab 100644
--- a/ui/src/views/network/AclListRulesTab.vue
+++ b/ui/src/views/network/AclListRulesTab.vue
@@ -309,7 +309,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import draggable from 'vuedraggable'
 import { mixinForm } from '@/utils/mixin'
 import TooltipButton from '@/components/widgets/TooltipButton'
@@ -413,12 +413,12 @@ export default {
       return result
     },
     fetchNetworkProtocols () {
-      api('listNetworkProtocols', {
+      getAPI('listNetworkProtocols', {
         option: 'protocolnumber'
       }).then(json => {
         this.protocolNumbers = json.listnetworkprotocolsresponse?.networkprotocol || []
       })
-      api('listNetworkProtocols', {
+      getAPI('listNetworkProtocols', {
         option: 'icmptype'
       }).then(json => {
         this.icmpTypes.push({ index: -1, description: this.$t('label.all') })
@@ -447,7 +447,7 @@ export default {
         aclid: this.resource.id,
         keyword: this.searchQuery
       }
-      api('listNetworkACLs', params).then(json => {
+      getAPI('listNetworkACLs', params).then(json => {
         this.acls = json.listnetworkaclsresponse.networkacl || []
         if (this.acls.length > 0) {
           this.acls.sort((a, b) => a.number - b.number)
@@ -459,7 +459,7 @@ export default {
       })
     },
     fetchTags (acl) {
-      api('listTags', {
+      getAPI('listTags', {
         resourceId: acl.id,
         resourceType: 'NetworkACL',
         listAll: true
@@ -481,7 +481,7 @@ export default {
     },
     handleDeleteTag (tag) {
       this.tagsLoading = true
-      api('deleteTags', {
+      postAPI('deleteTags', {
         'tags[0].key': tag.key,
         'tags[0].value': tag.value,
         resourceIds: this.selectedAcl.id,
@@ -520,7 +520,7 @@ export default {
       this.formRef.value.validate().then(() => {
         const values = toRaw(this.form)
 
-        api('createTags', {
+        postAPI('createTags', {
           'tags[0].key': values.key,
           'tags[0].value': values.value,
           resourceIds: this.selectedAcl.id,
@@ -620,7 +620,7 @@ export default {
         data.id = this.selectedAcl.id
         data.partialupgrade = false
 
-        api('updateNetworkACLItem', {}, 'POST', data).then(response => {
+        postAPI('updateNetworkACLItem', data).then(response => {
           this.$pollJob({
             jobId: response.createnetworkaclresponse.jobid,
             title: this.$t('label.edit.acl.rule'),
@@ -652,7 +652,7 @@ export default {
     },
     handleDeleteRule (id) {
       this.fetchLoading = true
-      api('deleteNetworkACL', { id }).then(response => {
+      postAPI('deleteNetworkACL', { id }).then(response => {
         this.$pollJob({
           jobId: response.deletenetworkaclresponse.jobid,
           title: this.$t('message.delete.acl.rule'),
@@ -709,7 +709,7 @@ export default {
         const data = this.getDataFromForm(values)
         data.aclid = this.resource.id
 
-        api('createNetworkACL', {}, 'POST', data).then(() => {
+        postAPI('createNetworkACL', data).then(() => {
           this.$notification.success({
             message: this.$t('label.success'),
             description: this.$t('message.success.add.rule')
@@ -740,7 +740,7 @@ export default {
     },
     moveRule (id, previousaclruleid, nextaclruleid) {
       this.fetchLoading = true
-      api('moveNetworkAclItem', {
+      postAPI('moveNetworkAclItem', {
         id,
         previousaclruleid,
         nextaclruleid
diff --git a/ui/src/views/network/ChangeBgpPeerForNetwork.vue b/ui/src/views/network/ChangeBgpPeerForNetwork.vue
index cbde0a574505..21c12ad91bbe 100644
--- a/ui/src/views/network/ChangeBgpPeerForNetwork.vue
+++ b/ui/src/views/network/ChangeBgpPeerForNetwork.vue
@@ -56,7 +56,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { genericCompare } from '@/utils/sort.js'
 
 export default {
@@ -112,7 +112,7 @@ export default {
       this.loading = true
       this.items = []
       this.total = 0
-      api('listBgpPeers', {
+      getAPI('listBgpPeers', {
         keyword: this.options.keyword,
         zoneid: this.resource.zoneid,
         domainid: this.resource.domainid,
@@ -149,7 +149,7 @@ export default {
     handleSubmit () {
       if (this.loading) return
       this.loading = true
-      api('changeBgpPeersForNetwork', {
+      postAPI('changeBgpPeersForNetwork', {
         networkid: this.resource.id,
         bgppeerids: this.selectedRowKeys.join(',')
       }).then(response => {
diff --git a/ui/src/views/network/ChangeBgpPeerForVpc.vue b/ui/src/views/network/ChangeBgpPeerForVpc.vue
index 711936f95cae..f8674f8b637c 100644
--- a/ui/src/views/network/ChangeBgpPeerForVpc.vue
+++ b/ui/src/views/network/ChangeBgpPeerForVpc.vue
@@ -56,7 +56,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { genericCompare } from '@/utils/sort.js'
 
 export default {
@@ -112,7 +112,7 @@ export default {
       this.loading = true
       this.items = []
       this.total = 0
-      api('listBgpPeers', {
+      getAPI('listBgpPeers', {
         keyword: this.options.keyword,
         zoneid: this.resource.zoneid,
         domainid: this.resource.domainid,
@@ -149,7 +149,7 @@ export default {
     handleSubmit () {
       if (this.loading) return
       this.loading = true
-      api('changeBgpPeersForVpc', {
+      postAPI('changeBgpPeersForVpc', {
         vpcid: this.resource.id,
         bgppeerids: this.selectedRowKeys.join(',')
       }).then(response => {
diff --git a/ui/src/views/network/CreateIpv4SubnetForNetwork.vue b/ui/src/views/network/CreateIpv4SubnetForNetwork.vue
index af1ef8c0e256..a99cce4e3933 100644
--- a/ui/src/views/network/CreateIpv4SubnetForNetwork.vue
+++ b/ui/src/views/network/CreateIpv4SubnetForNetwork.vue
@@ -101,7 +101,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -148,7 +148,7 @@ export default {
     fetchZones () {
       this.loading = true
       const params = { showicon: true }
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         this.zones = json.listzonesresponse.zone || []
         this.zones = this.zones.filter(zone => zone.routedmodeenabled)
         this.form.zoneid = this.zones[0].id || ''
@@ -163,7 +163,7 @@ export default {
         zoneid: zoneId,
         listall: true
       }
-      api('listIpv4SubnetsForZone', params).then(json => {
+      getAPI('listIpv4SubnetsForZone', params).then(json => {
         this.parentSubnets = json.listipv4subnetsforzoneresponse.zoneipv4subnet || []
       }).finally(() => {
         this.loading = false
@@ -184,7 +184,7 @@ export default {
           params.cidrsize = values.cidrsize
         }
         this.loading = true
-        api('createIpv4SubnetForGuestNetwork', params).then(response => {
+        postAPI('createIpv4SubnetForGuestNetwork', params).then(response => {
           this.$pollJob({
             jobId: response.createipv4subnetforguestnetworkresponse.jobid,
             title: this.$t('message.success.add.ipv4.subnet.for.guest.network'),
diff --git a/ui/src/views/network/CreateIsolatedNetworkForm.vue b/ui/src/views/network/CreateIsolatedNetworkForm.vue
index cbfc2f97cfcd..d237759ad2a7 100644
--- a/ui/src/views/network/CreateIsolatedNetworkForm.vue
+++ b/ui/src/views/network/CreateIsolatedNetworkForm.vue
@@ -317,7 +317,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin, isAdminOrDomainAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -448,7 +448,7 @@ export default {
       }
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         for (const i in json.listzonesresponse.zone) {
           const zone = json.listzonesresponse.zone[i]
           if (zone.networktype === 'Advanced' && zone.securitygroupsenabled !== true && zone.type !== 'Edge') {
@@ -477,7 +477,7 @@ export default {
       this.asNumberLoading = true
       params.zoneid = this.selectedZone.id
       params.isallocated = false
-      api('listASNumbers', params).then(json => {
+      getAPI('listASNumbers', params).then(json => {
         this.asNumbersZone = json.listasnumbersresponse.asnumber
         this.asNumberLoading = false
       })
@@ -518,7 +518,7 @@ export default {
         var params = {}
         this.networkOfferingLoading = true
         if ('listVPCs' in this.$store.getters.apis) {
-          api('listVPCs', params).then(json => {
+          getAPI('listVPCs', params).then(json => {
             const listVPCs = json.listvpcsresponse.vpc
             var vpcAvailable = this.arrayHasItems(listVPCs)
             if (vpcAvailable === false) {
@@ -550,7 +550,7 @@ export default {
       }
       this.networkOfferings = []
       this.selectedNetworkOffering = {}
-      api('listNetworkOfferings', params).then(json => {
+      getAPI('listNetworkOfferings', params).then(json => {
         this.networkOfferings = json.listnetworkofferingsresponse.networkoffering
         this.networkOfferings = this.networkOfferings.filter(offering => offering.fornsx === this.selectedZone.isnsxenabled)
         if (!this.selectedZone.routedmodeenabled) {
@@ -584,7 +584,7 @@ export default {
       if (this.vpc !== null) {
         params.id = this.vpc.id
       }
-      api('listVPCs', params).then(json => {
+      getAPI('listVPCs', params).then(json => {
         this.vpcs = json.listvpcsresponse.vpc
       }).finally(() => {
         this.vpcLoading = false
@@ -634,7 +634,7 @@ export default {
           params.asnumber = values.asnumber
         }
 
-        api('createNetwork', params).then(json => {
+        postAPI('createNetwork', params).then(json => {
           this.$notification.success({
             message: 'Network',
             description: this.$t('message.success.create.isolated.network')
diff --git a/ui/src/views/network/CreateL2NetworkForm.vue b/ui/src/views/network/CreateL2NetworkForm.vue
index 897233c52608..a28548e2b6fd 100644
--- a/ui/src/views/network/CreateL2NetworkForm.vue
+++ b/ui/src/views/network/CreateL2NetworkForm.vue
@@ -171,7 +171,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin, isAdminOrDomainAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -269,7 +269,7 @@ export default {
       }
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         for (const i in json.listzonesresponse.zone) {
           const zone = json.listzonesresponse.zone[i]
           if (zone.networktype === 'Advanced') {
@@ -320,7 +320,7 @@ export default {
         var params = {}
         this.networkOfferingLoading = true
         if ('listVPCs' in this.$store.getters.apis) {
-          api('listVPCs', params).then(json => {
+          getAPI('listVPCs', params).then(json => {
             const listVPCs = json.listvpcsresponse.vpc
             var vpcAvailable = this.arrayHasItems(listVPCs)
             if (vpcAvailable === false) {
@@ -350,7 +350,7 @@ export default {
       if (forVpc !== null) {
         params.forvpc = forVpc
       }
-      api('listNetworkOfferings', params).then(json => {
+      getAPI('listNetworkOfferings', params).then(json => {
         this.networkOfferings = json.listnetworkofferingsresponse.networkoffering
       }).catch(error => {
         this.$notifyError(error)
@@ -398,7 +398,7 @@ export default {
             params.isolatedpvlan = values.isolatedpvlan
           }
         }
-        api('createNetwork', params).then(json => {
+        postAPI('createNetwork', params).then(json => {
           this.$notification.success({
             message: 'Network',
             description: this.$t('message.success.create.l2.network')
diff --git a/ui/src/views/network/CreateNetwork.vue b/ui/src/views/network/CreateNetwork.vue
index 2e758bd98935..ad43ca7730d2 100644
--- a/ui/src/views/network/CreateNetwork.vue
+++ b/ui/src/views/network/CreateNetwork.vue
@@ -47,7 +47,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import CreateIsolatedNetworkForm from '@/views/network/CreateIsolatedNetworkForm'
 import CreateL2NetworkForm from '@/views/network/CreateL2NetworkForm'
 import CreateSharedNetworkForm from '@/views/network/CreateSharedNetworkForm'
@@ -110,7 +110,7 @@ export default {
         params.id = this.resource.zoneid
       }
       this.actionZoneLoading = true
-      return api('listZones', params).then(json => {
+      return getAPI('listZones', params).then(json => {
         this.actionZones = json.listzonesresponse.zone
       }).finally(() => {
         this.actionZoneLoading = false
diff --git a/ui/src/views/network/CreateNetworkPermission.vue b/ui/src/views/network/CreateNetworkPermission.vue
index 6d73bb07ca35..4cd335bbfbe4 100644
--- a/ui/src/views/network/CreateNetworkPermission.vue
+++ b/ui/src/views/network/CreateNetworkPermission.vue
@@ -81,7 +81,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { isAdminOrDomainAdmin } from '@/role'
 import { ref, reactive, toRaw } from 'vue'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -148,7 +148,7 @@ export default {
 
         this.loading = true
 
-        api('createNetworkPermissions', params)
+        postAPI('createNetworkPermissions', params)
           .then(() => {
             this.$notification.success({
               message: this.$t('message.success.add.network.permissions')
diff --git a/ui/src/views/network/CreateSharedNetworkForm.vue b/ui/src/views/network/CreateSharedNetworkForm.vue
index c7ff7eab5105..b64be4aabaaf 100644
--- a/ui/src/views/network/CreateSharedNetworkForm.vue
+++ b/ui/src/views/network/CreateSharedNetworkForm.vue
@@ -485,7 +485,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin, isAdminOrDomainAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -645,7 +645,7 @@ export default {
         }
         params.showicon = true
         this.zoneLoading = true
-        api('listZones', params).then(json => {
+        getAPI('listZones', params).then(json => {
           for (const i in json.listzonesresponse.zone) {
             const zone = json.listzonesresponse.zone[i]
             if (zone.networktype === 'Advanced' && (isAdmin() || zone.securitygroupsenabled !== true)) {
@@ -684,7 +684,7 @@ export default {
         zoneid: this.selectedZone.id
       }
       this.formPhysicalNetworkLoading = true
-      api('listPhysicalNetworks', params).then(json => {
+      getAPI('listPhysicalNetworks', params).then(json => {
         var networks = json.listphysicalnetworksresponse.physicalnetwork
         if (this.arrayHasItems(networks)) {
           for (const network of networks) {
@@ -714,7 +714,7 @@ export default {
       const params = {}
       params.physicalnetworkid = physicalNetwork.id
       return new Promise((resolve, reject) => {
-        api('listTrafficTypes', params).then(json => {
+        getAPI('listTrafficTypes', params).then(json => {
           var trafficTypes = json.listtraffictypesresponse.traffictype
           if (this.arrayHasItems(trafficTypes)) {
             for (const type of trafficTypes) {
@@ -799,7 +799,7 @@ export default {
       }
       this.handleNetworkOfferingChange(null)
       this.networkOfferings = []
-      api('listNetworkOfferings', params).then(json => {
+      getAPI('listNetworkOfferings', params).then(json => {
         this.networkOfferings = json.listnetworkofferingsresponse.networkoffering || []
       }).catch(error => {
         this.$notifyError(error)
@@ -868,7 +868,7 @@ export default {
       }
       this.handleNetworkChange(null)
       this.networks = []
-      api('listNetworks', params).then(json => {
+      getAPI('listNetworks', params).then(json => {
         var networks = json.listnetworksresponse.network || []
         for (const network of networks) {
           if (network.type === 'Isolated' || network.type === 'L2') {
@@ -885,7 +885,7 @@ export default {
       this.selectedNetwork = selectedNetwork
     },
     networkServiceProviderMap (id) {
-      api('listNetworkOfferings', { id: id }).then(json => {
+      getAPI('listNetworkOfferings', { id: id }).then(json => {
         var networkOffering = json.listnetworkofferingsresponse.networkoffering[0]
         const services = networkOffering.service
         this.selectedServiceProviderMap = {}
@@ -913,7 +913,7 @@ export default {
       }
       params.showicon = true
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         const listDomains = json.listdomainsresponse.domain || []
         this.domains = listDomains
       }).finally(() => {
@@ -947,7 +947,7 @@ export default {
       }
       this.accountLoading = true
       this.handleAccountChange(null)
-      api('listAccounts', params).then(json => {
+      getAPI('listAccounts', params).then(json => {
         this.accounts = json.listaccountsresponse.account || []
       }).finally(() => {
         this.accountLoading = false
@@ -977,7 +977,7 @@ export default {
       }
       this.projectLoading = true
       this.handleProjectChange(null)
-      api('listProjects', params).then(json => {
+      getAPI('listProjects', params).then(json => {
         this.projects = json.listprojectsresponse.project || []
       }).finally(() => {
         this.projectLoading = false
@@ -1080,7 +1080,7 @@ export default {
         if (this.isValidTextValueForKey(values, 'privatemtu')) {
           params.privatemtu = values.privatemtu
         }
-        api('createNetwork', params).then(json => {
+        postAPI('createNetwork', params).then(json => {
           this.$notification.success({
             message: this.$t('label.network'),
             description: this.$t('message.success.add.guest.network')
diff --git a/ui/src/views/network/CreateVlanIpRange.vue b/ui/src/views/network/CreateVlanIpRange.vue
index fdc1e9e21819..bf35fff9605a 100644
--- a/ui/src/views/network/CreateVlanIpRange.vue
+++ b/ui/src/views/network/CreateVlanIpRange.vue
@@ -139,7 +139,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
 export default {
@@ -216,7 +216,7 @@ export default {
     fetchZone () {
       return new Promise((resolve, reject) => {
         this.loading = true
-        api('listZones', { id: this.resource.zoneid }).then(json => {
+        getAPI('listZones', { id: this.resource.zoneid }).then(json => {
           this.zone = json.listzonesresponse.zone[0] || {}
           resolve(this.zone)
         }).catch(error => {
@@ -229,7 +229,7 @@ export default {
     },
     fetchPods () {
       this.loading = true
-      api('listPods', {
+      getAPI('listPods', {
         zoneid: this.resource.zoneid
       }).then(response => {
         this.pods = response.listpodsresponse.pod ? response.listpodsresponse.pod : []
@@ -263,7 +263,7 @@ export default {
 
         this.loading = true
 
-        api('createVlanIpRange', params)
+        postAPI('createVlanIpRange', params)
           .then(() => {
             this.$notification.success({
               message: this.$t('message.success.add.iprange')
diff --git a/ui/src/views/network/CreateVpc.vue b/ui/src/views/network/CreateVpc.vue
index 6ede446fb440..0b251364a921 100644
--- a/ui/src/views/network/CreateVpc.vue
+++ b/ui/src/views/network/CreateVpc.vue
@@ -218,7 +218,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin, isAdminOrDomainAdmin } from '@/role'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -304,7 +304,7 @@ export default {
       return isAdmin()
     },
     fetchPublicMtuForZone () {
-      api('listConfigurations', {
+      getAPI('listConfigurations', {
         name: 'vr.public.interface.mtu',
         zoneid: this.form.zoneid
       }).then(json => {
@@ -313,7 +313,7 @@ export default {
     },
     fetchZones () {
       this.loadingZone = true
-      api('listZones', { showicon: true }).then((response) => {
+      getAPI('listZones', { showicon: true }).then((response) => {
         const listZones = response.listzonesresponse.zone || []
         this.zones = listZones.filter(zone => !zone.securitygroupsenabled)
         this.form.zoneid = ''
@@ -349,14 +349,14 @@ export default {
       this.asNumberLoading = true
       params.zoneid = this.selectedZone.id
       params.isallocated = false
-      api('listASNumbers', params).then(json => {
+      getAPI('listASNumbers', params).then(json => {
         this.asNumbersZone = json.listasnumbersresponse.asnumber
         this.asNumberLoading = false
       })
     },
     fetchOfferings () {
       this.loadingOffering = true
-      api('listVPCOfferings', { zoneid: this.form.zoneid, state: 'Enabled' }).then((response) => {
+      getAPI('listVPCOfferings', { zoneid: this.form.zoneid, state: 'Enabled' }).then((response) => {
         this.vpcOfferings = response.listvpcofferingsresponse.vpcoffering
         this.vpcOfferings = this.vpcOfferings.filter(offering => offering.fornsx === this.selectedZone.isnsxenabled)
         if (!this.selectedZone.routedmodeenabled) {
@@ -474,7 +474,7 @@ export default {
         this.loading = true
         const title = this.$t('label.add.vpc')
         const description = this.$t('message.success.add.vpc')
-        api('createVPC', params).then(json => {
+        postAPI('createVPC', params).then(json => {
           const jobId = json.createvpcresponse.jobid
           if (jobId) {
             this.$pollJob({
diff --git a/ui/src/views/network/CreateVpnCustomerGateway.vue b/ui/src/views/network/CreateVpnCustomerGateway.vue
index 00b9f3b1b3f5..f71fc4709e8d 100644
--- a/ui/src/views/network/CreateVpnCustomerGateway.vue
+++ b/ui/src/views/network/CreateVpnCustomerGateway.vue
@@ -214,7 +214,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -310,7 +310,7 @@ export default {
         if (values.perfectForwardSecrecy !== 'None') {
           esppolicy += ';' + (values.perfectForwardSecrecy)
         }
-        api('createVpnCustomerGateway', {
+        postAPI('createVpnCustomerGateway', {
           name: values.name,
           gateway: values.gateway,
           cidrlist: values.cidrlist,
diff --git a/ui/src/views/network/EgressRulesTab.vue b/ui/src/views/network/EgressRulesTab.vue
index 9d315416e2a5..30d89f0dec58 100644
--- a/ui/src/views/network/EgressRulesTab.vue
+++ b/ui/src/views/network/EgressRulesTab.vue
@@ -174,7 +174,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import BulkActionView from '@/components/view/BulkActionView'
@@ -274,12 +274,12 @@ export default {
   inject: ['parentFetchData'],
   methods: {
     fetchNetworkProtocols () {
-      api('listNetworkProtocols', {
+      getAPI('listNetworkProtocols', {
         option: 'protocolnumber'
       }).then(json => {
         this.protocolNumbers = json.listnetworkprotocolsresponse?.networkprotocol || []
       })
-      api('listNetworkProtocols', {
+      getAPI('listNetworkProtocols', {
         option: 'icmptype'
       }).then(json => {
         this.icmpTypes.push({ index: -1, description: this.$t('label.all') })
@@ -303,7 +303,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('listEgressFirewallRules', {
+      getAPI('listEgressFirewallRules', {
         listAll: true,
         networkid: this.resource.id,
         page: this.page,
@@ -368,7 +368,7 @@ export default {
     },
     deleteRule (rule) {
       this.loading = true
-      api('deleteEgressFirewallRule', { id: rule.id }).then(response => {
+      postAPI('deleteEgressFirewallRule', { id: rule.id }).then(response => {
         const jobId = response.deleteegressfirewallruleresponse.jobid
         eventBus.emit('update-job-details', { jobId, resourceId: null })
         this.$pollJob({
@@ -404,7 +404,7 @@ export default {
     addRule () {
       if (this.loading) return
       this.loading = true
-      api('createEgressFirewallRule', { ...this.newRule }).then(response => {
+      postAPI('createEgressFirewallRule', { ...this.newRule }).then(response => {
         this.$pollJob({
           jobId: response.createegressfirewallruleresponse.jobid,
           successMessage: this.$t('message.success.add.egress.rule'),
diff --git a/ui/src/views/network/EnableStaticNat.vue b/ui/src/views/network/EnableStaticNat.vue
index 51d3e8f971bf..f6f6748630ca 100644
--- a/ui/src/views/network/EnableStaticNat.vue
+++ b/ui/src/views/network/EnableStaticNat.vue
@@ -113,7 +113,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -186,7 +186,7 @@ export default {
       }
 
       this.loading = true
-      api('listVirtualMachines', {
+      getAPI('listVirtualMachines', {
         page: this.page,
         pageSize: this.pageSize,
         listAll: true,
@@ -203,7 +203,7 @@ export default {
     },
     fetchDataTiers (e) {
       this.loading = true
-      api('listVirtualMachines', {
+      getAPI('listVirtualMachines', {
         page: this.page,
         pageSize: this.pageSize,
         listAll: true,
@@ -222,7 +222,7 @@ export default {
       this.selectedVm = e.target.value
       this.nicsList = []
       this.loading = true
-      api('listNics', {
+      getAPI('listNics', {
         virtualmachineid: this.selectedVm,
         networkid: this.resource.associatednetworkid || this.selectedVpcTier
       }).then(response => {
@@ -244,7 +244,7 @@ export default {
     },
     fetchNetworks () {
       this.loading = true
-      api('listNetworks', {
+      getAPI('listNetworks', {
         vpcid: this.resource.vpcid,
         isrecursive: true,
         supportedservices: 'StaticNat'
@@ -258,7 +258,7 @@ export default {
     },
     handleSubmit () {
       this.loading = true
-      api('enableStaticNat', {
+      postAPI('enableStaticNat', {
         ipaddressid: this.resource.id,
         virtualmachineid: this.selectedVm,
         vmguestip: this.selectedNic.ipaddress,
diff --git a/ui/src/views/network/FirewallRules.vue b/ui/src/views/network/FirewallRules.vue
index a0ecb2042ae5..b2f7ab6ec28b 100644
--- a/ui/src/views/network/FirewallRules.vue
+++ b/ui/src/views/network/FirewallRules.vue
@@ -216,7 +216,7 @@
 
 <script>
 import { reactive, ref, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import BulkActionView from '@/components/view/BulkActionView'
@@ -327,12 +327,12 @@ export default {
       })
     },
     fetchNetworkProtocols () {
-      api('listNetworkProtocols', {
+      getAPI('listNetworkProtocols', {
         option: 'protocolnumber'
       }).then(json => {
         this.protocolNumbers = json.listnetworkprotocolsresponse?.networkprotocol || []
       })
-      api('listNetworkProtocols', {
+      getAPI('listNetworkProtocols', {
         option: 'icmptype'
       }).then(json => {
         this.icmpTypes.push({ index: -1, description: this.$t('label.all') })
@@ -356,7 +356,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('listFirewallRules', {
+      getAPI('listFirewallRules', {
         listAll: true,
         ipaddressid: this.resource.id,
         page: this.page,
@@ -423,7 +423,7 @@ export default {
     },
     deleteRule (rule) {
       this.loading = true
-      api('deleteFirewallRule', { id: rule.id }).then(response => {
+      postAPI('deleteFirewallRule', { id: rule.id }).then(response => {
         const jobId = response.deletefirewallruleresponse.jobid
         eventBus.emit('update-job-details', { jobId, resourceId: null })
         this.$pollJob({
@@ -460,7 +460,7 @@ export default {
       if (this.newRule.cidrlist == null || this.newRule.cidrlist.trim?.() === '') {
         delete this.newRule.cidrlist
       }
-      api('createFirewallRule', { ...this.newRule }).then(response => {
+      postAPI('createFirewallRule', { ...this.newRule }).then(response => {
         this.$pollJob({
           jobId: response.createfirewallruleresponse.jobid,
           successMessage: this.$t('message.success.add.firewall.rule'),
@@ -510,7 +510,7 @@ export default {
       this.selectedRule = id
       this.tagsModalVisible = true
 
-      api('listTags', {
+      getAPI('listTags', {
         resourceId: id,
         resourceType: 'FirewallRule',
         listAll: true
@@ -529,7 +529,7 @@ export default {
         const values = toRaw(this.form)
 
         this.addTagLoading = true
-        api('createTags', {
+        postAPI('createTags', {
           'tags[0].key': values.key,
           'tags[0].value': values.value,
           resourceIds: this.selectedRule,
@@ -565,7 +565,7 @@ export default {
       })
     },
     handleDeleteTag (tag) {
-      api('deleteTags', {
+      postAPI('deleteTags', {
         'tags[0].key': tag.key,
         'tags[0].value': tag.value,
         resourceIds: this.selectedRule,
diff --git a/ui/src/views/network/GuestIpRanges.vue b/ui/src/views/network/GuestIpRanges.vue
index 815b3d9132fe..d09a29900d59 100644
--- a/ui/src/views/network/GuestIpRanges.vue
+++ b/ui/src/views/network/GuestIpRanges.vue
@@ -133,7 +133,7 @@
   </div>
 </template>
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import CreateVlanIpRange from '@/views/network/CreateVlanIpRange'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import { reactive, ref, toRaw } from 'vue'
@@ -219,7 +219,7 @@ export default {
         pagesize: this.pageSize
       }
       this.fetchLoading = true
-      api('listVlanIpRanges', params).then(json => {
+      getAPI('listVlanIpRanges', params).then(json => {
         this.total = json.listvlaniprangesresponse.count || 0
         this.ipranges = json.listvlaniprangesresponse.vlaniprange || []
       }).finally(() => {
@@ -227,7 +227,7 @@ export default {
       })
     },
     removeIpRange (id) {
-      api('deleteVlanIpRange', { id: id }).then(json => {
+      postAPI('deleteVlanIpRange', { id: id }).then(json => {
         const message = `${this.$t('message.success.delete')} ${this.$t('label.ip.range')}`
         this.$message.success(message)
       }).catch((error) => {
@@ -271,7 +271,7 @@ export default {
         for (const key of ipRangeKeys) {
           params[key] = values[key]
         }
-        api('updateVlanIpRange', params).then(() => {
+        postAPI('updateVlanIpRange', params).then(() => {
           this.$notification.success({
             message: this.$t('message.success.update.iprange')
           })
diff --git a/ui/src/views/network/GuestVlanNetworksTab.vue b/ui/src/views/network/GuestVlanNetworksTab.vue
index 657880b895ac..b4d64a8e21f8 100644
--- a/ui/src/views/network/GuestVlanNetworksTab.vue
+++ b/ui/src/views/network/GuestVlanNetworksTab.vue
@@ -39,7 +39,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -115,7 +115,7 @@ export default {
         id: this.resource.id
       }
       this.fetchLoading = true
-      api('listGuestVlans', params).then(json => {
+      getAPI('listGuestVlans', params).then(json => {
         this.networks = json.listguestvlansresponse.guestvlan[0].network || []
       }).catch(error => {
         this.$notifyError(error)
diff --git a/ui/src/views/network/IngressEgressRuleConfigure.vue b/ui/src/views/network/IngressEgressRuleConfigure.vue
index 92cd2fe50d01..699d4d509a12 100644
--- a/ui/src/views/network/IngressEgressRuleConfigure.vue
+++ b/ui/src/views/network/IngressEgressRuleConfigure.vue
@@ -212,7 +212,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
 export default {
@@ -322,12 +322,12 @@ export default {
       })
     },
     fetchNetworkProtocols () {
-      api('listNetworkProtocols', {
+      getAPI('listNetworkProtocols', {
         option: 'protocolnumber'
       }).then(json => {
         this.protocolNumbers = json.listnetworkprotocolsresponse?.networkprotocol || []
       })
-      api('listNetworkProtocols', {
+      getAPI('listNetworkProtocols', {
         option: 'icmptype'
       }).then(json => {
         this.icmpTypes.push({ index: -1, description: this.$t('label.all') })
@@ -364,7 +364,7 @@ export default {
       if (this.isSubmitted) return
       this.isSubmitted = true
       this.parentToggleLoading()
-      api(this.tabType === 'ingress' ? 'authorizeSecurityGroupIngress' : 'authorizeSecurityGroupEgress', {
+      postAPI(this.tabType === 'ingress' ? 'authorizeSecurityGroupIngress' : 'authorizeSecurityGroupEgress', {
         securitygroupid: this.resource.id,
         domainid: this.resource.domainid,
         account: this.resource.account,
@@ -406,7 +406,7 @@ export default {
     },
     handleDeleteRule (rule) {
       this.parentToggleLoading()
-      api(this.tabType === 'ingress' ? 'revokeSecurityGroupIngress' : 'revokeSecurityGroupEgress', {
+      postAPI(this.tabType === 'ingress' ? 'revokeSecurityGroupIngress' : 'revokeSecurityGroupEgress', {
         id: rule.ruleid,
         domainid: this.resource.domainid,
         account: this.resource.account
@@ -435,7 +435,7 @@ export default {
       })
     },
     fetchTags (rule) {
-      api('listTags', {
+      getAPI('listTags', {
         resourceId: rule.ruleid,
         resourceType: 'SecurityGroupRule',
         listAll: true
@@ -448,7 +448,7 @@ export default {
     handleDeleteTag (tag) {
       this.parentToggleLoading()
       this.tagsLoading = true
-      api('deleteTags', {
+      postAPI('deleteTags', {
         'tags[0].key': tag.key,
         'tags[0].value': tag.value,
         resourceIds: this.selectedRule.ruleid,
@@ -490,7 +490,7 @@ export default {
         const values = toRaw(this.form)
 
         this.parentToggleLoading()
-        api('createTags', {
+        postAPI('createTags', {
           'tags[0].key': values.key,
           'tags[0].value': values.value,
           resourceIds: this.selectedRule.ruleid,
diff --git a/ui/src/views/network/InternalLBAssignVmForm.vue b/ui/src/views/network/InternalLBAssignVmForm.vue
index 8eb030c44578..dfa2a24a0f6a 100644
--- a/ui/src/views/network/InternalLBAssignVmForm.vue
+++ b/ui/src/views/network/InternalLBAssignVmForm.vue
@@ -97,7 +97,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -138,7 +138,7 @@ export default {
     },
     fetchLoadBalancers () {
       this.fetchLoading = true
-      api('listLoadBalancers', {
+      getAPI('listLoadBalancers', {
         id: this.resource.id
       }).then(response => {
         const lb = response.listloadbalancersresponse.loadbalancer
@@ -155,7 +155,7 @@ export default {
     },
     fetchVirtualMachines () {
       this.fetchLoading = true
-      api('listVirtualMachines', {
+      getAPI('listVirtualMachines', {
         listAll: true,
         networkid: this.resource.networkid,
         page: this.page,
@@ -182,7 +182,7 @@ export default {
       }
       this.iLb.virtualmachineid[index] = e.target.value
       this.addVmModalNicLoading = true
-      api('listNics', {
+      getAPI('listNics', {
         virtualmachineid: e.target.value,
         networkid: this.resource.networkid
       }).then(response => {
@@ -218,7 +218,7 @@ export default {
       }
       this.params.id = this.resource.id
       this.fetchLoading = true
-      api('assignToLoadBalancerRule', this.params).then(response => {
+      postAPI('assignToLoadBalancerRule', this.params).then(response => {
         this.$pollJob({
           jobId: response.assigntoloadbalancerruleresponse.jobid,
           successMessage: `${this.$t('message.success.assigned.vms')} ${this.$t('label.to')} ${this.resource.name}`,
diff --git a/ui/src/views/network/InternalLBAssignedVmTab.vue b/ui/src/views/network/InternalLBAssignedVmTab.vue
index 035af0e06d3d..3e118b8ea2f7 100644
--- a/ui/src/views/network/InternalLBAssignedVmTab.vue
+++ b/ui/src/views/network/InternalLBAssignedVmTab.vue
@@ -65,7 +65,7 @@
   </a-spin>
 </template>
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
 export default {
@@ -121,7 +121,7 @@ export default {
   methods: {
     fetchData () {
       this.fetchLoading = true
-      api('listLoadBalancerRuleInstances', {
+      getAPI('listLoadBalancerRuleInstances', {
         id: this.resource.id,
         page: this.page,
         pagesize: this.pageSize
@@ -134,7 +134,7 @@ export default {
     },
     removeVmFromLB (vm) {
       this.fetchLoading = true
-      api('removeFromLoadBalancerRule', {
+      postAPI('removeFromLoadBalancerRule', {
         id: this.resource.id,
         virtualmachineids: vm.id
       }).then(response => {
diff --git a/ui/src/views/network/IpAddressesTab.vue b/ui/src/views/network/IpAddressesTab.vue
index 37b5b210a96f..f2efb9d2ba41 100644
--- a/ui/src/views/network/IpAddressesTab.vue
+++ b/ui/src/views/network/IpAddressesTab.vue
@@ -207,7 +207,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import BulkActionView from '@/components/view/BulkActionView'
@@ -322,7 +322,7 @@ export default {
         params.associatednetworkid = this.resource.id
       }
       this.fetchLoading = true
-      api('listPublicIpAddresses', params).then(json => {
+      getAPI('listPublicIpAddresses', params).then(json => {
         this.totalIps = json.listpublicipaddressesresponse.count || 0
         this.ips = json.listpublicipaddressesresponse.publicipaddress || []
       }).finally(() => {
@@ -338,7 +338,7 @@ export default {
           forvirtualnetwork: true,
           allocatedonly: false
         }
-        api('listPublicIpAddresses', params).then(json => {
+        getAPI('listPublicIpAddresses', params).then(json => {
           const listPublicIps = json.listpublicipaddressesresponse.publicipaddress || []
           resolve(listPublicIps)
         }).catch(reject)
@@ -368,7 +368,7 @@ export default {
       params.sourcenatipaddress = this.sourceNatIp.ipaddress
       params.id = this.resource.id
       this.settingsourcenat = true
-      api('updateNetwork', params).then(response => {
+      postAPI('updateNetwork', params).then(response => {
         this.fetchData()
       }).catch(error => {
         this.$notification.error({
@@ -386,7 +386,7 @@ export default {
       params.sourcenatipaddress = this.sourceNatIp.ipaddress
       params.id = this.resource.id
       this.settingsourcenat = true
-      api('updateVPC', params).then(response => {
+      postAPI('updateVPC', params).then(response => {
         this.fetchData()
       }).catch(error => {
         this.$notification.error({
@@ -436,7 +436,7 @@ export default {
       params.ipaddress = this.acquireIp
       this.acquireLoading = true
 
-      api('associateIpAddress', params).then(response => {
+      postAPI('associateIpAddress', params).then(response => {
         this.$pollJob({
           jobId: response.associateipaddressresponse.jobid,
           successMessage: `${this.$t('message.success.acquire.ip')} ${this.$t('label.for')} ${this.resource.name}`,
@@ -490,7 +490,7 @@ export default {
     },
     releaseIpAddress (ip) {
       this.fetchLoading = true
-      api('disassociateIpAddress', {
+      postAPI('disassociateIpAddress', {
         id: ip.id
       }).then(response => {
         const jobId = response.disassociateipaddressresponse.jobid
diff --git a/ui/src/views/network/Ipv6FirewallRulesTab.vue b/ui/src/views/network/Ipv6FirewallRulesTab.vue
index ffdcc9ddc7f3..5063338ef091 100644
--- a/ui/src/views/network/Ipv6FirewallRulesTab.vue
+++ b/ui/src/views/network/Ipv6FirewallRulesTab.vue
@@ -167,7 +167,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import BulkActionView from '@/components/view/BulkActionView'
@@ -271,7 +271,7 @@ export default {
   methods: {
     fetchData () {
       this.loading = true
-      api('listIpv6FirewallRules', {
+      getAPI('listIpv6FirewallRules', {
         listAll: true,
         networkid: this.resource.id,
         page: this.page,
@@ -336,7 +336,7 @@ export default {
     },
     deleteRule (rule) {
       this.loading = true
-      api('deleteIpv6FirewallRule', { id: rule.id }).then(response => {
+      postAPI('deleteIpv6FirewallRule', { id: rule.id }).then(response => {
         const jobId = response.deleteipv6firewallruleresponse.jobid
         eventBus.emit('update-job-details', jobId, null)
         this.$pollJob({
@@ -372,7 +372,7 @@ export default {
     addRule () {
       if (this.loading) return
       this.loading = true
-      api('createIpv6FirewallRule', { ...this.newRule }).then(response => {
+      postAPI('createIpv6FirewallRule', { ...this.newRule }).then(response => {
         this.$pollJob({
           jobId: response.createipv6firewallruleresponse.jobid,
           successMessage: this.$t('message.add.ip.v6.firewall.rule.success'),
diff --git a/ui/src/views/network/LoadBalancing.vue b/ui/src/views/network/LoadBalancing.vue
index 09f9a39c4cfa..61389df19c56 100644
--- a/ui/src/views/network/LoadBalancing.vue
+++ b/ui/src/views/network/LoadBalancing.vue
@@ -716,7 +716,7 @@
 
 <script>
 import { ref, reactive, toRaw, nextTick } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
@@ -983,7 +983,7 @@ export default {
     fetchListTiers () {
       this.tiers.loading = true
 
-      api('listNetworks', {
+      getAPI('listNetworks', {
         supportedservices: 'Lb',
         isrecursive: true,
         vpcid: this.resource.vpcid
@@ -1005,7 +1005,7 @@ export default {
       this.lbRules = []
       this.stickinessPolicies = []
 
-      api('listLoadBalancerRules', {
+      getAPI('listLoadBalancerRules', {
         listAll: true,
         publicipid: this.resource.id,
         page: this.page,
@@ -1032,7 +1032,7 @@ export default {
     fetchLBRuleInstances () {
       for (const rule of this.lbRules) {
         this.loading = true
-        api('listLoadBalancerRuleInstances', {
+        getAPI('listLoadBalancerRuleInstances', {
           listAll: true,
           lbvmips: true,
           id: rule.id
@@ -1048,7 +1048,7 @@ export default {
     fetchLBStickinessPolicies () {
       this.loading = true
       this.lbRules.forEach(rule => {
-        api('listLBStickinessPolicies', {
+        getAPI('listLBStickinessPolicies', {
           listAll: true,
           lbruleid: rule.id
         }).then(response => {
@@ -1063,7 +1063,7 @@ export default {
     fetchAutoScaleVMgroups () {
       this.loading = true
       this.lbRules.forEach(rule => {
-        api('listAutoScaleVmGroups', {
+        getAPI('listAutoScaleVmGroups', {
           listAll: true,
           lbruleid: rule.id
         }).then(response => {
@@ -1109,7 +1109,7 @@ export default {
       this.tagsModalVisible = true
       this.tags = []
       this.selectedRule = id
-      api('listTags', {
+      getAPI('listTags', {
         resourceId: id,
         resourceType: 'LoadBalancer',
         listAll: true
@@ -1130,7 +1130,7 @@ export default {
         const formRaw = toRaw(this.form)
         const values = this.handleRemoveFields(formRaw)
 
-        api('createTags', {
+        postAPI('createTags', {
           'tags[0].key': values.key,
           'tags[0].value': values.value,
           resourceIds: this.selectedRule,
@@ -1167,7 +1167,7 @@ export default {
     },
     handleDeleteTag (tag) {
       this.tagsModalLoading = true
-      api('deleteTags', {
+      postAPI('deleteTags', {
         'tags[0].key': tag.key,
         'tags[0].value': tag.value,
         resourceIds: tag.resourceid,
@@ -1226,7 +1226,7 @@ export default {
       }
     },
     handleAddStickinessPolicy (data, values) {
-      api('createLBStickinessPolicy', {
+      postAPI('createLBStickinessPolicy', {
         ...data,
         lbruleid: this.selectedRule,
         name: values.name,
@@ -1263,7 +1263,7 @@ export default {
     },
     handleDeleteStickinessPolicy () {
       this.stickinessModalLoading = true
-      api('deleteLBStickinessPolicy', { id: this.selectedStickinessPolicy.id }).then(response => {
+      postAPI('deleteLBStickinessPolicy', { id: this.selectedStickinessPolicy.id }).then(response => {
         this.$pollJob({
           jobId: response.deleteLBstickinessrruleresponse.jobid,
           successMessage: this.$t('message.success.remove.sticky.policy'),
@@ -1347,7 +1347,7 @@ export default {
     },
     handleDeleteInstanceFromRule (instance, rule, ip) {
       this.loading = true
-      api('removeFromLoadBalancerRule', {
+      postAPI('removeFromLoadBalancerRule', {
         id: rule.id,
         'vmidipmap[0].vmid': instance.loadbalancerruleinstance.id,
         'vmidipmap[0].vmip': ip
@@ -1384,7 +1384,7 @@ export default {
       if (this.editRuleModalLoading) return
       this.loading = true
       this.editRuleModalLoading = true
-      api('updateLoadBalancerRule', {
+      postAPI('updateLoadBalancerRule', {
         ...this.editRuleDetails,
         id: this.selectedRule.id
       }).then(response => {
@@ -1465,7 +1465,7 @@ export default {
     },
     handleDeleteRule (rule) {
       this.loading = true
-      api('deleteLoadBalancerRule', {
+      postAPI('deleteLoadBalancerRule', {
         id: rule.id
       }).then(response => {
         const jobId = response.deleteloadbalancerruleresponse.jobid
@@ -1551,7 +1551,7 @@ export default {
       this.newRule.virtualmachineid[index] = e.target.value
       this.addVmModalNicLoading = true
 
-      api('listNics', {
+      getAPI('listNics', {
         virtualmachineid: e.target.value,
         networkid: ('vpcid' in this.resource && !('associatednetworkid' in this.resource)) ? this.selectedTier : this.resource.associatednetworkid
       }).then(response => {
@@ -1578,7 +1578,7 @@ export default {
         this.addVmModalLoading = false
         return
       }
-      api('listVirtualMachines', {
+      getAPI('listVirtualMachines', {
         listAll: true,
         keyword: this.searchQuery,
         page: this.vmPage,
@@ -1615,7 +1615,7 @@ export default {
         this.addNetworkModalLoading = false
         return
       }
-      api('listNetworks', {
+      getAPI('listNetworks', {
         listAll: true,
         keyword: this.searchQuery,
         page: this.networkPage,
@@ -1677,7 +1677,7 @@ export default {
       }
 
       this.loading = true
-      api('assignToLoadBalancerRule', {
+      postAPI('assignToLoadBalancerRule', {
         id: data,
         ...vmIDIpMap
       }).then(response => {
@@ -1720,7 +1720,7 @@ export default {
 
       const networkId = this.selectedTierForAutoScaling != null ? this.selectedTierForAutoScaling
         : ('vpcid' in this.resource && !('associatednetworkid' in this.resource)) ? this.selectedTier : this.resource.associatednetworkid
-      api('createLoadBalancerRule', {
+      postAPI('createLoadBalancerRule', {
         openfirewall: false,
         networkid: networkId,
         publicipid: this.resource.id,
@@ -1793,7 +1793,7 @@ export default {
       this.tungstenHealthMonitors = []
       this.loading = true
       this.lbRules.forEach(rule => {
-        api('listTungstenFabricLBHealthMonitor', {
+        getAPI('listTungstenFabricLBHealthMonitor', {
           listAll: true,
           lbruleid: rule.id
         }).then(response => {
@@ -1860,7 +1860,7 @@ export default {
         }
 
         this.healthMonitorLoading = true
-        api('updateTungstenFabricLBHealthMonitor', this.healthMonitorParams).then(json => {
+        postAPI('updateTungstenFabricLBHealthMonitor', this.healthMonitorParams).then(json => {
           const jobId = json?.updatetungstenfabriclbhealthmonitorresponse?.jobid
           this.$pollJob({
             jobId: jobId,
diff --git a/ui/src/views/network/NetworkPermissions.vue b/ui/src/views/network/NetworkPermissions.vue
index a5434e5a3f5e..9e9ac25cf2b0 100644
--- a/ui/src/views/network/NetworkPermissions.vue
+++ b/ui/src/views/network/NetworkPermissions.vue
@@ -97,7 +97,7 @@
   </div>
 </template>
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import CreateNetworkPermission from '@/views/network/CreateNetworkPermission'
 import TooltipButton from '@/components/widgets/TooltipButton'
 export default {
@@ -165,7 +165,7 @@ export default {
         networkid: this.resource.id
       }
       this.fetchLoading = true
-      api('listNetworkPermissions', params).then(json => {
+      getAPI('listNetworkPermissions', params).then(json => {
         this.total = json.listnetworkpermissionsresponse.count || 0
         this.networkpermissions = json.listnetworkpermissionsresponse.networkpermission || []
       }).finally(() => {
@@ -181,7 +181,7 @@ export default {
       } else {
         params.accountids = accountId
       }
-      api('removeNetworkPermissions', params).then(json => {
+      postAPI('removeNetworkPermissions', params).then(json => {
         this.$notification.success({
           message: this.$t('message.success.remove.network.permissions')
         })
@@ -190,7 +190,7 @@ export default {
       })
     },
     resetNetworkPermission () {
-      api('resetNetworkPermissions', {
+      postAPI('resetNetworkPermissions', {
         networkid: this.resource.id
       }).then(json => {
         this.$notification.success({
diff --git a/ui/src/views/network/NicsTab.vue b/ui/src/views/network/NicsTab.vue
index eb0fd818cfa5..90db1d203882 100644
--- a/ui/src/views/network/NicsTab.vue
+++ b/ui/src/views/network/NicsTab.vue
@@ -227,7 +227,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import NicsTable from '@/views/network/NicsTable'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -282,7 +282,7 @@ export default {
   },
   methods: {
     listNetworks () {
-      api('listNetworks', {
+      getAPI('listNetworks', {
         listAll: 'true',
         showicon: true,
         zoneid: this.vm.zoneid
@@ -294,7 +294,7 @@ export default {
     fetchSecondaryIPs (nicId) {
       this.showSecondaryIpModal = true
       this.selectedNicId = nicId
-      api('listNics', {
+      getAPI('listNics', {
         nicId: nicId,
         keyword: '',
         virtualmachineid: this.vm.id
@@ -305,7 +305,7 @@ export default {
     fetchPublicIps (networkid) {
       this.listIps.loading = true
       this.listIps.opts = []
-      api('listPublicIpAddresses', {
+      getAPI('listPublicIpAddresses', {
         networkid: networkid,
         allocatedonly: false,
         forvirtualnetwork: false
@@ -372,7 +372,7 @@ export default {
       }
       this.showAddNetworkModal = false
       this.loadingNic = true
-      api('addNicToVirtualMachine', params).then(response => {
+      postAPI('addNicToVirtualMachine', params).then(response => {
         this.$pollJob({
           jobId: response.addnictovirtualmachineresponse.jobid,
           successMessage: this.$t('message.success.add.network'),
@@ -414,13 +414,13 @@ export default {
       const params = {}
       params.virtualmachineid = virtualmachineid
       params.networkid = networkid
-      return api('listNics', params).then(response => {
+      return getAPI('listNics', params).then(response => {
         return response.listnicsresponse.nic[0]
       })
     },
     setAsDefault (item) {
       this.loadingNic = true
-      api('updateDefaultNicForVirtualMachine', {
+      postAPI('updateDefaultNicForVirtualMachine', {
         virtualmachineid: this.vm.id,
         nicid: item.id
       }).then(response => {
@@ -456,7 +456,7 @@ export default {
       if (this.editIpAddressValue) {
         params.ipaddress = this.editIpAddressValue
       }
-      api('updateVmNicIp', params).then(response => {
+      postAPI('updateVmNicIp', params).then(response => {
         this.$pollJob({
           jobId: response.updatevmnicipresponse.jobid,
           successMessage: this.$t('message.success.update.ipaddress'),
@@ -486,7 +486,7 @@ export default {
     removeNIC (item) {
       this.loadingNic = true
 
-      api('removeNicFromVirtualMachine', {
+      postAPI('removeNicFromVirtualMachine', {
         nicid: item.id,
         virtualmachineid: this.vm.id
       }).then(response => {
@@ -523,7 +523,7 @@ export default {
         params.ipaddress = this.newSecondaryIp
       }
 
-      api('addIpToNic', params).then(response => {
+      postAPI('addIpToNic', params).then(response => {
         this.$pollJob({
           jobId: response.addiptovmnicresponse.jobid,
           successMessage: this.$t('message.success.add.secondary.ipaddress'),
@@ -555,7 +555,7 @@ export default {
     removeSecondaryIP (id) {
       this.loadingNic = true
 
-      api('removeIpFromNic', { id }).then(response => {
+      postAPI('removeIpFromNic', { id }).then(response => {
         this.$pollJob({
           jobId: response.removeipfromnicresponse.jobid,
           successMessage: this.$t('message.success.remove.secondary.ipaddress'),
diff --git a/ui/src/views/network/NicsTable.vue b/ui/src/views/network/NicsTable.vue
index f791e121428f..a31925a6b374 100644
--- a/ui/src/views/network/NicsTable.vue
+++ b/ui/src/views/network/NicsTable.vue
@@ -76,7 +76,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
 export default {
@@ -160,7 +160,7 @@ export default {
     fetchNetworkIcon (id, networkid) {
       return new Promise((resolve, reject) => {
         this.networkicon[id] = null
-        api('listNetworks', {
+        getAPI('listNetworks', {
           id: networkid,
           showicon: true
         }).then(json => {
diff --git a/ui/src/views/network/PortForwarding.vue b/ui/src/views/network/PortForwarding.vue
index 2c10b4bcc75d..8ab6559b12c3 100644
--- a/ui/src/views/network/PortForwarding.vue
+++ b/ui/src/views/network/PortForwarding.vue
@@ -338,7 +338,7 @@
 
 <script>
 import { reactive, ref, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import BulkActionView from '@/components/view/BulkActionView'
@@ -513,7 +513,7 @@ export default {
       }
       this.selectedTier = null
       this.tiers.loading = true
-      api('listNetworks', {
+      getAPI('listNetworks', {
         supportedservices: 'PortForwarding',
         vpcid: this.resource.vpcid,
         listall: this.resource.vpcid !== null
@@ -528,7 +528,7 @@ export default {
     },
     fetchPFRules () {
       this.loading = true
-      api('listPortForwardingRules', {
+      getAPI('listPortForwardingRules', {
         listAll: true,
         ipaddressid: this.resource.id,
         page: this.page,
@@ -595,7 +595,7 @@ export default {
     },
     deleteRule (rule) {
       this.loading = true
-      api('deletePortForwardingRule', { id: rule.id }).then(response => {
+      postAPI('deletePortForwardingRule', { id: rule.id }).then(response => {
         const jobId = response.deleteportforwardingruleresponse.jobid
         eventBus.emit('update-job-details', { jobId, resourceId: null })
         this.$pollJob({
@@ -631,7 +631,7 @@ export default {
       this.loading = true
       this.addVmModalVisible = false
       const networkId = ('vpcid' in this.resource && !('associatednetworkid' in this.resource)) ? this.selectedTier : this.resource.associatednetworkid
-      api('createPortForwardingRule', {
+      postAPI('createPortForwardingRule', {
         ...this.newRule,
         ipaddressid: this.resource.id,
         networkid: networkId
@@ -693,7 +693,7 @@ export default {
       this.selectedRule = id
       this.tagsModalVisible = true
       this.tags = []
-      api('listTags', {
+      getAPI('listTags', {
         resourceId: id,
         resourceType: 'PortForwardingRule',
         listAll: true
@@ -714,7 +714,7 @@ export default {
         const values = toRaw(this.form)
         this.tagsModalLoading = false
 
-        api('createTags', {
+        postAPI('createTags', {
           'tags[0].key': values.key,
           'tags[0].value': values.value,
           resourceIds: this.selectedRule,
@@ -747,7 +747,7 @@ export default {
     },
     handleDeleteTag (tag) {
       this.tagsModalLoading = true
-      api('deleteTags', {
+      postAPI('deleteTags', {
         'tags[0].key': tag.key,
         'tags[0].value': tag.value,
         resourceIds: this.selectedRule,
@@ -786,7 +786,7 @@ export default {
       this.nics = []
       this.addVmModalNicLoading = true
       this.newRule.virtualmachineid = e.target.value
-      api('listNics', {
+      getAPI('listNics', {
         virtualmachineid: e.target.value,
         networkId: ('vpcid' in this.resource && !('associatednetworkid' in this.resource)) ? this.selectedTier : this.resource.associatednetworkid
       }).then(response => {
@@ -813,7 +813,7 @@ export default {
         this.addVmModalLoading = false
         return
       }
-      api('listVirtualMachines', {
+      getAPI('listVirtualMachines', {
         listAll: true,
         keyword: this.searchQuery,
         page: this.vmPage,
diff --git a/ui/src/views/network/PublicIpResource.vue b/ui/src/views/network/PublicIpResource.vue
index 03b56fab2ee4..8654ec363c9b 100644
--- a/ui/src/views/network/PublicIpResource.vue
+++ b/ui/src/views/network/PublicIpResource.vue
@@ -43,7 +43,7 @@
 
 <script>
 import { shallowRef, defineAsyncComponent } from 'vue'
-import { api } from '@api'
+import { getAPI } from '@api'
 import { mixinDevice } from '@/utils/mixin.js'
 import eventBus from '@/config/eventBus'
 import AutogenView from '@/views/AutogenView.vue'
@@ -195,7 +195,7 @@ export default {
     },
     fetchNetwork () {
       return new Promise((resolve, reject) => {
-        api('listNetworks', {
+        getAPI('listNetworks', {
           listAll: true,
           projectid: this.resource.projectid,
           id: this.resource.associatednetworkid
@@ -209,7 +209,7 @@ export default {
     },
     fetchPortFWRule () {
       return new Promise((resolve, reject) => {
-        api('listPortForwardingRules', {
+        getAPI('listPortForwardingRules', {
           listAll: true,
           ipaddressid: this.resource.id,
           page: 1,
@@ -224,7 +224,7 @@ export default {
     },
     fetchLoadBalancerRule () {
       return new Promise((resolve, reject) => {
-        api('listLoadBalancerRules', {
+        getAPI('listLoadBalancerRules', {
           listAll: true,
           publicipid: this.resource.id,
           page: 1,
diff --git a/ui/src/views/network/ReservePublicIP.vue b/ui/src/views/network/ReservePublicIP.vue
index 3fffc5e354d2..d8b59a8614c2 100644
--- a/ui/src/views/network/ReservePublicIP.vue
+++ b/ui/src/views/network/ReservePublicIP.vue
@@ -125,7 +125,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import { isAdminOrDomainAdmin } from '@/role'
 
@@ -168,7 +168,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('listDomains', {
+      getAPI('listDomains', {
         response: 'json',
         listAll: true,
         showicon: true,
@@ -186,7 +186,7 @@ export default {
     },
     fetchAccounts () {
       this.loading = true
-      api('listAccounts', {
+      getAPI('listAccounts', {
         response: 'json',
         domainId: this.selectedDomain,
         showicon: true,
@@ -202,7 +202,7 @@ export default {
     },
     fetchProjects () {
       this.loading = true
-      api('listProjects', {
+      getAPI('listProjects', {
         response: 'json',
         domainId: this.selectedDomain,
         state: 'Active',
@@ -255,7 +255,7 @@ export default {
       }
 
       this.loading = true
-      api('reserveIpAddress', {
+      postAPI('reserveIpAddress', {
         response: 'json',
         id: this.resource.id,
         domainid: this.selectedDomain,
diff --git a/ui/src/views/network/RoutersTab.vue b/ui/src/views/network/RoutersTab.vue
index a2e9323d2657..353522765fa9 100644
--- a/ui/src/views/network/RoutersTab.vue
+++ b/ui/src/views/network/RoutersTab.vue
@@ -46,7 +46,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -130,7 +130,7 @@ export default {
         params.networkid = this.resource.id
       }
       this.fetchLoading = true
-      api('listRouters', params).then(json => {
+      getAPI('listRouters', params).then(json => {
         this.routers = json.listroutersresponse.router || []
       }).catch(error => {
         this.$notifyError(error)
diff --git a/ui/src/views/network/RoutingFirewallRulesTab.vue b/ui/src/views/network/RoutingFirewallRulesTab.vue
index 4ed9d6ae02f0..e3954dc19dfb 100644
--- a/ui/src/views/network/RoutingFirewallRulesTab.vue
+++ b/ui/src/views/network/RoutingFirewallRulesTab.vue
@@ -167,7 +167,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import BulkActionView from '@/components/view/BulkActionView'
@@ -271,7 +271,7 @@ export default {
   methods: {
     fetchData () {
       this.loading = true
-      api('listRoutingFirewallRules', {
+      getAPI('listRoutingFirewallRules', {
         listAll: true,
         networkid: this.resource.id,
         page: this.page,
@@ -336,7 +336,7 @@ export default {
     },
     deleteRule (rule) {
       this.loading = true
-      api('deleteRoutingFirewallRule', { id: rule.id }).then(response => {
+      postAPI('deleteRoutingFirewallRule', { id: rule.id }).then(response => {
         const jobId = response.deleteroutingfirewallruleresponse.jobid
         eventBus.emit('update-job-details', jobId, null)
         this.$pollJob({
@@ -372,7 +372,7 @@ export default {
     addRule () {
       if (this.loading) return
       this.loading = true
-      api('createRoutingFirewallRule', { ...this.newRule }).then(response => {
+      postAPI('createRoutingFirewallRule', { ...this.newRule }).then(response => {
         this.$pollJob({
           jobId: response.createroutingfirewallruleresponse.jobid,
           successMessage: this.$t('message.add.routing.firewall.rule.success'),
diff --git a/ui/src/views/network/StaticRoutesTab.vue b/ui/src/views/network/StaticRoutesTab.vue
index 9265f30fac12..bcdcc913fbfc 100644
--- a/ui/src/views/network/StaticRoutesTab.vue
+++ b/ui/src/views/network/StaticRoutesTab.vue
@@ -88,7 +88,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
 export default {
@@ -141,7 +141,7 @@ export default {
     },
     fetchData () {
       this.componentLoading = true
-      api('listStaticRoutes', {
+      getAPI('listStaticRoutes', {
         gatewayid: this.resource.id,
         listall: true
       }).then(json => {
@@ -157,7 +157,7 @@ export default {
       if (!this.newRoute) return
 
       this.componentLoading = true
-      api('createStaticRoute', {
+      postAPI('createStaticRoute', {
         cidr: this.newRoute,
         gatewayid: this.resource.id
       }).then(response => {
@@ -190,7 +190,7 @@ export default {
     },
     handleDelete (route) {
       this.componentLoading = true
-      api('deleteStaticRoute', {
+      postAPI('deleteStaticRoute', {
         id: route.id
       }).then(response => {
         this.$pollJob({
@@ -220,7 +220,7 @@ export default {
       })
     },
     fetchTags (route) {
-      api('listTags', {
+      getAPI('listTags', {
         resourceId: route.id,
         resourceType: 'StaticRoute',
         listAll: true
@@ -232,7 +232,7 @@ export default {
     },
     handleDeleteTag (tag) {
       this.tagsLoading = true
-      api('deleteTags', {
+      postAPI('deleteTags', {
         'tags[0].key': tag.key,
         'tags[0].value': tag.value,
         resourceIds: this.selectedRule.id,
@@ -269,7 +269,7 @@ export default {
       this.formRef.value.validate().then(() => {
         const values = toRaw(this.form)
 
-        api('createTags', {
+        postAPI('createTags', {
           'tags[0].key': values.key,
           'tags[0].value': values.value,
           resourceIds: this.selectedRule.id,
diff --git a/ui/src/views/network/UpdateNetwork.vue b/ui/src/views/network/UpdateNetwork.vue
index 84c0514adc9c..4a434bb15ae4 100644
--- a/ui/src/views/network/UpdateNetwork.vue
+++ b/ui/src/views/network/UpdateNetwork.vue
@@ -226,7 +226,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -328,7 +328,7 @@ export default {
       return array !== null && array !== undefined && Array.isArray(array) && array.length > 0
     },
     fetchMtuForZone () {
-      api('listZones', {
+      getAPI('listZones', {
         id: this.resource.zoneid
       }).then(json => {
         this.setMTU = json?.listzonesresponse?.zone?.[0]?.allowuserspecifyvrmtu || false
@@ -348,7 +348,7 @@ export default {
         params.id = this.resource.networkofferingid
       }
       this.networkOfferingLoading = true
-      api('listNetworkOfferings', params).then(json => {
+      getAPI('listNetworkOfferings', params).then(json => {
         this.networkOfferings = json.listnetworkofferingsresponse.networkoffering
       }).finally(() => {
         this.networkOfferingLoading = false
@@ -413,7 +413,7 @@ export default {
           this.networkOfferings[values.networkofferingid].id !== this.resource.networkofferingid) {
           params.networkofferingid = this.networkOfferings[values.networkofferingid].id
         }
-        api('updateNetwork', params).then(json => {
+        postAPI('updateNetwork', params).then(json => {
           const jobId = json.updatenetworkresponse.jobid
           this.$pollJob({
             jobId,
diff --git a/ui/src/views/network/VnfAppliancesTab.vue b/ui/src/views/network/VnfAppliancesTab.vue
index 0db85323d15d..a740bccf2f99 100644
--- a/ui/src/views/network/VnfAppliancesTab.vue
+++ b/ui/src/views/network/VnfAppliancesTab.vue
@@ -49,7 +49,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 
 export default {
@@ -130,7 +130,7 @@ export default {
         params.networkid = this.resource.id
       }
       this.fetchLoading = true
-      api('listVnfAppliances', params).then(json => {
+      getAPI('listVnfAppliances', params).then(json => {
         this.virtualmachines = json.listvnfappliancesresponse.virtualmachine || []
         for (const vm of this.virtualmachines) {
           for (const vmnic of vm.nic) {
diff --git a/ui/src/views/network/VpcTab.vue b/ui/src/views/network/VpcTab.vue
index 5c0838ff7e0f..a7218746ab2f 100644
--- a/ui/src/views/network/VpcTab.vue
+++ b/ui/src/views/network/VpcTab.vue
@@ -381,7 +381,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import DetailsTab from '@/components/view/DetailsTab'
 import Status from '@/components/widgets/Status'
@@ -577,7 +577,7 @@ export default {
     },
     fetchComments () {
       this.fetchLoading = true
-      api('listAnnotations', { entityid: this.resource.id, entitytype: 'VPC', annotationfilter: 'all' }).then(json => {
+      getAPI('listAnnotations', { entityid: this.resource.id, entitytype: 'VPC', annotationfilter: 'all' }).then(json => {
         if (json.listannotationsresponse && json.listannotationsresponse.annotation) {
           this.annotations = json.listannotationsresponse.annotation
         }
@@ -589,7 +589,7 @@ export default {
     },
     fetchPrivateGateways () {
       this.fetchLoading = true
-      api('listPrivateGateways', {
+      getAPI('listPrivateGateways', {
         vpcid: this.resource.id,
         listAll: true,
         page: this.page,
@@ -603,7 +603,7 @@ export default {
         this.fetchLoading = false
       })
       this.associatedNetworks = []
-      api('listNetworks', {
+      getAPI('listNetworks', {
         domainid: this.resource.domainid,
         account: this.resource.account,
         listAll: true,
@@ -621,7 +621,7 @@ export default {
     },
     fetchVpnGateways () {
       this.fetchLoading = true
-      api('listVpnGateways', {
+      getAPI('listVpnGateways', {
         vpcid: this.resource.id,
         listAll: true
       }).then(json => {
@@ -634,7 +634,7 @@ export default {
     },
     fetchVpnConnections () {
       this.fetchLoading = true
-      api('listVpnConnections', {
+      getAPI('listVpnConnections', {
         vpcid: this.resource.id,
         listAll: true,
         page: this.page,
@@ -650,7 +650,7 @@ export default {
     },
     fetchAclList () {
       this.fetchLoading = true
-      api('listNetworkACLLists', {
+      getAPI('listNetworkACLLists', {
         vpcid: this.resource.id,
         listAll: true,
         page: this.page,
@@ -673,7 +673,7 @@ export default {
         this.modals.gatewayLoading = false
         return
       }
-      api('listPhysicalNetworks', { zoneid: this.resource.zoneid }).then(json => {
+      getAPI('listPhysicalNetworks', { zoneid: this.resource.zoneid }).then(json => {
         this.physicalnetworks = json.listphysicalnetworksresponse.physicalnetwork
         if (this.modals.gateway === true) {
           this.form.physicalnetwork = this.physicalnetworks[0].id
@@ -686,7 +686,7 @@ export default {
     },
     fetchVpnCustomerGateways () {
       this.modals.vpnConnectionLoading = true
-      api('listVpnCustomerGateways', { listAll: true }).then(json => {
+      getAPI('listVpnCustomerGateways', { listAll: true }).then(json => {
         this.vpncustomergateways = json.listvpncustomergatewaysresponse.vpncustomergateway || []
         if (this.modals.vpnConnection === true) {
           this.form.vpncustomergateway = this.vpncustomergateways[0]?.id
@@ -759,7 +759,7 @@ export default {
           params.associatednetworkid = data.associatednetworkid
         }
 
-        api('createPrivateGateway', params).then(response => {
+        postAPI('createPrivateGateway', params).then(response => {
           this.$pollJob({
             jobId: response.createprivategatewayresponse.jobid,
             title: this.$t('message.success.add.private.gateway'),
@@ -804,7 +804,7 @@ export default {
           s2scustomergatewayid: values.vpncustomergateway,
           passive: values.passive ? values.passive : false
         }
-        api('createVpnConnection', params).then(response => {
+        postAPI('createVpnConnection', params).then(response => {
           this.$pollJob({
             jobId: response.createvpnconnectionresponse.jobid,
             title: this.$t('label.vpn.connection'),
@@ -843,7 +843,7 @@ export default {
       this.formRef.value.validate().then(() => {
         const values = toRaw(this.form)
 
-        api('createNetworkACLList', {
+        postAPI('createNetworkACLList', {
           name: values.name,
           description: values.description,
           vpcid: this.resource.id
@@ -879,7 +879,7 @@ export default {
     },
     handleCreateVpnGateway () {
       this.fetchLoading = true
-      api('createVpnGateway', {
+      postAPI('createVpnGateway', {
         vpcid: this.resource.id
       }).then(response => {
         this.$pollJob({
diff --git a/ui/src/views/network/VpcTiersTab.vue b/ui/src/views/network/VpcTiersTab.vue
index 8f1746ecea93..d0c2e5a74741 100644
--- a/ui/src/views/network/VpcTiersTab.vue
+++ b/ui/src/views/network/VpcTiersTab.vue
@@ -359,7 +359,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI, getAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import Status from '@/components/widgets/Status'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -491,7 +491,7 @@ export default {
       this.asNumberLoading = true
       params.zoneid = this.resource.zoneid
       params.isallocated = false
-      api('listASNumbers', params).then(json => {
+      getAPI('listASNumbers', params).then(json => {
         this.asNumbersZone = json.listasnumbersresponse.asnumber
         this.asNumberLoading = false
       })
@@ -530,7 +530,7 @@ export default {
       this.publicLBNetworkExists()
     },
     fetchMtuForZone () {
-      api('listZones', {
+      getAPI('listZones', {
         id: this.resource.zoneid
       }).then(json => {
         this.setMTU = json?.listzonesresponse?.zone?.[0]?.allowuserspecifyvrmtu || false
@@ -541,7 +541,7 @@ export default {
     fetchNetworkAclList () {
       this.fetchLoading = true
       this.modalLoading = true
-      api('listNetworkACLLists', { vpcid: this.resource.id }).then(json => {
+      getAPI('listNetworkACLLists', { vpcid: this.resource.id }).then(json => {
         this.networkAclList = json.listnetworkacllistsresponse.networkacllist || []
         this.handleNetworkAclChange(null)
       }).catch(error => {
@@ -553,7 +553,7 @@ export default {
     },
     getNetworkOffering (networkId) {
       return new Promise((resolve, reject) => {
-        api('listNetworkOfferings', {
+        getAPI('listNetworkOfferings', {
           id: networkId
         }).then(json => {
           var networkOffering = json.listnetworkofferingsresponse.networkoffering[0]
@@ -564,7 +564,7 @@ export default {
       })
     },
     updateDisplayCollapsible (offeringId, network) {
-      api('listNetworkOfferings', {
+      getAPI('listNetworkOfferings', {
         id: offeringId
       }).then(json => {
         var networkOffering = json.listnetworkofferingsresponse.networkoffering[0]
@@ -575,7 +575,7 @@ export default {
     },
     getVpcNetworkOffering () {
       return new Promise((resolve, reject) => {
-        api('listVPCOfferings', {
+        getAPI('listVPCOfferings', {
           id: this.resource.vpcofferingid
         }).then(json => {
           const vpcOffering = json?.listvpcofferingsresponse?.vpcoffering[0]
@@ -588,7 +588,7 @@ export default {
       })
     },
     publicLBNetworkExists () {
-      api('listNetworks', {
+      getAPI('listNetworks', {
         vpcid: this.resource.id,
         supportedservices: 'LB'
       }).then(async json => {
@@ -618,7 +618,7 @@ export default {
       if (!this.isNsxEnabled && !this.isOfferingRoutedMode) {
         params.supportedServices = 'SourceNat'
       }
-      api('listNetworkOfferings', params).then(json => {
+      getAPI('listNetworkOfferings', params).then(json => {
         this.networkOfferings = json.listnetworkofferingsresponse.networkoffering || []
         var filteredOfferings = []
         const vpcLbServiceIndex = this.resource.service.map(svc => { return svc.name }).indexOf('Lb')
@@ -655,7 +655,7 @@ export default {
     },
     fetchLoadBalancers (id) {
       this.fetchLoading = true
-      api('listLoadBalancers', {
+      getAPI('listLoadBalancers', {
         networkid: id,
         page: this.page,
         pagesize: this.pageSize,
@@ -669,7 +669,7 @@ export default {
     },
     fetchVMs (id) {
       this.fetchLoading = true
-      api('listVirtualMachines', {
+      getAPI('listVirtualMachines', {
         listAll: true,
         vpcid: this.resource.id,
         networkid: id,
@@ -764,7 +764,7 @@ export default {
           params.asnumber = values.asnumber
         }
 
-        api('createNetwork', params).then(() => {
+        postAPI('createNetwork', params).then(() => {
           this.$notification.success({
             message: this.$t('message.success.add.vpc.network')
           })
@@ -790,7 +790,7 @@ export default {
         const formRaw = toRaw(this.form)
         const values = this.handleRemoveFields(formRaw)
 
-        api('createLoadBalancer', {
+        postAPI('createLoadBalancer', {
           name: values.name,
           sourceipaddress: values.sourceIP,
           sourceport: values.sourcePort,
diff --git a/ui/src/views/network/VpnDetails.vue b/ui/src/views/network/VpnDetails.vue
index 206f776aa8cb..ece7d23d593a 100644
--- a/ui/src/views/network/VpnDetails.vue
+++ b/ui/src/views/network/VpnDetails.vue
@@ -80,7 +80,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 export default {
   props: {
@@ -114,7 +114,7 @@ export default {
   },
   methods: {
     fetchData () {
-      api('listRemoteAccessVpns', {
+      getAPI('listRemoteAccessVpns', {
         publicipid: this.resource.id,
         listAll: true
       }).then(response => {
@@ -130,7 +130,7 @@ export default {
       this.isSubmitted = true
       this.parentToggleLoading()
       this.enableVpn = false
-      api('createRemoteAccessVpn', {
+      postAPI('createRemoteAccessVpn', {
         publicipid: this.resource.id,
         domainid: this.resource.domainid,
         account: this.resource.account
@@ -177,7 +177,7 @@ export default {
       this.isSubmitted = true
       this.parentToggleLoading()
       this.disableVpn = false
-      api('deleteRemoteAccessVpn', {
+      postAPI('deleteRemoteAccessVpn', {
         publicipid: this.resource.id,
         domainid: this.resource.domainid
       }).then(response => {
diff --git a/ui/src/views/network/tungsten/FirewallPolicyTab.vue b/ui/src/views/network/tungsten/FirewallPolicyTab.vue
index 9be36fd72831..45b6396ead25 100644
--- a/ui/src/views/network/tungsten/FirewallPolicyTab.vue
+++ b/ui/src/views/network/tungsten/FirewallPolicyTab.vue
@@ -118,7 +118,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
@@ -193,7 +193,7 @@ export default {
       this.fetchLoading = true
       this.dataSource = []
       this.totalCount = 0
-      api('listTungstenFabricFirewallPolicy', {
+      getAPI('listTungstenFabricFirewallPolicy', {
         zoneid: this.zoneId,
         applicationpolicysetuuid: this.resource.uuid,
         page: this.page,
@@ -221,7 +221,7 @@ export default {
         params.name = values.name
         params.sequence = values.sequence
 
-        api('createTungstenFabricFirewallPolicy', params).then(json => {
+        postAPI('createTungstenFabricFirewallPolicy', params).then(json => {
           this.$pollJob({
             jobId: json.createtungstenfabricfirewallpolicyresponse.jobid,
             title: this.$t('label.add.tungsten.firewall.policy'),
@@ -263,7 +263,7 @@ export default {
       params.zoneid = this.zoneId
       params.firewallpolicyuuid = uuid
 
-      api('deleteTungstenFabricFirewallPolicy', params).then(json => {
+      postAPI('deleteTungstenFabricFirewallPolicy', params).then(json => {
         this.$pollJob({
           jobId: json.deletetungstenfabricfirewallpolicyresponse.jobid,
           title: this.$t('label.delete.tungsten.firewall.policy'),
diff --git a/ui/src/views/network/tungsten/FirewallRuleTab.vue b/ui/src/views/network/tungsten/FirewallRuleTab.vue
index c19cdda3c6fd..70102383b53b 100644
--- a/ui/src/views/network/tungsten/FirewallRuleTab.vue
+++ b/ui/src/views/network/tungsten/FirewallRuleTab.vue
@@ -318,7 +318,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
@@ -441,7 +441,7 @@ export default {
       this.fetchLoading = true
       this.dataSource = []
       this.totalCount = 0
-      api('listTungstenFabricFirewallRule', {
+      getAPI('listTungstenFabricFirewallRule', {
         zoneid: this.zoneId,
         firewallpolicyuuid: this.resource.uuid,
         page: this.page,
@@ -467,7 +467,7 @@ export default {
     fetchServiceGroup () {
       this.serviceGroup.loading = true
       this.serviceGroup.opts = []
-      api('listTungstenFabricServiceGroup', { zoneid: this.zoneId }).then(json => {
+      getAPI('listTungstenFabricServiceGroup', { zoneid: this.zoneId }).then(json => {
         this.serviceGroup.opts = json?.listtungstenfabricservicegroupresponse?.servicegroup || []
       }).finally(() => {
         this.serviceGroup.loading = false
@@ -476,7 +476,7 @@ export default {
     fetchTag () {
       this.srcTag.loading = true
       this.srcTag.opts = []
-      api('listTungstenFabricTag', { zoneid: this.zoneId }).then(json => {
+      getAPI('listTungstenFabricTag', { zoneid: this.zoneId }).then(json => {
         this.srcTag.opts = json?.listtungstenfabrictagresponse?.tag || []
       }).finally(() => {
         this.srcTag.loading = false
@@ -485,7 +485,7 @@ export default {
     fetchAddressGroup () {
       this.srcAddress.loading = true
       this.srcAddress.opts = []
-      api('listTungstenFabricAddressGroup', { zoneid: this.zoneId }).then(json => {
+      getAPI('listTungstenFabricAddressGroup', { zoneid: this.zoneId }).then(json => {
         this.srcAddress.opts = json?.listtungstenfabricaddressgroupresponse?.addressgroup || []
       }).finally(() => {
         this.srcAddress.loading = false
@@ -494,7 +494,7 @@ export default {
     fetchNetworks () {
       this.networks.loading = true
       this.networks.opts = []
-      api('listTungstenFabricNetwork', { zoneid: this.zoneId, listAll: true }).then(json => {
+      getAPI('listTungstenFabricNetwork', { zoneid: this.zoneId, listAll: true }).then(json => {
         this.networks.opts = json?.listtungstenfabricnetworkresponse?.network || []
       }).finally(() => {
         this.networks.loading = false
@@ -503,7 +503,7 @@ export default {
     fetchTagType () {
       this.tagType.loading = true
       this.tagType.opts = []
-      api('listTungstenFabricTagType', { zoneid: this.zoneId }).then(json => {
+      getAPI('listTungstenFabricTagType', { zoneid: this.zoneId }).then(json => {
         this.tagType.opts = json?.listtungstenfabrictagtyperesponse?.tagtype || []
       }).finally(() => {
         this.tagType.loading = false
@@ -538,7 +538,7 @@ export default {
         }
         params.tagtypeuuid = values.tagtypeuuid
 
-        api('createTungstenFabricFirewallRule', params).then(json => {
+        postAPI('createTungstenFabricFirewallRule', params).then(json => {
           this.$pollJob({
             jobId: json.createtungstenfabricfirewallruleresponse.jobid,
             title: this.$t('label.add.firewallrule'),
@@ -581,7 +581,7 @@ export default {
       params.zoneid = this.zoneId
       params.firewallruleuuid = uuid
 
-      api('deleteTungstenFabricFirewallRule', params).then(json => {
+      postAPI('deleteTungstenFabricFirewallRule', params).then(json => {
         this.$pollJob({
           jobId: json.deletetungstenfabricfirewallruleresponse.jobid,
           title: this.$t('label.delete.tungsten.firewall.policy'),
diff --git a/ui/src/views/network/tungsten/FirewallTagTab.vue b/ui/src/views/network/tungsten/FirewallTagTab.vue
index b1e08e9ae43b..6f42632c21b6 100644
--- a/ui/src/views/network/tungsten/FirewallTagTab.vue
+++ b/ui/src/views/network/tungsten/FirewallTagTab.vue
@@ -111,7 +111,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
@@ -184,7 +184,7 @@ export default {
       this.fetchLoading = true
       this.dataSource = []
       this.totalCount = 0
-      api('listTungstenFabricTag', {
+      getAPI('listTungstenFabricTag', {
         zoneid: this.zoneId,
         applicationpolicysetuuid: this.resource.uuid,
         page: this.page,
@@ -201,7 +201,7 @@ export default {
     fetchTag () {
       this.tagSrc.loading = true
       this.tagSrc.opts = []
-      api('listTungstenFabricTag', { zoneid: this.zoneId }).then(json => {
+      getAPI('listTungstenFabricTag', { zoneid: this.zoneId }).then(json => {
         this.tagSrc.opts = json?.listtungstenfabrictagresponse?.tag || []
       }).finally(() => {
         this.tagSrc.loading = true
@@ -224,7 +224,7 @@ export default {
         const tag = this.tagSrc.opts.filter(tag => tag.uuid === params.taguuid)
         const description = tag[0]?.name || values.taguuid
 
-        api('applyTungstenFabricTag', params).then(json => {
+        postAPI('applyTungstenFabricTag', params).then(json => {
           this.$pollJob({
             jobId: json.applytungstenfabrictagresponse.jobid,
             title: this.$t('label.apply.tungsten.tag'),
@@ -267,7 +267,7 @@ export default {
       params.applicationpolicysetuuid = this.resource.uuid
       params.taguuid = uuid
 
-      api('removeTungstenFabricTag', params).then(json => {
+      postAPI('removeTungstenFabricTag', params).then(json => {
         this.$pollJob({
           jobId: json.removetungstenfabrictagresponse.jobid,
           title: this.$t('label.delete.tungsten.firewall.policy'),
diff --git a/ui/src/views/network/tungsten/LogicalRouterTab.vue b/ui/src/views/network/tungsten/LogicalRouterTab.vue
index 5334d5be29b1..80d4aa50a479 100644
--- a/ui/src/views/network/tungsten/LogicalRouterTab.vue
+++ b/ui/src/views/network/tungsten/LogicalRouterTab.vue
@@ -79,7 +79,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
@@ -167,7 +167,7 @@ export default {
       this.dataSource = []
       this.fetchLoading = true
 
-      api('listTungstenFabricLogicalRouter', params).then(json => {
+      getAPI('listTungstenFabricLogicalRouter', params).then(json => {
         this.itemCount = json?.listtungstenfabriclogicalrouterresponse?.count || 0
         this.dataSource = json?.listtungstenfabriclogicalrouterresponse?.logicalrouter || []
       }).catch(error => {
@@ -178,7 +178,7 @@ export default {
       this.showAction = true
       this.logicalRouters.loading = true
       this.logicalRouters.opts = []
-      api('listTungstenFabricLogicalRouter', { zoneid: this.resource.zoneid }).then(json => {
+      getAPI('listTungstenFabricLogicalRouter', { zoneid: this.resource.zoneid }).then(json => {
         this.logicalRouters.opts = json?.listtungstenfabriclogicalrouterresponse?.logicalrouter || []
         this.form.logicalrouteruuid = this.logicalRouters.opts[0]?.uuid || null
       }).finally(() => {
@@ -207,7 +207,7 @@ export default {
         params.networkuuid = this.resource.id
         params.logicalrouteruuid = values.logicalrouteruuid
 
-        api('addTungstenFabricNetworkGatewayToLogicalRouter', params).then(json => {
+        postAPI('addTungstenFabricNetworkGatewayToLogicalRouter', params).then(json => {
           const jobId = json?.addtungstenfabricnetworkgatewaytologicalrouterresponse?.jobid
           this.$pollJob({
             jobId,
diff --git a/ui/src/views/network/tungsten/NetworkPolicyTab.vue b/ui/src/views/network/tungsten/NetworkPolicyTab.vue
index b1970d0a95ad..0afefcbf0090 100644
--- a/ui/src/views/network/tungsten/NetworkPolicyTab.vue
+++ b/ui/src/views/network/tungsten/NetworkPolicyTab.vue
@@ -113,7 +113,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -218,7 +218,7 @@ export default {
       this.dataSource = []
       this.fetchLoading = true
 
-      api('listTungstenFabricPolicy', params).then(json => {
+      getAPI('listTungstenFabricPolicy', params).then(json => {
         this.itemCount = json?.listtungstenfabricpolicyresponse?.count || 0
         this.dataSource = json?.listtungstenfabricpolicyresponse?.policy || []
       }).catch(error => {
@@ -230,7 +230,7 @@ export default {
       this.showAction = true
       this.networks.loading = true
       this.networks.opts = []
-      api('listTungstenFabricPolicy', { listall: true, zoneid: this.resource.zoneid }).then(json => {
+      getAPI('listTungstenFabricPolicy', { listall: true, zoneid: this.resource.zoneid }).then(json => {
         this.networks.opts = json?.listtungstenfabricpolicyresponse?.policy || []
         this.form.networkuuid = this.networks.opts[0]?.uuid || null
       }).finally(() => {
@@ -264,7 +264,7 @@ export default {
         const match = this.networks.opts.filter(network => network.uuid === values.policyuuid)
         const resourceName = match[0]?.name || values.policyuuid
 
-        api('applyTungstenFabricPolicy', params).then(json => {
+        postAPI('applyTungstenFabricPolicy', params).then(json => {
           const jobId = json?.applytungstenfabricpolicyresponse?.jobid
           this.$pollJob({
             jobId,
@@ -303,7 +303,7 @@ export default {
       params.networkuuid = this.resource.id
       params.policyuuid = record.uuid
 
-      api('removeTungstenFabricPolicy', params).then(json => {
+      postAPI('removeTungstenFabricPolicy', params).then(json => {
         const jobId = json?.removetungstenfabricpolicyresponse?.jobid
         this.$pollJob({
           jobId,
diff --git a/ui/src/views/network/tungsten/TungstenFabricPolicyRule.vue b/ui/src/views/network/tungsten/TungstenFabricPolicyRule.vue
index c84222448c0e..1f1a3babd7af 100644
--- a/ui/src/views/network/tungsten/TungstenFabricPolicyRule.vue
+++ b/ui/src/views/network/tungsten/TungstenFabricPolicyRule.vue
@@ -214,7 +214,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -360,7 +360,7 @@ export default {
 
       this.dataSource = []
       this.fetchLoading = true
-      api('listTungstenFabricPolicyRule', params).then(json => {
+      getAPI('listTungstenFabricPolicyRule', params).then(json => {
         this.dataSource = json?.listtungstenfabricpolicyruleresponse?.rule || []
         this.itemCount = json?.listtungstenfabricpolicyruleresponse?.count || 0
       }).catch(error => {
@@ -392,7 +392,7 @@ export default {
         params.destendport = values.destendport
 
         this.actionLoading = true
-        api('addTungstenFabricPolicyRule', params).then(json => {
+        postAPI('addTungstenFabricPolicyRule', params).then(json => {
           this.$pollJob({
             jobId: json.addtungstenfabricpolicyruleresponse.jobid,
             title: this.$t('label.add.rule'),
@@ -429,7 +429,7 @@ export default {
       params.ruleuuid = record.uuid
 
       this.deleteLoading = true
-      api('removeTungstenFabricPolicyRule', params).then(json => {
+      postAPI('removeTungstenFabricPolicyRule', params).then(json => {
         this.$pollJob({
           jobId: json.removetungstenfabricpolicyruleresponse.jobid,
           title: this.$t('label.delete.rule'),
diff --git a/ui/src/views/network/tungsten/TungstenFabricPolicyTag.vue b/ui/src/views/network/tungsten/TungstenFabricPolicyTag.vue
index 502279aa4357..11fd6634d67c 100644
--- a/ui/src/views/network/tungsten/TungstenFabricPolicyTag.vue
+++ b/ui/src/views/network/tungsten/TungstenFabricPolicyTag.vue
@@ -107,7 +107,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -207,7 +207,7 @@ export default {
       params.policyuuid = this.resource.uuid
 
       this.fetchLoading = true
-      api('listTungstenFabricTag', params).then(json => {
+      getAPI('listTungstenFabricTag', params).then(json => {
         this.dataSource = json?.listtungstenfabrictagresponse?.tag || []
         this.itemCount = json?.listtungstenfabrictagresponse?.count || 0
       }).catch(error => {
@@ -219,7 +219,7 @@ export default {
 
       this.tags.loading = true
       this.tags.opts = []
-      api('listTungstenFabricTag', { zoneid: this.zoneId }).then(json => {
+      getAPI('listTungstenFabricTag', { zoneid: this.zoneId }).then(json => {
         const listTags = json?.listtungstenfabrictagresponse?.tag || []
 
         this.tags.opts = listTags.filter(item => {
@@ -243,7 +243,7 @@ export default {
         const description = tag.length > 0 ? tag[0].name : values.taguuid
 
         this.actionLoading = true
-        api('applyTungstenFabricTag', params).then(json => {
+        postAPI('applyTungstenFabricTag', params).then(json => {
           this.$pollJob({
             jobId: json.applytungstenfabrictagresponse.jobid,
             title: this.$t('label.apply.tungsten.tag'),
@@ -281,7 +281,7 @@ export default {
       params.taguuid = record.uuid
 
       this.deleteLoading = true
-      api('removeTungstenFabricTag', params).then(json => {
+      postAPI('removeTungstenFabricTag', params).then(json => {
         this.$pollJob({
           jobId: json.removetungstenfabrictagresponse.jobid,
           title: this.$t('label.delete.rule'),
diff --git a/ui/src/views/network/tungsten/TungstenFabricTableView.vue b/ui/src/views/network/tungsten/TungstenFabricTableView.vue
index ea2c177bf1eb..ab36810f97d3 100644
--- a/ui/src/views/network/tungsten/TungstenFabricTableView.vue
+++ b/ui/src/views/network/tungsten/TungstenFabricTableView.vue
@@ -122,7 +122,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import TungstenNetworkAction from '@/views/network/tungsten/TungstenNetworkAction'
 import TungstenNetworkTable from '@/views/network/tungsten/TungstenNetworkTable'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -233,7 +233,7 @@ export default {
       this.dataSource = []
       this.fetchLoading = true
 
-      api(this.apiName, params).then(json => {
+      postAPI(this.apiName, params).then(json => {
         let responseName
         let objectName
         for (const key in json) {
@@ -274,7 +274,7 @@ export default {
           const fieldIndex = this.currentAction.fields.findIndex(item => item.name === field.name)
           this.currentAction.fields[fieldIndex].loading = true
 
-          api(field.api, params).then(json => {
+          postAPI(field.api, params).then(json => {
             let responseName
             let objectName
             for (const key in json) {
@@ -357,7 +357,7 @@ export default {
             }
           }
         }
-        api(this.currentAction.api, params).then(json => {
+        postAPI(this.currentAction.api, params).then(json => {
           const jsonResponseName = [this.currentAction.api, 'response'].join('').toLowerCase()
           const jobId = json[jsonResponseName].jobid
           if (!jobId) {
@@ -404,7 +404,7 @@ export default {
       }
 
       this.fetchLoading = true
-      api(this.currentAction.api, params).then(json => {
+      postAPI(this.currentAction.api, params).then(json => {
         const jsonResponseName = [this.currentAction.api, 'response'].join('').toLowerCase()
         const jobId = json[jsonResponseName].jobid
         const resourceName = record.name || record.uuid || record.id
diff --git a/ui/src/views/offering/AddComputeOffering.vue b/ui/src/views/offering/AddComputeOffering.vue
index 640779acdc38..6a203c14a7f8 100644
--- a/ui/src/views/offering/AddComputeOffering.vue
+++ b/ui/src/views/offering/AddComputeOffering.vue
@@ -623,7 +623,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import AddDiskOffering from '@/views/offering/AddDiskOffering'
 import { isAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
@@ -845,7 +845,7 @@ export default {
     },
     fetchDiskOfferings () {
       this.diskOfferingLoading = true
-      api('listDiskOfferings', {
+      getAPI('listDiskOfferings', {
         listall: true
       }).then(json => {
         this.diskOfferings = json.listdiskofferingsresponse.diskoffering || []
@@ -873,7 +873,7 @@ export default {
     },
     checkIfDomainAdminIsAllowedToInformTag () {
       const params = { id: store.getters.userInfo.accountid }
-      api('isAccountAllowedToCreateOfferingsWithTags', params).then(json => {
+      getAPI('isAccountAllowedToCreateOfferingsWithTags', params).then(json => {
         this.isDomainAdminAllowedToInformTags = json.isaccountallowedtocreateofferingswithtagsresponse.isallowed.isallowed
       })
     },
@@ -886,7 +886,7 @@ export default {
       params.showicon = true
       params.details = 'min'
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         const listDomains = json.listdomainsresponse.domain
         this.domains = this.domains.concat(listDomains)
       }).finally(() => {
@@ -897,7 +897,7 @@ export default {
       const params = {}
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZones = json.listzonesresponse.zone
         if (listZones) {
           this.zones = this.zones.concat(listZones)
@@ -909,7 +909,7 @@ export default {
     fetchStorageTagData () {
       this.storageTagLoading = true
       this.storageTags = []
-      api('listStorageTags').then(json => {
+      getAPI('listStorageTags').then(json => {
         const tags = json.liststoragetagsresponse.storagetag || []
         for (const tag of tags) {
           if (!this.storageTags.includes(tag.name)) {
@@ -922,7 +922,7 @@ export default {
     },
     fetchDeploymentPlannerData () {
       this.deploymentPlannerLoading = true
-      api('listDeploymentPlanners').then(json => {
+      getAPI('listDeploymentPlanners').then(json => {
         const planners = json.listdeploymentplannersresponse.deploymentPlanner
         this.deploymentPlanners = this.deploymentPlanners.concat(planners)
         this.deploymentPlanners.unshift({ name: '' })
@@ -939,7 +939,7 @@ export default {
       const zoneid = this.zones[zoneIndex].id
       if ('importVsphereStoragePolicies' in this.$store.getters.apis) {
         this.storagePolicies = []
-        api('listVsphereStoragePolicies', {
+        getAPI('listVsphereStoragePolicies', {
           zoneid: zoneid
         }).then(response => {
           this.storagePolicies = response.listvspherestoragepoliciesresponse.StoragePolicy || []
@@ -1139,7 +1139,7 @@ export default {
         if (values.storagepolicy) {
           params.storagepolicy = values.storagepolicy
         }
-        api('createServiceOffering', params).then(json => {
+        postAPI('createServiceOffering', params).then(json => {
           const message = this.isSystem
             ? `${this.$t('message.create.service.offering')}: `
             : `${this.$t('message.create.compute.offering')}: `
diff --git a/ui/src/views/offering/AddDiskOffering.vue b/ui/src/views/offering/AddDiskOffering.vue
index f4e4d49c3dcf..a553e324b5c7 100644
--- a/ui/src/views/offering/AddDiskOffering.vue
+++ b/ui/src/views/offering/AddDiskOffering.vue
@@ -311,7 +311,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { reactive, ref, toRaw } from 'vue'
 import { isAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
@@ -422,7 +422,7 @@ export default {
     },
     checkIfDomainAdminIsAllowedToInformTag () {
       const params = { id: store.getters.userInfo.accountid }
-      api('isAccountAllowedToCreateOfferingsWithTags', params).then(json => {
+      getAPI('isAccountAllowedToCreateOfferingsWithTags', params).then(json => {
         this.isDomainAdminAllowedToInformTags = json.isaccountallowedtocreateofferingswithtagsresponse.isallowed.isallowed
       })
     },
@@ -435,7 +435,7 @@ export default {
       params.showicon = true
       params.details = 'min'
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         const listDomains = json.listdomainsresponse.domain
         this.domains = this.domains.concat(listDomains)
       }).finally(() => {
@@ -446,7 +446,7 @@ export default {
       const params = {}
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZones = json.listzonesresponse.zone
         if (listZones) {
           this.zones = this.zones.concat(listZones)
@@ -458,7 +458,7 @@ export default {
     fetchStorageTagData () {
       const params = {}
       this.storageTagLoading = true
-      api('listStorageTags', params).then(json => {
+      getAPI('listStorageTags', params).then(json => {
         const tags = json.liststoragetagsresponse.storagetag || []
         for (const tag of tags) {
           if (!this.storageTags.includes(tag.name)) {
@@ -477,7 +477,7 @@ export default {
       const zoneid = this.zones[zoneIndex].id
       if ('importVsphereStoragePolicies' in this.$store.getters.apis) {
         this.storagePolicies = []
-        api('listVsphereStoragePolicies', {
+        getAPI('listVsphereStoragePolicies', {
           zoneid: zoneid
         }).then(response => {
           this.storagePolicies = response.listvspherestoragepoliciesresponse.StoragePolicy || []
@@ -570,7 +570,7 @@ export default {
         if (values.storagepolicy) {
           params.storagepolicy = values.storagepolicy
         }
-        api('createDiskOffering', params).then(json => {
+        postAPI('createDiskOffering', params).then(json => {
           this.$emit('publish-disk-offering-id', json?.creatediskofferingresponse?.diskoffering?.id)
           this.$message.success(`${this.$t('message.disk.offering.created')} ${values.name}`)
           this.$emit('refresh-data')
diff --git a/ui/src/views/offering/AddNetworkOffering.vue b/ui/src/views/offering/AddNetworkOffering.vue
index 55c3c39ebfcd..699e3ebd4dbc 100644
--- a/ui/src/views/offering/AddNetworkOffering.vue
+++ b/ui/src/views/offering/AddNetworkOffering.vue
@@ -565,7 +565,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
 import CheckBoxSelectPair from '@/components/CheckBoxSelectPair'
@@ -721,7 +721,7 @@ export default {
       params.showicon = true
       params.details = 'min'
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         const listDomains = json.listdomainsresponse.domain
         this.domains = this.domains.concat(listDomains)
       }).finally(() => {
@@ -731,7 +731,7 @@ export default {
     fetchIpv6NetworkOfferingConfiguration () {
       this.ipv6NetworkOfferingEnabled = false
       var params = { name: 'ipv6.offering.enabled' }
-      api('listConfigurations', params).then(json => {
+      getAPI('listConfigurations', params).then(json => {
         var value = json?.listconfigurationsresponse?.configuration?.[0].value || null
         this.ipv6NetworkOfferingEnabled = value === 'true'
       })
@@ -739,7 +739,7 @@ export default {
     fetchRoutedNetworkConfiguration () {
       this.routedNetworkEnabled = false
       var params = { name: 'routed.network.vpc.enabled' }
-      api('listConfigurations', params).then(json => {
+      getAPI('listConfigurations', params).then(json => {
         var value = json?.listconfigurationsresponse?.configuration?.[0].value || null
         this.routedNetworkEnabled = value === 'true'
         if (!this.routedNetworkEnabled) {
@@ -751,7 +751,7 @@ export default {
       const params = {}
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZones = json.listzonesresponse.zone
         this.zones = this.zones.concat(listZones)
       }).finally(() => {
@@ -786,7 +786,7 @@ export default {
     fetchSupportedServiceData () {
       this.supportedServiceLoading = true
       this.supportedServices = []
-      api('listSupportedNetworkServices').then(json => {
+      getAPI('listSupportedNetworkServices').then(json => {
         this.supportedServices = json.listsupportednetworkservicesresponse.networkservice
         for (var i in this.supportedServices) {
           var networkServiceObj = this.supportedServices[i]
@@ -853,7 +853,7 @@ export default {
       params.issystem = true
       params.systemvmtype = 'domainrouter'
       this.serviceOfferingLoading = true
-      api('listServiceOfferings', params).then(json => {
+      getAPI('listServiceOfferings', params).then(json => {
         this.serviceOfferings = json?.listserviceofferingsresponse?.serviceoffering || []
       }).finally(() => {
         this.serviceOfferingLoading = false
@@ -862,7 +862,7 @@ export default {
     fetchRegisteredServicePackageData () {
       this.registeredServicePackageLoading = true
       this.registeredServicePackages = []
-      api('listRegisteredServicePackages', {}).then(json => {
+      getAPI('listRegisteredServicePackages', {}).then(json => {
         var servicePackages = json.listregisteredservicepackage.registeredServicepackage
         if (servicePackages === undefined || servicePackages == null || !servicePackages) {
           servicePackages = json.listregisteredservicepackage
@@ -1238,7 +1238,7 @@ export default {
           params.enable = values.enable
         }
         params.traffictype = 'GUEST' // traffic type dropdown has been removed since it has only one option ('Guest'). Hardcode traffic type value here.
-        api('createNetworkOffering', params).then(json => {
+        postAPI('createNetworkOffering', params).then(json => {
           this.$message.success('Network offering created: ' + values.name)
           this.$emit('refresh-data')
           this.closeAction()
diff --git a/ui/src/views/offering/AddVpcOffering.vue b/ui/src/views/offering/AddVpcOffering.vue
index 99227d2de506..c8d09d5f7e8d 100644
--- a/ui/src/views/offering/AddVpcOffering.vue
+++ b/ui/src/views/offering/AddVpcOffering.vue
@@ -247,7 +247,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
 import CheckBoxSelectPair from '@/components/CheckBoxSelectPair'
@@ -360,7 +360,7 @@ export default {
     fetchIpv6NetworkOfferingConfiguration () {
       this.ipv6NetworkOfferingEnabled = false
       var params = { name: 'ipv6.offering.enabled' }
-      api('listConfigurations', params).then(json => {
+      getAPI('listConfigurations', params).then(json => {
         var value = json?.listconfigurationsresponse?.configuration?.[0].value || null
         this.ipv6NetworkOfferingEnabled = value === 'true'
       })
@@ -368,7 +368,7 @@ export default {
     fetchRoutedNetworkConfiguration () {
       this.routedNetworkEnabled = false
       var params = { name: 'routed.network.vpc.enabled' }
-      api('listConfigurations', params).then(json => {
+      getAPI('listConfigurations', params).then(json => {
         var value = json?.listconfigurationsresponse?.configuration?.[0].value || null
         this.routedNetworkEnabled = value === 'true'
         if (!this.routedNetworkEnabled) {
@@ -382,7 +382,7 @@ export default {
       params.showicon = true
       params.details = 'min'
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         const listDomains = json.listdomainsresponse.domain
         this.domains = this.domains.concat(listDomains)
       }).finally(() => {
@@ -393,7 +393,7 @@ export default {
       const params = {}
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZones = json.listzonesresponse.zone
         this.zones = this.zones.concat(listZones)
       }).finally(() => {
@@ -591,7 +591,7 @@ export default {
       params.issystem = true
       params.systemvmtype = 'domainrouter'
       this.serviceOfferingLoading = true
-      api('listServiceOfferings', params).then(json => {
+      getAPI('listServiceOfferings', params).then(json => {
         const listServiceOfferings = json.listserviceofferingsresponse.serviceoffering
         this.serviceOfferings = this.serviceOfferings.concat(listServiceOfferings)
       }).finally(() => {
@@ -690,7 +690,7 @@ export default {
         if (values.enable) {
           params.enable = values.enable
         }
-        api('createVPCOffering', params).then(json => {
+        postAPI('createVPCOffering', params).then(json => {
           this.$message.success(`${this.$t('message.create.vpc.offering')}: ` + values.name)
           this.$emit('refresh-data')
           this.closeAction()
diff --git a/ui/src/views/offering/ImportBackupOffering.vue b/ui/src/views/offering/ImportBackupOffering.vue
index 9b8e9d6b9e7d..b8ac7d8e8e65 100644
--- a/ui/src/views/offering/ImportBackupOffering.vue
+++ b/ui/src/views/offering/ImportBackupOffering.vue
@@ -95,7 +95,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -143,7 +143,7 @@ export default {
     },
     fetchZone () {
       this.zones.loading = true
-      api('listZones', { available: true, showicon: true }).then(json => {
+      getAPI('listZones', { available: true, showicon: true }).then(json => {
         this.zones.opts = json.listzonesresponse.zone || []
       }).catch(error => {
         this.$notifyError(error)
@@ -157,7 +157,7 @@ export default {
         return
       }
       this.externals.loading = true
-      api('listBackupProviderOfferings', { zoneid: zoneId }).then(json => {
+      getAPI('listBackupProviderOfferings', { zoneid: zoneId }).then(json => {
         this.externals.opts = json.listbackupproviderofferingsresponse.backupoffering || []
       }).catch(error => {
         this.$notifyError(error)
@@ -182,7 +182,7 @@ export default {
         params.allowuserdrivenbackups = values.allowuserdrivenbackups
         this.loading = true
         const title = this.$t('label.import.offering')
-        api('importBackupOffering', params).then(json => {
+        postAPI('importBackupOffering', params).then(json => {
           const jobId = json.importbackupofferingresponse.jobid
           if (jobId) {
             this.$pollJob({
diff --git a/ui/src/views/offering/UpdateOfferingAccess.vue b/ui/src/views/offering/UpdateOfferingAccess.vue
index 235a25f97040..42ded0175ee7 100644
--- a/ui/src/views/offering/UpdateOfferingAccess.vue
+++ b/ui/src/views/offering/UpdateOfferingAccess.vue
@@ -87,7 +87,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { isAdmin } from '@/role'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -180,7 +180,7 @@ export default {
       params.id = this.resource.id
       params.isrecursive = true
       var apiName = 'list' + this.offeringType + 's'
-      api(apiName, params).then(json => {
+      getAPI(apiName, params).then(json => {
         const offerings = json[apiName.toLowerCase() + 'response'][this.offeringType.toLowerCase()]
         this.formOffering = offerings[0]
       }).finally(() => {
@@ -195,7 +195,7 @@ export default {
       params.showicon = true
       params.details = 'min'
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         const listDomains = json.listdomainsresponse.domain
         this.domains = this.domains.concat(listDomains)
       }).finally(() => {
@@ -207,7 +207,7 @@ export default {
       const params = {}
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZones = json.listzonesresponse.zone
         this.zones = this.zones.concat(listZones)
       }).finally(() => {
@@ -290,7 +290,7 @@ export default {
         params.zoneid = zoneId
 
         this.loading = true
-        api('update' + this.offeringType, params).then(json => {
+        postAPI('update' + this.offeringType, params).then(json => {
           this.$emit('refresh-data')
           this.$notification.success({
             message: this.$t('label.action.update.offering.access'),
diff --git a/ui/src/views/plugins/ApiDocsPlugin.vue b/ui/src/views/plugins/ApiDocsPlugin.vue
index ba7f547572ba..2979b5bf7d46 100644
--- a/ui/src/views/plugins/ApiDocsPlugin.vue
+++ b/ui/src/views/plugins/ApiDocsPlugin.vue
@@ -154,7 +154,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 
 import ResourceLayout from '@/layouts/ResourceLayout'
 import TooltipButton from '@/components/widgets/TooltipButton'
@@ -201,7 +201,7 @@ export default {
     if (!('getUserKeys' in this.$store.getters.apis)) {
       return
     }
-    api('getUserKeys', { id: this.$store.getters.userInfo.id }).then(json => {
+    getAPI('getUserKeys', { id: this.$store.getters.userInfo.id }).then(json => {
       this.userkeys = json.getuserkeysresponse.userkeys
       if (this.userkeys && this.userkeys.secretkey) {
         this.showKeys = true
diff --git a/ui/src/views/plugins/CloudianPlugin.vue b/ui/src/views/plugins/CloudianPlugin.vue
index 29a51264a761..d74477b61431 100644
--- a/ui/src/views/plugins/CloudianPlugin.vue
+++ b/ui/src/views/plugins/CloudianPlugin.vue
@@ -30,7 +30,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'CloudianPlugin',
@@ -45,7 +45,7 @@ export default {
   methods: {
     doSso () {
       this.showError = false
-      api('cloudianSsoLogin').then(json => {
+      postAPI('cloudianSsoLogin').then(json => {
         const url = json.cloudianssologinresponse.cloudianssologin.url
         const cmcWindow = window.open(url, 'CMCWindow')
         cmcWindow.focus()
diff --git a/ui/src/views/plugins/quota/CreateQuotaTariff.vue b/ui/src/views/plugins/quota/CreateQuotaTariff.vue
index 942de8c69db1..18086aca2af0 100644
--- a/ui/src/views/plugins/quota/CreateQuotaTariff.vue
+++ b/ui/src/views/plugins/quota/CreateQuotaTariff.vue
@@ -122,7 +122,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { ref, reactive, toRaw } from 'vue'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import { getQuotaTypes } from '@/utils/quota'
@@ -190,7 +190,7 @@ export default {
         }
 
         this.loading = true
-        api('quotaTariffCreate', values).then(response => {
+        postAPI('quotaTariffCreate', values).then(response => {
           this.$message.success(this.$t('message.quota.tariff.create.success', { quotaTariff: values.name }))
           this.parentFetchData()
           this.closeModal()
@@ -211,7 +211,7 @@ export default {
       const values = this.handleRemoveFields(formRaw)
 
       this.loading = true
-      api('quotaValidateActivationRule', {}, 'POST', {
+      postAPI('quotaValidateActivationRule', {
         activationRule: values.activationRule || ' ',
         usageType: values?.usageType?.split('-')[0]
       }).then(response => {
diff --git a/ui/src/views/plugins/quota/EditQuotaTariff.vue b/ui/src/views/plugins/quota/EditQuotaTariff.vue
index c848c8813629..b456dc539fc5 100644
--- a/ui/src/views/plugins/quota/EditQuotaTariff.vue
+++ b/ui/src/views/plugins/quota/EditQuotaTariff.vue
@@ -86,7 +86,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { dayjs, parseDateToDatePicker, parseDayJsObject } from '@/utils/date'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -178,7 +178,7 @@ export default {
 
         this.loading = true
 
-        api('quotaTariffUpdate', {}, 'POST', params).then(json => {
+        postAPI('quotaTariffUpdate', params).then(json => {
           const tariffResponse = json.quotatariffupdateresponse.quotatariff || {}
           if (tariffResponse.id && this.$route.params.id) {
             this.$router.push(`/quotatariff/${tariffResponse.id}`)
@@ -215,7 +215,7 @@ export default {
       const values = this.handleRemoveFields(formRaw)
 
       this.loading = true
-      api('quotaValidateActivationRule', {}, 'POST', {
+      postAPI('quotaValidateActivationRule', {
         activationRule: values.activationRule || ' ',
         usageType: this.resource.usageType
       }).then(response => {
diff --git a/ui/src/views/plugins/quota/EditTariffValueWizard.vue b/ui/src/views/plugins/quota/EditTariffValueWizard.vue
index f04803b38a94..4387170aca43 100644
--- a/ui/src/views/plugins/quota/EditTariffValueWizard.vue
+++ b/ui/src/views/plugins/quota/EditTariffValueWizard.vue
@@ -58,7 +58,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import moment from 'moment'
 
 export default {
@@ -110,7 +110,7 @@ export default {
 
         this.loading = true
 
-        api('quotaTariffUpdate', {}, 'POST', params).then(json => {
+        postAPI('quotaTariffUpdate', params).then(json => {
           const tariffResponse = json.quotatariffupdateresponse.quotatariff || {}
           if (Object.keys(tariffResponse).length > 0) {
             const effectiveDate = moment(tariffResponse.effectiveDate).format(this.pattern)
diff --git a/ui/src/views/plugins/quota/EmailTemplateDetails.vue b/ui/src/views/plugins/quota/EmailTemplateDetails.vue
index 2317cf864441..0644fa55b69d 100644
--- a/ui/src/views/plugins/quota/EmailTemplateDetails.vue
+++ b/ui/src/views/plugins/quota/EmailTemplateDetails.vue
@@ -59,7 +59,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'EmailTemplateDetails',
@@ -82,7 +82,7 @@ export default {
       const params = {}
       params.templatetype = this.$route.params.id
 
-      api('quotaEmailTemplateList', params).then(json => {
+      postAPI('quotaEmailTemplateList', params).then(json => {
         const listTemplates = json.quotaemailtemplatelistresponse.quotaemailtemplate || []
         this.resource = listTemplates && listTemplates.length > 0 ? listTemplates[0] : {}
         this.preFillDataValues()
@@ -106,7 +106,7 @@ export default {
 
       this.loading = true
 
-      api('quotaEmailTemplateUpdate', params).then(json => {
+      postAPI('quotaEmailTemplateUpdate', params).then(json => {
         this.$message.success(this.$t('label.quota.email.edit') + ' - ' + this.resource.templatetype)
         this.$router.go(-1)
       }).catch(e => {
diff --git a/ui/src/views/plugins/quota/QuotaBalance.vue b/ui/src/views/plugins/quota/QuotaBalance.vue
index ab81615d8405..f1cf640f6aaa 100644
--- a/ui/src/views/plugins/quota/QuotaBalance.vue
+++ b/ui/src/views/plugins/quota/QuotaBalance.vue
@@ -39,7 +39,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import moment from 'moment'
 
 export default {
@@ -144,7 +144,7 @@ export default {
         params.domainid = this.resource.domainid
         params.account = this.account
 
-        api('quotaBalance', params).then(json => {
+        getAPI('quotaBalance', params).then(json => {
           const quotaBalance = json.quotabalanceresponse.balance || {}
           resolve(quotaBalance)
         }).catch(error => {
@@ -160,7 +160,7 @@ export default {
         params.startdate = moment(this.resource.startdate).format(this.pattern)
         params.enddate = moment(resource.startdate).format(this.pattern)
 
-        api('quotaBalance', params).then(json => {
+        getAPI('quotaBalance', params).then(json => {
           const quotaBalance = json.quotabalanceresponse.balance || {}
           resolve(quotaBalance)
         }).catch(error => {
diff --git a/ui/src/views/plugins/quota/QuotaSummaryResource.vue b/ui/src/views/plugins/quota/QuotaSummaryResource.vue
index 2ec2a6579adf..c6acf30676fc 100644
--- a/ui/src/views/plugins/quota/QuotaSummaryResource.vue
+++ b/ui/src/views/plugins/quota/QuotaSummaryResource.vue
@@ -25,7 +25,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import moment from 'moment'
 
 import ResourceView from '@/components/view/ResourceView'
@@ -76,7 +76,7 @@ export default {
       }
       this.loading = true
 
-      api('quotaBalance', params).then(json => {
+      getAPI('quotaBalance', params).then(json => {
         const quotaBalance = json.quotabalanceresponse.balance || {}
         if (Object.keys(quotaBalance).length > 0) {
           quotaBalance.currency = `${quotaBalance.currency} ${quotaBalance.startquota}`
diff --git a/ui/src/views/plugins/quota/QuotaUsage.vue b/ui/src/views/plugins/quota/QuotaUsage.vue
index 04a5f4f4a55b..6c55a728bd1c 100644
--- a/ui/src/views/plugins/quota/QuotaUsage.vue
+++ b/ui/src/views/plugins/quota/QuotaUsage.vue
@@ -36,7 +36,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import moment from 'moment'
 
 export default {
@@ -129,7 +129,7 @@ export default {
         params.domainid = this.resource.domainid
         params.account = this.account
 
-        api('quotaBalance', params).then(json => {
+        getAPI('quotaBalance', params).then(json => {
           const quotaBalance = json.quotabalanceresponse.balance || {}
           resolve(quotaBalance)
         }).catch(error => {
@@ -145,7 +145,7 @@ export default {
         params.startdate = moment(this.resource.startdate).format(this.pattern)
         params.enddate = moment(resource.startdate).format(this.pattern)
 
-        api('quotaStatement', params).then(json => {
+        getAPI('quotaStatement', params).then(json => {
           const quotaStatement = json.quotastatementresponse.statement || {}
           resolve(quotaStatement)
         }).catch(error => {
diff --git a/ui/src/views/project/AccountsTab.vue b/ui/src/views/project/AccountsTab.vue
index 8c7282b988bd..07256870541c 100644
--- a/ui/src/views/project/AccountsTab.vue
+++ b/ui/src/views/project/AccountsTab.vue
@@ -87,7 +87,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
 export default {
@@ -212,7 +212,7 @@ export default {
     },
     fetchUsers () {
       this.loading.user = true
-      api('listUsers', { listall: true }).then(response => {
+      getAPI('listUsers', { listall: true }).then(response => {
         this.users = response.listusersresponse.user || []
       }).catch(error => {
         this.$notifyError(error)
@@ -222,7 +222,7 @@ export default {
     },
     fetchProjectRoles () {
       this.loading.roles = true
-      api('listProjectRoles', { projectId: this.resource.id }).then(response => {
+      getAPI('listProjectRoles', { projectId: this.resource.id }).then(response => {
         this.projectRoles = response.listprojectrolesresponse.projectrole || []
       }).catch(error => {
         this.$notifyError(error)
@@ -232,7 +232,7 @@ export default {
     },
     fetchProjectAccounts (params) {
       this.loading.projectAccount = true
-      api('listProjectAccounts', params).then(json => {
+      getAPI('listProjectAccounts', params).then(json => {
         const listProjectAccount = json.listprojectaccountsresponse.projectaccount
         const itemCount = json.listprojectaccountsresponse.count
         if (!listProjectAccount || listProjectAccount.length === 0) {
@@ -297,7 +297,7 @@ export default {
       this.updateProject(record, params, title, loading)
     },
     updateProject (record, params, title, loading) {
-      api('updateProject', params).then(json => {
+      postAPI('updateProject', params).then(json => {
         const hasJobId = this.checkForAddAsyncJob(json, title, record.account)
         if (hasJobId) {
           this.fetchData()
@@ -337,7 +337,7 @@ export default {
       }
     },
     deleteOperation (apiName, params, record, title, loading) {
-      api(apiName, params).then(json => {
+      postAPI(apiName, params).then(json => {
         const hasJobId = this.checkForAddAsyncJob(json, title, record.account)
         if (hasJobId) {
           this.fetchData()
diff --git a/ui/src/views/project/AddAccountOrUserToProject.vue b/ui/src/views/project/AddAccountOrUserToProject.vue
index bb5fb0884c62..2e83dab3deb7 100644
--- a/ui/src/views/project/AddAccountOrUserToProject.vue
+++ b/ui/src/views/project/AddAccountOrUserToProject.vue
@@ -188,7 +188,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -257,7 +257,7 @@ export default {
       if (keyword) {
         params.keyword = keyword
       }
-      api('listUsers', params).then(response => {
+      getAPI('listUsers', params).then(response => {
         this.users = this.parseUsers(response?.listusersresponse?.user)
       }).catch(error => {
         this.$notifyError(error)
@@ -286,7 +286,7 @@ export default {
       if (keyword) {
         params.keyword = keyword
       }
-      api('listAccounts', params).then(response => {
+      getAPI('listAccounts', params).then(response => {
         this.accounts = this.parseAccounts(response?.listaccountsresponse?.account)
       }).catch(error => {
         this.$notifyError(error)
@@ -309,7 +309,7 @@ export default {
     },
     fetchProjectRoles () {
       this.load.projectRoles = true
-      api('listProjectRoles', {
+      getAPI('listProjectRoles', {
         projectid: this.resource.id
       }).then(response => {
         this.projectRoles = response.listprojectrolesresponse.projectrole || []
@@ -338,7 +338,7 @@ export default {
           }
           params[key] = input
         }
-        api('addAccountToProject', params).then(response => {
+        postAPI('addAccountToProject', params).then(response => {
           this.$pollJob({
             jobId: response.addaccounttoprojectresponse.jobid,
             successMessage: `Successfully added account ${params.account} to project`,
@@ -373,7 +373,7 @@ export default {
           }
           params[key] = input
         }
-        api('addUserToProject', params).then(response => {
+        postAPI('addUserToProject', params).then(response => {
           this.$pollJob({
             jobId: response.addusertoprojectresponse.jobid,
             successMessage: `Successfully added user ${params.username} to project`,
diff --git a/ui/src/views/project/InvitationTokenTemplate.vue b/ui/src/views/project/InvitationTokenTemplate.vue
index eea3b16a5fa9..7d82842fd269 100644
--- a/ui/src/views/project/InvitationTokenTemplate.vue
+++ b/ui/src/views/project/InvitationTokenTemplate.vue
@@ -49,7 +49,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 
 export default {
   name: 'InvitationTokenTemplate',
@@ -82,7 +82,7 @@ export default {
 
         this.loading = true
 
-        api('updateProjectInvitation', values).then(json => {
+        postAPI('updateProjectInvitation', values).then(json => {
           this.checkForAddAsyncJob(json, title, description)
           this.$emit('close-action')
         }).catch(error => {
diff --git a/ui/src/views/project/InvitationsTemplate.vue b/ui/src/views/project/InvitationsTemplate.vue
index 88159fcde9c8..1f4075027aaf 100644
--- a/ui/src/views/project/InvitationsTemplate.vue
+++ b/ui/src/views/project/InvitationsTemplate.vue
@@ -81,7 +81,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import Status from '@/components/widgets/Status'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
@@ -186,7 +186,7 @@ export default {
       this.dataSource = []
       this.itemCount = 0
 
-      api('listProjectInvitations', params).then(json => {
+      getAPI('listProjectInvitations', params).then(json => {
         const listProjectInvitations = json.listprojectinvitationsresponse.projectinvitation
         const itemCount = json.listprojectinvitationsresponse.count
 
@@ -247,7 +247,7 @@ export default {
       params.domainid = record.domainid
       params.accept = state
 
-      api('updateProjectInvitation', params).then(json => {
+      postAPI('updateProjectInvitation', params).then(json => {
         this.$pollJob({
           jobId: json.updateprojectinvitationresponse.jobid,
           title,
diff --git a/ui/src/views/project/iam/ProjectRolePermissionTab.vue b/ui/src/views/project/iam/ProjectRolePermissionTab.vue
index dd628d780e6f..fdb40e4bc934 100644
--- a/ui/src/views/project/iam/ProjectRolePermissionTab.vue
+++ b/ui/src/views/project/iam/ProjectRolePermissionTab.vue
@@ -97,7 +97,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import draggable from 'vuedraggable'
 import PermissionEditable from '@/views/iam/PermissionEditable'
 import RuleDelete from '@/views/iam/RuleDelete'
@@ -164,7 +164,7 @@ export default {
     },
     fetchData (callback = null) {
       if (!this.resource.id) return
-      api('listProjectRolePermissions', {
+      getAPI('listProjectRolePermissions', {
         projectid: this.resource.id,
         projectroleid: this.role.id
       }).then(response => {
@@ -178,7 +178,7 @@ export default {
       })
     },
     changeOrder () {
-      api('updateProjectRolePermission', {}, 'POST', {
+      postAPI('updateProjectRolePermission', {
         projectid: this.resource.id,
         projectroleid: this.role.id,
         ruleorder: this.rules.map(rule => rule.id)
@@ -190,7 +190,7 @@ export default {
     },
     onRuleDelete (key) {
       this.updateTable = true
-      api('deleteProjectRolePermission', {
+      postAPI('deleteProjectRolePermission', {
         id: key,
         projectid: this.resource.id
       }).catch(error => {
@@ -203,7 +203,7 @@ export default {
       this.newRulePermission = value
       if (!record) return
       this.updateTable = true
-      api('updateProjectRolePermission', {
+      postAPI('updateProjectRolePermission', {
         projectid: this.resource.id,
         projectroleid: this.role.id,
         projectrolepermissionid: record.id,
@@ -223,7 +223,7 @@ export default {
         return
       }
       this.updateTable = true
-      api('createProjectRolePermission', {
+      postAPI('createProjectRolePermission', {
         rule: this.newRule,
         permission: this.newRulePermission,
         description: this.newRuleDescription,
diff --git a/ui/src/views/project/iam/ProjectRoleTab.vue b/ui/src/views/project/iam/ProjectRoleTab.vue
index a0768db3164b..7cfc9fa2a184 100644
--- a/ui/src/views/project/iam/ProjectRoleTab.vue
+++ b/ui/src/views/project/iam/ProjectRoleTab.vue
@@ -120,7 +120,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import ProjectRolePermissionTab from '@/views/project/iam/ProjectRolePermissionTab'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
@@ -192,7 +192,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('listProjectRoles', { projectid: this.resource.id }).then(json => {
+      getAPI('listProjectRoles', { projectid: this.resource.id }).then(json => {
         const projectRoles = json.listprojectrolesresponse.projectrole
         if (!projectRoles || projectRoles.length === 0) {
           this.dataSource = []
@@ -232,7 +232,7 @@ export default {
           }
           params[key] = input
         }
-        api('updateProjectRole', params).then(response => {
+        postAPI('updateProjectRole', params).then(response => {
           this.$notification.success({
             message: this.$t('label.update.project.role'),
             description: this.$t('label.update.project.role')
@@ -271,7 +271,7 @@ export default {
           }
           params[key] = input
         }
-        api('createProjectRole', params).then(response => {
+        postAPI('createProjectRole', params).then(response => {
           this.$notification.success({
             message: this.$t('label.create.project.role'),
             description: this.$t('label.create.project.role')
@@ -289,7 +289,7 @@ export default {
     },
     deleteProjectRole (role) {
       this.loading = true
-      api('deleteProjectRole', {
+      postAPI('deleteProjectRole', {
         projectid: this.resource.id,
         id: role.id
       }).then(response => {
diff --git a/ui/src/views/setting/ConfigurationTab.vue b/ui/src/views/setting/ConfigurationTab.vue
index 11c0b0472449..75905cbd1748 100644
--- a/ui/src/views/setting/ConfigurationTab.vue
+++ b/ui/src/views/setting/ConfigurationTab.vue
@@ -86,7 +86,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { mixin, mixinDevice } from '@/utils/mixin.js'
 import Breadcrumb from '@/components/widgets/Breadcrumb'
 import OsLogo from '@/components/widgets/OsLogo'
@@ -176,7 +176,7 @@ export default {
       const params = {
         pagesize: -1
       }
-      api('listConfigurationGroups', params).then(response => {
+      getAPI('listConfigurationGroups', params).then(response => {
         this.groups = response.listconfigurationgroupsresponse.configurationgroup
       }).catch(error => {
         console.error(error)
@@ -206,7 +206,7 @@ export default {
         params.keyword = this.filter
       }
 
-      api('listConfigurations', params).then(response => {
+      getAPI('listConfigurations', params).then(response => {
         this.config = []
         let config = response.listconfigurationsresponse.configuration || []
         this.count = response.listconfigurationsresponse.count || 0
diff --git a/ui/src/views/setting/ConfigurationValue.vue b/ui/src/views/setting/ConfigurationValue.vue
index b4a44fdcd20f..e438f0eb8315 100644
--- a/ui/src/views/setting/ConfigurationValue.vue
+++ b/ui/src/views/setting/ConfigurationValue.vue
@@ -193,7 +193,7 @@
   </a-list>
 </template>
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 
 export default {
@@ -280,7 +280,7 @@ export default {
         name: configrecord.name,
         value: newValue
       }
-      api('updateConfiguration', params).then(json => {
+      postAPI('updateConfiguration', params).then(json => {
         this.editableValue = this.getEditableValue(json.updateconfigurationresponse.configuration)
         this.actualValue = this.editableValue
         this.$emit('change-config', { value: newValue })
@@ -315,7 +315,7 @@ export default {
         [this.scopeKey]: this.$route.params?.id,
         name: configrecord.name
       }
-      api('resetConfiguration', params).then(json => {
+      postAPI('resetConfiguration', params).then(json => {
         this.editableValue = this.getEditableValue(json.resetconfigurationresponse.configuration)
         this.actualValue = this.editableValue
         var newValue = this.editableValue
diff --git a/ui/src/views/storage/AttachVolume.vue b/ui/src/views/storage/AttachVolume.vue
index e0aa59a0be60..902dc628942e 100644
--- a/ui/src/views/storage/AttachVolume.vue
+++ b/ui/src/views/storage/AttachVolume.vue
@@ -76,7 +76,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 export default {
   name: 'AttachVolume',
@@ -127,7 +127,7 @@ export default {
       var vmStates = ['Running', 'Stopped']
       vmStates.forEach((state) => {
         params.state = state
-        api('listVirtualMachines', params).then(response => {
+        getAPI('listVirtualMachines', params).then(response => {
           this.virtualmachines = this.virtualmachines.concat(response.listvirtualmachinesresponse.virtualmachine || [])
         }).catch(error => {
           this.$notifyError(error)
@@ -146,7 +146,7 @@ export default {
         const values = toRaw(this.form)
 
         this.loading = true
-        api('attachVolume', {
+        postAPI('attachVolume', {
           id: this.resource.id,
           virtualmachineid: values.virtualmachineid,
           deviceid: values.deviceid
diff --git a/ui/src/views/storage/ChangeOfferingForVolume.vue b/ui/src/views/storage/ChangeOfferingForVolume.vue
index dedc2e8dc041..66a3cf1442e4 100644
--- a/ui/src/views/storage/ChangeOfferingForVolume.vue
+++ b/ui/src/views/storage/ChangeOfferingForVolume.vue
@@ -110,7 +110,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -176,7 +176,7 @@ export default {
       })
     },
     fetchDiskOfferings () {
-      api('listDiskOfferings', {
+      getAPI('listDiskOfferings', {
         volumeid: this.resource.id,
         listall: true
       }).then(response => {
@@ -214,7 +214,7 @@ export default {
         if (values.maxiops) {
           params.maxiops = values.maxiops
         }
-        api('changeOfferingForVolume', params).then(response => {
+        postAPI('changeOfferingForVolume', params).then(response => {
           this.$pollJob({
             jobId: response.changeofferingforvolumeresponse.jobid,
             successMessage: this.$t('message.change.offering.for.volume'),
diff --git a/ui/src/views/storage/ChangeSharedFSDiskOffering.vue b/ui/src/views/storage/ChangeSharedFSDiskOffering.vue
index 2ca6ddf26054..45fb63a715fd 100644
--- a/ui/src/views/storage/ChangeSharedFSDiskOffering.vue
+++ b/ui/src/views/storage/ChangeSharedFSDiskOffering.vue
@@ -87,7 +87,7 @@
 <script>
 
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -169,7 +169,7 @@ export default {
       } else {
         params.account = this.owner.account
       }
-      api('listDiskOfferings', params).then(json => {
+      getAPI('listDiskOfferings', params).then(json => {
         this.diskofferings = json.listdiskofferingsresponse.diskoffering || []
         this.form.diskofferingid = this.diskofferings[0].id || ''
         this.customDiskOffering = this.diskofferings[0].iscustomized || false
@@ -201,7 +201,7 @@ export default {
           maxops: values.maxiops
         }
         this.loading = true
-        api('changeSharedFileSystemDiskOffering', data).then(response => {
+        postAPI('changeSharedFileSystemDiskOffering', data).then(response => {
           this.$pollJob({
             jobId: response.changesharedfilesystemdiskofferingresponse.jobid,
             title: this.$t('label.change.disk.offering'),
diff --git a/ui/src/views/storage/ChangeSharedFSServiceOffering.vue b/ui/src/views/storage/ChangeSharedFSServiceOffering.vue
index 56b8c255f0cc..22913881efdd 100644
--- a/ui/src/views/storage/ChangeSharedFSServiceOffering.vue
+++ b/ui/src/views/storage/ChangeSharedFSServiceOffering.vue
@@ -65,7 +65,7 @@
 <script>
 
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -121,7 +121,7 @@ export default {
       this.fetchServiceOfferings()
     },
     fetchCapabilities (id) {
-      api('listCapabilities').then(json => {
+      getAPI('listCapabilities').then(json => {
         this.capability = json.listcapabilitiesresponse.capability || []
         this.minCpu = this.capability.sharedfsvmmincpucount
         this.minMemory = this.capability.sharedfsvmminramsize
@@ -140,7 +140,7 @@ export default {
       } else {
         params.account = this.owner.account
       }
-      api('listServiceOfferings', params).then(json => {
+      getAPI('listServiceOfferings', params).then(json => {
         var items = json.listserviceofferingsresponse.serviceoffering || []
         if (items != null) {
           for (var i = 0; i < items.length; i++) {
@@ -169,7 +169,7 @@ export default {
           serviceofferingid: values.serviceofferingid
         }
         this.loading = true
-        api('changeSharedFileSystemServiceOffering', data).then(response => {
+        postAPI('changeSharedFileSystemServiceOffering', data).then(response => {
           this.$pollJob({
             jobId: response.changesharedfilesystemserviceofferingresponse.jobid,
             title: this.$t('label.change.service.offering'),
diff --git a/ui/src/views/storage/CreateBucket.vue b/ui/src/views/storage/CreateBucket.vue
index 397257ae81de..1e420eb0aa07 100644
--- a/ui/src/views/storage/CreateBucket.vue
+++ b/ui/src/views/storage/CreateBucket.vue
@@ -91,7 +91,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 
@@ -134,7 +134,7 @@ export default {
     },
     listObjectStores () {
       this.loading = true
-      api('listObjectStoragePools').then(json => {
+      getAPI('listObjectStoragePools').then(json => {
         this.objectstores = json.listobjectstoragepoolsresponse.objectstore || []
         if (this.objectstores.length > 0) {
           this.form.objectstore = this.objectstores[0].id
@@ -163,7 +163,7 @@ export default {
           policy: values.policy
         }
         this.loading = true
-        api('createBucket', data).then(response => {
+        postAPI('createBucket', data).then(response => {
           this.$pollJob({
             jobId: response.createbucketresponse.jobid,
             title: this.$t('label.create.bucket'),
diff --git a/ui/src/views/storage/CreateSharedFS.vue b/ui/src/views/storage/CreateSharedFS.vue
index fc9f43c704e5..4e8c56e38ee2 100644
--- a/ui/src/views/storage/CreateSharedFS.vue
+++ b/ui/src/views/storage/CreateSharedFS.vue
@@ -181,7 +181,7 @@
 <script>
 
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import OwnershipSelection from '@/views/compute/wizard/OwnershipSelection.vue'
@@ -298,7 +298,7 @@ export default {
     fetchZones () {
       this.zoneLoading = true
       const params = { showicon: true }
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         var listZones = json.listzonesresponse.zone
         if (listZones) {
           this.zones = []
@@ -332,7 +332,7 @@ export default {
       } else {
         params.account = this.owner.account
       }
-      api('listServiceOfferings', params).then(json => {
+      getAPI('listServiceOfferings', params).then(json => {
         var items = json.listserviceofferingsresponse.serviceoffering || []
         if (items != null) {
           for (var i = 0; i < items.length; i++) {
@@ -360,7 +360,7 @@ export default {
       } else {
         params.account = this.owner.account
       }
-      api('listDiskOfferings', params).then(json => {
+      getAPI('listDiskOfferings', params).then(json => {
         this.diskofferings = json.listdiskofferingsresponse.diskoffering || []
         this.form.diskofferingid = this.diskofferings[0].id || ''
         this.customDiskOffering = this.diskofferings[0].iscustomized || false
@@ -382,7 +382,7 @@ export default {
       } else {
         params.account = this.owner.account
       }
-      api('listNetworks', params).then(json => {
+      getAPI('listNetworks', params).then(json => {
         this.networks = json.listnetworksresponse.network || []
         this.form.networkid = this.networks[0].id || ''
       }).finally(() => {
@@ -423,7 +423,7 @@ export default {
           data.account = this.owner.account
         }
         this.loading = true
-        api('createSharedFileSystem', data).then(response => {
+        postAPI('createSharedFileSystem', data).then(response => {
           this.$pollJob({
             jobId: response.createsharedfilesystemresponse.jobid,
             title: this.$t('label.create.sharedfs'),
diff --git a/ui/src/views/storage/CreateSnapshotFromVMSnapshot.vue b/ui/src/views/storage/CreateSnapshotFromVMSnapshot.vue
index 409e93138052..4f1c355a2915 100644
--- a/ui/src/views/storage/CreateSnapshotFromVMSnapshot.vue
+++ b/ui/src/views/storage/CreateSnapshotFromVMSnapshot.vue
@@ -61,7 +61,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 export default {
   name: 'CreateSnapshotFromVMSnapshot',
@@ -92,7 +92,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('listVolumes', {
+      getAPI('listVolumes', {
         virtualmachineid: this.resource.virtualmachineid,
         listall: true
       }).then(json => {
@@ -107,7 +107,7 @@ export default {
       this.formRef.value.validate().then(() => {
         const values = toRaw(this.form)
         this.loading = true
-        api('createSnapshotFromVMSnapshot', {
+        postAPI('createSnapshotFromVMSnapshot', {
           name: values.name,
           volumeid: values.volumeid,
           vmsnapshotid: this.resource.id
diff --git a/ui/src/views/storage/CreateTemplate.vue b/ui/src/views/storage/CreateTemplate.vue
index 65941d39a9d9..409e25099e19 100644
--- a/ui/src/views/storage/CreateTemplate.vue
+++ b/ui/src/views/storage/CreateTemplate.vue
@@ -176,7 +176,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -244,7 +244,7 @@ export default {
       this.osTypes.opts = []
       this.osTypes.loading = true
 
-      api('listOsTypes').then(json => {
+      getAPI('listOsTypes').then(json => {
         const listOsTypes = json.listostypesresponse.ostype
         this.osTypes.opts = listOsTypes
         this.defaultOsType = this.osTypes.opts[1].description
@@ -261,7 +261,7 @@ export default {
       } else {
         params.id = id
       }
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         this.zones = json.listzonesresponse.zone || []
         this.form.zoneid = this.zones[0].id || ''
       }).finally(() => {
@@ -275,7 +275,7 @@ export default {
         showunique: false,
         id: this.resource.id
       }
-      api('listSnapshots', params).then(json => {
+      getAPI('listSnapshots', params).then(json => {
         const snapshots = json.listsnapshotsresponse.snapshot || []
         for (const snapshot of snapshots) {
           if (!this.snapshotZoneIds.includes(snapshot.zoneid)) {
@@ -294,7 +294,7 @@ export default {
       params.showicon = true
       params.details = 'min'
       this.domainLoading = true
-      api('listDomains', params).then(json => {
+      getAPI('listDomains', params).then(json => {
         this.domains = json.listdomainsresponse.domain
       }).finally(() => {
         this.domainLoading = false
@@ -311,7 +311,7 @@ export default {
     },
     fetchAccounts () {
       return new Promise((resolve, reject) => {
-        api('listAccounts', {
+        getAPI('listAccounts', {
           domainid: this.domainid
         }).then(response => {
           this.accounts = response?.listaccountsresponse?.account || []
@@ -348,7 +348,7 @@ export default {
           params[key] = input
         }
         this.loading = true
-        api('createTemplate', params).then(response => {
+        postAPI('createTemplate', params).then(response => {
           this.$pollJob({
             jobId: response.createtemplateresponse.jobid,
             title: this.$t('message.success.create.template'),
diff --git a/ui/src/views/storage/CreateVolume.vue b/ui/src/views/storage/CreateVolume.vue
index a0c04e7c0abc..26352360c489 100644
--- a/ui/src/views/storage/CreateVolume.vue
+++ b/ui/src/views/storage/CreateVolume.vue
@@ -168,7 +168,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -293,7 +293,7 @@ export default {
       } else if (id !== null) {
         params.id = id
       }
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         this.zones = json.listzonesresponse.zone || []
         this.form.zoneid = this.zones[0].id || ''
         this.fetchDiskOfferings(this.form.zoneid)
@@ -311,7 +311,7 @@ export default {
         showunique: false,
         id: this.resource.id
       }
-      api('listSnapshots', params).then(json => {
+      getAPI('listSnapshots', params).then(json => {
         const snapshots = json.listsnapshotsresponse.snapshot || []
         for (const snapshot of snapshots) {
           if (!this.snapshotZoneIds.includes(snapshot.zoneid)) {
@@ -339,7 +339,7 @@ export default {
       } else {
         params.account = this.owner.account
       }
-      api('listDiskOfferings', params).then(json => {
+      getAPI('listDiskOfferings', params).then(json => {
         this.offerings = json.listdiskofferingsresponse.diskoffering || []
         if (this.createVolumeFromVM) {
           this.offerings = this.offerings.filter(x => x.suitableforvirtualmachine)
@@ -369,7 +369,7 @@ export default {
       var vmStates = ['Running', 'Stopped']
       vmStates.forEach((state) => {
         params.state = state
-        api('listVirtualMachines', params).then(response => {
+        getAPI('listVirtualMachines', params).then(response => {
           this.virtualmachines = this.virtualmachines.concat(response.listvirtualmachinesresponse.virtualmachine || [])
         }).catch(error => {
           this.$notifyError(error)
@@ -406,7 +406,7 @@ export default {
           values.account = this.owner.account
         }
         this.loading = true
-        api('createVolume', values).then(response => {
+        postAPI('createVolume', values).then(response => {
           this.$pollJob({
             jobId: response.createvolumeresponse.jobid,
             title: this.$t('message.success.create.volume'),
@@ -423,7 +423,7 @@ export default {
                   params.virtualmachineid = this.vmidtoattach
                   params.deviceid = values.deviceid
                 }
-                api('attachVolume', params).then(response => {
+                postAPI('attachVolume', params).then(response => {
                   this.$pollJob({
                     jobId: response.attachvolumeresponse.jobid,
                     title: this.$t('message.success.attach.volume'),
diff --git a/ui/src/views/storage/FormSchedule.vue b/ui/src/views/storage/FormSchedule.vue
index ffd89088c4b0..ea8559016b09 100644
--- a/ui/src/views/storage/FormSchedule.vue
+++ b/ui/src/views/storage/FormSchedule.vue
@@ -223,7 +223,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import { timeZone } from '@/utils/timezone'
@@ -313,7 +313,7 @@ export default {
       const params = {}
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZones = json.listzonesresponse.zone
         if (listZones) {
           this.zones = listZones
@@ -444,7 +444,7 @@ export default {
           params = Object.assign({}, params, formattedTagData)
         }
         this.actionLoading = true
-        api('createSnapshotPolicy', params).then(json => {
+        postAPI('createSnapshotPolicy', params).then(json => {
           this.$emit('refresh')
           this.$notification.success({
             message: this.$t('label.action.recurring.snapshot'),
diff --git a/ui/src/views/storage/MigrateImageStoreResource.vue b/ui/src/views/storage/MigrateImageStoreResource.vue
index 927ef427ff48..caa0aee8370a 100644
--- a/ui/src/views/storage/MigrateImageStoreResource.vue
+++ b/ui/src/views/storage/MigrateImageStoreResource.vue
@@ -36,7 +36,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import ImageStoreSelector from '@/components/view/ImageStoreSelectView'
 
@@ -75,7 +75,7 @@ export default {
   computed: {},
   methods: {
     fetchDestinationStores () {
-      api('listImageStores', {
+      getAPI('listImageStores', {
         zoneid: this.zoneid
       }).then(response => {
         this.destinationStoreList = response.listimagestoresresponse.imagestore
@@ -112,7 +112,7 @@ export default {
       params.templates = this.templateIdsToMigrate.join(',')
       params.snapshots = this.snapshotIdsToMigrate.join(',')
 
-      api('migrateResourceToAnotherSecondaryStorage', params).then(response => {
+      postAPI('migrateResourceToAnotherSecondaryStorage', params).then(response => {
         const jobId = response.migrateresourcetoanothersecondarystorageresponse.jobid
         this.$pollJob({
           title: this.$t('label.migrating.data'),
diff --git a/ui/src/views/storage/MigrateVolume.vue b/ui/src/views/storage/MigrateVolume.vue
index a1ce4f71bd1e..c512133fa300 100644
--- a/ui/src/views/storage/MigrateVolume.vue
+++ b/ui/src/views/storage/MigrateVolume.vue
@@ -70,7 +70,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import StoragePoolSelectView from '@/components/view/StoragePoolSelectView'
 
@@ -111,7 +111,7 @@ export default {
   methods: {
     fetchStoragePools () {
       if (this.resource.virtualmachineid) {
-        api('findStoragePoolsForMigration', {
+        getAPI('findStoragePoolsForMigration', {
           id: this.resource.id
         }).then(response => {
           this.storagePools = response.findstoragepoolsformigrationresponse.storagepool || []
@@ -124,7 +124,7 @@ export default {
           this.closeModal()
         })
       } else {
-        api('listStoragePools', {
+        getAPI('listStoragePools', {
           zoneid: this.resource.zoneid
         }).then(response => {
           this.storagePools = response.liststoragepoolsresponse.storagepool || []
@@ -142,7 +142,7 @@ export default {
     fetchDiskOfferings () {
       this.diskOfferingLoading = true
       if (this.resource.virtualmachineid) {
-        api('listDiskOfferings', {
+        getAPI('listDiskOfferings', {
           storageid: this.selectedStoragePool.id,
           listall: true
         }).then(response => {
@@ -191,7 +191,7 @@ export default {
       if (this.replaceDiskOffering) {
         params.newdiskofferingid = this.selectedDiskOffering
       }
-      api('migrateVolume', params).then(response => {
+      postAPI('migrateVolume', params).then(response => {
         this.$pollJob({
           title: this.$t('label.migrate.volume'),
           description: this.resource.id,
diff --git a/ui/src/views/storage/RecurringSnapshotVolume.vue b/ui/src/views/storage/RecurringSnapshotVolume.vue
index dc2e83a91c4c..1cac35c3eba9 100644
--- a/ui/src/views/storage/RecurringSnapshotVolume.vue
+++ b/ui/src/views/storage/RecurringSnapshotVolume.vue
@@ -40,7 +40,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import FormSchedule from '@/views/storage/FormSchedule'
 import ScheduledSnapshots from '@/views/storage/ScheduledSnapshots'
 
@@ -71,7 +71,7 @@ export default {
       this.dataSource = []
       this.loading = true
       params.volumeid = this.resource.id
-      api('listSnapshotPolicies', params).then(json => {
+      getAPI('listSnapshotPolicies', params).then(json => {
         this.loading = false
         const listSnapshotPolicies = json.listsnapshotpoliciesresponse.snapshotpolicy
         if (listSnapshotPolicies && listSnapshotPolicies.length > 0) {
diff --git a/ui/src/views/storage/ResizeVolume.vue b/ui/src/views/storage/ResizeVolume.vue
index 8d5bd28917a6..5f9efd6ed506 100644
--- a/ui/src/views/storage/ResizeVolume.vue
+++ b/ui/src/views/storage/ResizeVolume.vue
@@ -65,7 +65,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -105,7 +105,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('listDiskOfferings', {
+      getAPI('listDiskOfferings', {
         zoneid: this.resource.zoneid,
         listall: true
       }).then(json => {
@@ -124,7 +124,7 @@ export default {
         const values = this.handleRemoveFields(formRaw)
         this.loading = true
         values.id = this.resource.id
-        api('resizeVolume', values).then(response => {
+        postAPI('resizeVolume', values).then(response => {
           this.$pollJob({
             jobId: response.resizevolumeresponse.jobid,
             title: this.$t('label.action.resize.volume'),
diff --git a/ui/src/views/storage/RestoreAttachBackupVolume.vue b/ui/src/views/storage/RestoreAttachBackupVolume.vue
index 72c38ac3d51b..54c7bb3eb5bb 100644
--- a/ui/src/views/storage/RestoreAttachBackupVolume.vue
+++ b/ui/src/views/storage/RestoreAttachBackupVolume.vue
@@ -71,7 +71,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 
 export default {
   name: 'RestoreAttachBackupVolume',
@@ -118,7 +118,7 @@ export default {
     },
     fetchVirtualMachine () {
       this.virtualMachineOptions.loading = true
-      api('listVirtualMachines', { zoneid: this.resource.zoneid }).then(json => {
+      getAPI('listVirtualMachines', { zoneid: this.resource.zoneid }).then(json => {
         this.virtualMachineOptions.opts = json.listvirtualmachinesresponse.virtualmachine || []
       }).catch(error => {
         this.$notifyError(error)
@@ -156,7 +156,7 @@ export default {
 
         this.actionLoading = true
         const title = this.$t('label.restore.volume.attach')
-        api('restoreVolumeFromBackupAndAttachToVM', params).then(json => {
+        postAPI('restoreVolumeFromBackupAndAttachToVM', params).then(json => {
           const jobId = json.restorevolumefrombackupandattachtovmresponse.jobid || null
           if (jobId) {
             this.$pollJob({
diff --git a/ui/src/views/storage/ScheduledSnapshots.vue b/ui/src/views/storage/ScheduledSnapshots.vue
index 6792dc310c36..aadc3f5126e3 100644
--- a/ui/src/views/storage/ScheduledSnapshots.vue
+++ b/ui/src/views/storage/ScheduledSnapshots.vue
@@ -85,7 +85,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import { timeZoneName } from '@/utils/timezone'
 
@@ -178,7 +178,7 @@ export default {
       const params = {}
       params.id = record.id
       this.actionLoading = true
-      api('deleteSnapshotPolicies', params).then(json => {
+      postAPI('deleteSnapshotPolicies', params).then(json => {
         if (json.deletesnapshotpoliciesresponse.success) {
           this.$notification.success({
             message: this.$t('label.delete.snapshot.policy'),
diff --git a/ui/src/views/storage/SharedFSTab.vue b/ui/src/views/storage/SharedFSTab.vue
index bdb202c42c97..9c6d080468d1 100644
--- a/ui/src/views/storage/SharedFSTab.vue
+++ b/ui/src/views/storage/SharedFSTab.vue
@@ -65,7 +65,7 @@
 
 <script>
 
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { mixinDevice } from '@/utils/mixin.js'
 import Status from '@/components/widgets/Status'
 import DetailsTab from '@/components/view/DetailsTab'
@@ -159,7 +159,7 @@ export default {
       if (this.$store.getters.listAllProjects) {
         params.projectid = '-1'
       }
-      api('listVirtualMachines', params).then(json => {
+      getAPI('listVirtualMachines', params).then(json => {
         this.virtualmachines = json.listvirtualmachinesresponse.virtualmachine || []
         this.vm = this.virtualmachines[0]
       })
@@ -175,7 +175,7 @@ export default {
         listsystemvms: 'true',
         listall: true
       }
-      api('listVolumes', params).then(json => {
+      getAPI('listVolumes', params).then(json => {
         this.volumes = json.listvolumesresponse.volume || []
         this.volume = this.volumes[0]
       })
diff --git a/ui/src/views/storage/SnapshotZones.vue b/ui/src/views/storage/SnapshotZones.vue
index 66bd0f3a9d08..d386229377ed 100644
--- a/ui/src/views/storage/SnapshotZones.vue
+++ b/ui/src/views/storage/SnapshotZones.vue
@@ -199,7 +199,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import OsLogo from '@/components/widgets/OsLogo'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipButton from '@/components/widgets/TooltipButton'
@@ -317,7 +317,7 @@ export default {
       this.dataSource = []
       this.itemCount = 0
       this.fetchLoading = true
-      api('listSnapshots', params).then(json => {
+      getAPI('listSnapshots', params).then(json => {
         this.dataSource = json.listsnapshotsresponse.snapshot || []
         this.itemCount = json.listsnapshotsresponse.count || 0
       }).catch(error => {
@@ -429,7 +429,7 @@ export default {
         zoneid: snapshot.zoneid
       }
       this.deleteLoading = true
-      api(this.deleteApi, params).then(json => {
+      postAPI(this.deleteApi, params).then(json => {
         const jobId = json.deletesnapshotresponse.jobid
         eventBus.emit('update-job-details', { jobId, resourceId: null })
         const singleZone = (this.dataSource.length === 1)
@@ -479,7 +479,7 @@ export default {
     fetchZoneData () {
       this.zones = []
       this.zoneLoading = true
-      api('listZones', { showicon: true }).then(json => {
+      getAPI('listZones', { showicon: true }).then(json => {
         const zones = json.listzonesresponse.zone || []
         this.zones = [...zones.filter((zone) => this.currentRecord.zoneid !== zone.id)]
       }).finally(() => {
@@ -521,7 +521,7 @@ export default {
           destzoneids: values.zoneid.join()
         }
         this.copyLoading = true
-        api(this.copyApi, params).then(json => {
+        postAPI(this.copyApi, params).then(json => {
           const jobId = json.copysnapshotresponse.jobid
           eventBus.emit('update-job-details', { jobId, resourceId: null })
           this.$pollJob({
diff --git a/ui/src/views/storage/TakeSnapshot.vue b/ui/src/views/storage/TakeSnapshot.vue
index e378664d7fbc..69847f946196 100644
--- a/ui/src/views/storage/TakeSnapshot.vue
+++ b/ui/src/views/storage/TakeSnapshot.vue
@@ -124,7 +124,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import TooltipButton from '@/components/widgets/TooltipButton'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -195,7 +195,7 @@ export default {
       const params = {}
       params.showicon = true
       this.zoneLoading = true
-      api('listZones', params).then(json => {
+      getAPI('listZones', params).then(json => {
         const listZones = json.listzonesresponse.zone
         if (listZones) {
           this.zones = listZones
@@ -239,7 +239,7 @@ export default {
         this.actionLoading = true
         const title = this.$t('label.action.take.snapshot')
         const description = this.$t('label.volume') + ' ' + this.resource.id
-        api('createSnapshot', params).then(json => {
+        postAPI('createSnapshot', params).then(json => {
           const jobId = json.createsnapshotresponse.jobid
           if (jobId) {
             this.$pollJob({
diff --git a/ui/src/views/storage/UpdateBucket.vue b/ui/src/views/storage/UpdateBucket.vue
index 305b5c96b580..8e410344beef 100644
--- a/ui/src/views/storage/UpdateBucket.vue
+++ b/ui/src/views/storage/UpdateBucket.vue
@@ -66,7 +66,7 @@
 </template>
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 
 export default {
@@ -141,7 +141,7 @@ export default {
         }
 
         this.loading = true
-        api('updateBucket', data).then(response => {
+        postAPI('updateBucket', data).then(response => {
           this.$emit('refresh-data')
           this.$notification.success({
             message: this.$t('label.bucket.update'),
diff --git a/ui/src/views/storage/UpdateSharedFS.vue b/ui/src/views/storage/UpdateSharedFS.vue
index 397cc29892b2..caf454822f23 100644
--- a/ui/src/views/storage/UpdateSharedFS.vue
+++ b/ui/src/views/storage/UpdateSharedFS.vue
@@ -44,7 +44,7 @@
 <script>
 
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 
@@ -116,7 +116,7 @@ export default {
         console.log(data)
         console.log(this.form)
         this.loading = true
-        api('updateSharedFileSystem', data).then(response => {
+        postAPI('updateSharedFileSystem', data).then(response => {
           this.$emit('refresh-data')
           this.$notification.success({
             message: this.$t('label.update.sharedfs'),
diff --git a/ui/src/views/storage/UploadLocalVolume.vue b/ui/src/views/storage/UploadLocalVolume.vue
index 75775c9010a8..a6125fa514eb 100644
--- a/ui/src/views/storage/UploadLocalVolume.vue
+++ b/ui/src/views/storage/UploadLocalVolume.vue
@@ -168,7 +168,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { axios } from '../../utils/request'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
@@ -222,7 +222,7 @@ export default {
       })
     },
     listZones () {
-      api('listZones', { showicon: true }).then(json => {
+      getAPI('listZones', { showicon: true }).then(json => {
         if (json && json.listzonesresponse && json.listzonesresponse.zone) {
           this.zones = json.listzonesresponse.zone
           this.zones = this.zones.filter(zone => zone.type !== 'Edge')
@@ -241,7 +241,7 @@ export default {
       this.offeringLoading = true
       this.offerings = [{ id: -1, name: '' }]
       this.form.diskofferingid = undefined
-      api('listDiskOfferings', {
+      getAPI('listDiskOfferings', {
         zoneid: zoneId,
         listall: true
       }).then(json => {
@@ -287,7 +287,7 @@ export default {
     },
     fetchDomains () {
       this.domainLoading = true
-      api('listDomains', {
+      getAPI('listDomains', {
         listAll: true,
         details: 'min'
       }).then(response => {
@@ -303,7 +303,7 @@ export default {
       })
     },
     fetchAccounts () {
-      api('listAccounts', {
+      getAPI('listAccounts', {
         domainid: this.domainId
       }).then(response => {
         this.accountList = response.listaccountsresponse.account || []
@@ -333,7 +333,7 @@ export default {
         }
         params.domainId = this.domainId
         this.loading = true
-        api('getUploadParamsForVolume', params).then(json => {
+        getAPI('getUploadParamsForVolume', params).then(json => {
           this.uploadParams = json.postuploadvolumeresponse?.getuploadparams || ''
           const { fileList } = this
           if (this.fileList.length > 1) {
diff --git a/ui/src/views/storage/UploadVolume.vue b/ui/src/views/storage/UploadVolume.vue
index 937c3ad76aa5..db8866caa0c1 100644
--- a/ui/src/views/storage/UploadVolume.vue
+++ b/ui/src/views/storage/UploadVolume.vue
@@ -158,7 +158,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import { mixinForm } from '@/utils/mixin'
 import ResourceIcon from '@/components/view/ResourceIcon'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -209,7 +209,7 @@ export default {
     },
     fetchData () {
       this.loading = true
-      api('listZones', { showicon: true }).then(json => {
+      getAPI('listZones', { showicon: true }).then(json => {
         this.zones = json.listzonesresponse.zone || []
         this.zones = this.zones.filter(zone => zone.type !== 'Edge')
         this.form.zoneId = this.zones[0].id || ''
@@ -223,7 +223,7 @@ export default {
     },
     fetchDiskOfferings (zoneId) {
       this.loading = true
-      api('listDiskOfferings', {
+      getAPI('listDiskOfferings', {
         zoneid: zoneId,
         listall: true
       }).then(json => {
@@ -234,7 +234,7 @@ export default {
     },
     fetchDomains () {
       this.domainLoading = true
-      api('listDomains', {
+      getAPI('listDomains', {
         listAll: true,
         details: 'min'
       }).then(response => {
@@ -250,7 +250,7 @@ export default {
       })
     },
     fetchAccounts () {
-      api('listAccounts', {
+      getAPI('listAccounts', {
         domainid: this.domainId
       }).then(response => {
         this.accountList = response.listaccountsresponse.account || []
@@ -295,7 +295,7 @@ export default {
         }
         params.domainId = this.domainId
         this.loading = true
-        api('uploadVolume', params).then(json => {
+        postAPI('uploadVolume', params).then(json => {
           this.$notification.success({
             message: this.$t('message.success.upload'),
             description: this.$t('message.success.upload.volume.description')
diff --git a/ui/src/views/tools/CreateWebhook.vue b/ui/src/views/tools/CreateWebhook.vue
index 7d687c7d983e..f5165608a68d 100644
--- a/ui/src/views/tools/CreateWebhook.vue
+++ b/ui/src/views/tools/CreateWebhook.vue
@@ -155,7 +155,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import _ from 'lodash'
 import { mixinForm } from '@/utils/mixin'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -238,7 +238,7 @@ export default {
       ]
       this.form.domainid = null
       this.form.account = null
-      api('listDomains', {}).then(json => {
+      getAPI('listDomains', {}).then(json => {
         const listdomains = json.listdomainsresponse.domain
         this.domains = this.domains.concat(listdomains)
       }).finally(() => {
@@ -258,7 +258,7 @@ export default {
       var params = {
         domainid: this.form.domainid
       }
-      api('listAccounts', params).then(json => {
+      getAPI('listAccounts', params).then(json => {
         const listAccounts = json.listaccountsresponse.account || []
         this.accounts = listAccounts
       }).finally(() => {
@@ -306,7 +306,7 @@ export default {
           }
         }
         this.loading = true
-        api('createWebhook', params).then(json => {
+        postAPI('createWebhook', params).then(json => {
           this.$emit('refresh-data')
           this.$notification.success({
             message: this.$t('label.create.webhook'),
diff --git a/ui/src/views/tools/ImportUnmanagedInstance.vue b/ui/src/views/tools/ImportUnmanagedInstance.vue
index 95c14f141d20..aabd1df75728 100644
--- a/ui/src/views/tools/ImportUnmanagedInstance.vue
+++ b/ui/src/views/tools/ImportUnmanagedInstance.vue
@@ -387,7 +387,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import _ from 'lodash'
 import InfoCard from '@/components/view/InfoCard'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
@@ -804,7 +804,7 @@ export default {
       if (!('listall' in options)) {
         options.listall = true
       }
-      api(param.list, options).then((response) => {
+      getAPI(param.list, options).then((response) => {
         param.loading = false
         _.map(response, (responseItem, responseKey) => {
           if (Object.keys(responseItem).length === 0) {
@@ -836,7 +836,7 @@ export default {
       this.totalComputeOfferings = 0
       this.computeOfferings = []
       this.offeringsMap = []
-      api('listServiceOfferings', {
+      getAPI('listServiceOfferings', {
         keyword: options.keyword,
         page: options.page,
         pageSize: options.pageSize,
@@ -929,7 +929,7 @@ export default {
       }
     },
     fetchKvmHostsForConversion () {
-      api('listHosts', {
+      getAPI('listHosts', {
         zoneid: this.zoneid,
         hypervisor: this.cluster.hypervisortype,
         type: 'Routing',
@@ -954,7 +954,7 @@ export default {
       })
     },
     fetchKvmHostsForImporting () {
-      api('listHosts', {
+      getAPI('listHosts', {
         clusterid: this.cluster.id,
         hypervisor: this.cluster.hypervisortype,
         type: 'Routing',
@@ -976,12 +976,12 @@ export default {
             params.scope = 'ZONE'
           }
         }
-        api('listStoragePools', params).then(json => {
+        getAPI('listStoragePools', params).then(json => {
           this.storagePoolsForConversion = json.liststoragepoolsresponse.storagepool || []
         })
       } else if (this.selectedStorageOptionForConversion === 'local') {
         const kvmHost = this.kvmHostsForConversion.filter(x => x.id === this.selectedKvmHostForConversion)[0]
-        api('listStoragePools', {
+        getAPI('listStoragePools', {
           scope: 'HOST',
           ipaddress: kvmHost.ipaddress,
           status: 'Up'
@@ -1219,7 +1219,7 @@ export default {
         this.updateLoading(true)
         const name = params.name
         return new Promise((resolve, reject) => {
-          api(importapi, params).then(response => {
+          postAPI(importapi, params).then(response => {
             var jobId
             if (this.isDiskImport || this.isExternalImport || this.selectedVmwareVcenter) {
               jobId = response.importvmresponse.jobid
diff --git a/ui/src/views/tools/ManageInstances.vue b/ui/src/views/tools/ManageInstances.vue
index 8295006fa77d..e1ae9e79638f 100644
--- a/ui/src/views/tools/ManageInstances.vue
+++ b/ui/src/views/tools/ManageInstances.vue
@@ -537,7 +537,7 @@
 <script>
 import { message } from 'ant-design-vue'
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { postAPI, getAPI } from '@/api'
 import _ from 'lodash'
 import Breadcrumb from '@/components/widgets/Breadcrumb'
 import Status from '@/components/widgets/Status'
@@ -1001,7 +1001,7 @@ export default {
       if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'pools'].includes(name)) {
         options.listall = true
       }
-      api(param.list, options).then((response) => {
+      postAPI(param.list, options).then((response) => {
         param.loading = false
         _.map(response, (responseItem, responseKey) => {
           if (Object.keys(responseItem).length === 0) {
@@ -1200,7 +1200,7 @@ export default {
         }
       }
 
-      api(apiName, params).then(json => {
+      postAPI(apiName, params).then(json => {
         const response = this.isMigrateFromVmware ? json.listvmwaredcvmsresponse : json.listunmanagedinstancesresponse
         const listUnmanagedInstances = response.unmanagedinstance
         if (this.arrayHasItems(listUnmanagedInstances)) {
@@ -1244,7 +1244,7 @@ export default {
         }
       }
       this.searchParams.unmanaged = params
-      api(this.listInstancesApi.external, params).then(json => {
+      getAPI(this.listInstancesApi.external, params).then(json => {
         const listUnmanagedInstances = json.listvmsforimportresponse.unmanagedinstance
         if (this.arrayHasItems(listUnmanagedInstances)) {
           this.unmanagedInstances = this.unmanagedInstances.concat(listUnmanagedInstances)
@@ -1281,7 +1281,7 @@ export default {
       }
       this.managedInstancesLoading = true
       this.searchParams.managed = params
-      api(this.listInstancesApi.managed, params).then(json => {
+      getAPI(this.listInstancesApi.managed, params).then(json => {
         const listManagedInstances = json.listvirtualmachinesresponse.virtualmachine
         if (this.arrayHasItems(listManagedInstances)) {
           this.managedInstances = this.managedInstances.concat(listManagedInstances)
@@ -1330,7 +1330,7 @@ export default {
         params.instancename = vmname
         params.hostname = hostname
       }
-      api('listVmwareDcVms', params).then(json => {
+      getAPI('listVmwareDcVms', params).then(json => {
         const response = json.listvmwaredcvmsresponse
         this.selectedUnmanagedInstance = response.unmanagedinstance[0]
         this.selectedUnmanagedInstance.ostypename = this.selectedUnmanagedInstance.osdisplayname
@@ -1428,7 +1428,7 @@ export default {
       for (var index of this.managedInstancesSelectedRowKeys) {
         const vm = this.managedInstances[index]
         var params = { id: vm.id }
-        api('unmanageVirtualMachine', params).then(json => {
+        postAPI('unmanageVirtualMachine', params).then(json => {
           const jobId = json.unmanagevirtualmachineresponse.jobid
           this.$pollJob({
             jobId,
diff --git a/ui/src/views/tools/ManageVolumes.vue b/ui/src/views/tools/ManageVolumes.vue
index 94c06b4ce9c4..1359522b8566 100644
--- a/ui/src/views/tools/ManageVolumes.vue
+++ b/ui/src/views/tools/ManageVolumes.vue
@@ -473,7 +473,7 @@
 
 <script>
 import { ref, reactive, toRaw } from 'vue'
-import { api } from '@/api'
+import { getAPI, postAPI } from '@/api'
 import _ from 'lodash'
 import Breadcrumb from '@/components/widgets/Breadcrumb'
 import Status from '@/components/widgets/Status'
@@ -818,7 +818,7 @@ export default {
       if (!('listall' in options) && !['zones', 'pods', 'clusters', 'hosts', 'pools'].includes(name)) {
         options.listall = true
       }
-      api(param.list, options).then((response) => {
+      postAPI(param.list, options).then((response) => {
         param.loading = false
         _.map(response, (responseItem, responseKey) => {
           if (Object.keys(responseItem).length === 0) {
@@ -971,7 +971,7 @@ export default {
       this.fetchOptions(this.params.zones, 'zones', value)
     },
     fetchDomains () {
-      api('listDomains', {
+      getAPI('listDomains', {
         response: 'json',
         listAll: true,
         showicon: true,
@@ -986,7 +986,7 @@ export default {
     },
     fetchAccounts () {
       this.loading = true
-      api('listAccounts', {
+      getAPI('listAccounts', {
         response: 'json',
         domainId: this.importForm.selectedDomain,
         showicon: true,
@@ -1002,7 +1002,7 @@ export default {
     },
     fetchProjects () {
       this.loading = true
-      api('listProjects', {
+      getAPI('listProjects', {
         response: 'json',
         domainId: this.importForm.selectedDomain,
         state: 'Active',
@@ -1063,7 +1063,7 @@ export default {
         params.projectid = this.importForm.selectedProject
       }
 
-      api('listDiskOfferings', params).then(json => {
+      getAPI('listDiskOfferings', params).then(json => {
         this.diskOfferings = json.listdiskofferingsresponse.diskoffering || []
       }).finally(() => {
         this.loading = false
@@ -1096,7 +1096,7 @@ export default {
 
       const apiName = this.listVolumesApi.unmanaged
 
-      api(apiName, params).then(json => {
+      getAPI(apiName, params).then(json => {
         const response = json.listvolumesforimportresponse
         const listUnmanagedVolumes = response.volumeforimport
         if (this.arrayHasItems(listUnmanagedVolumes)) {
@@ -1137,7 +1137,7 @@ export default {
       }
       this.managedVolumesLoading = true
       this.searchParams.managed = params
-      api(this.listVolumesApi.managed, params).then(json => {
+      getAPI(this.listVolumesApi.managed, params).then(json => {
         const response = json.listvolumesresponse
         const listManagedVolumes = response.volume
         if (this.arrayHasItems(listManagedVolumes)) {
@@ -1216,7 +1216,7 @@ export default {
         path: this.selectedUnmanagedVolume.path,
         name: this.values.name
       }
-      api('importVolume', params).then(json => {
+      postAPI('importVolume', params).then(json => {
         const jobId = json.importvolumeresponse.jobid
         this.$pollJob({
           jobId,
@@ -1269,7 +1269,7 @@ export default {
       for (var index of this.managedVolumesSelectedRowKeys) {
         const vm = this.managedVolumes[index]
         var params = { id: vm.id }
-        api('unmanageVolume', params).then(json => {
+        postAPI('unmanageVolume', params).then(json => {
           const jobId = json.unmanagevolumeresponse.jobid
           this.$pollJob({
             jobId,
diff --git a/ui/src/views/tools/SelectVmwareVcenter.vue b/ui/src/views/tools/SelectVmwareVcenter.vue
index d742e72f9e08..7648b90c3e60 100644
--- a/ui/src/views/tools/SelectVmwareVcenter.vue
+++ b/ui/src/views/tools/SelectVmwareVcenter.vue
@@ -143,7 +143,7 @@
 </template>
 
 <script>
-import { api } from '@/api'
+import { getAPI } from '@/api'
 import { ref, reactive } from 'vue'
 import TooltipLabel from '@/components/widgets/TooltipLabel'
 import Status from '@/components/widgets/Status'
@@ -229,7 +229,7 @@ export default {
       }
       params.page = 1
       params.pagesize = 10
-      api('listVmwareDcVms', params).then(json => {
+      getAPI('listVmwareDcVms', params).then(json => {
         const obj = {
           params: params,
           response: json.listvmwaredcvmsresponse
@@ -243,7 +243,7 @@ export default {
     },
     fetchZones () {
       this.loading = true
-      api('listZones', { showicon: true }).then(response => {
+      getAPI('listZones', { showicon: true }).then(response => {
         this.zones = response.listzonesresponse.zone || []
       }).catch(error => {
         this.$notifyError(error)
@@ -257,7 +257,7 @@ export default {
     },
     listZoneVmwareDcs () {
       this.loading = true
-      api('listVmwareDcs', { zoneid: this.sourcezoneid }).then(response => {
+      getAPI('listVmwareDcs', { zoneid: this.sourcezoneid }).then(response => {
         if (response.listvmwaredcsresponse.VMwareDC && response.listvmwaredcsresponse.VMwareDC.length > 0) {
           this.existingvcenter = response.listvmwaredcsresponse.VMwareDC
         }
diff --git a/ui/tests/common/index.js b/ui/tests/common/index.js
index d03c31a706fd..227aea89bd61 100644
--- a/ui/tests/common/index.js
+++ b/ui/tests/common/index.js
@@ -101,10 +101,20 @@ function createFactory (component, options) {
   })
 }
 
+function createDataParams (object) {
+  const params = new URLSearchParams()
+
+  Object.entries(object).forEach(([key, value]) => {
+    params.append(key, value)
+  })
+  return params
+}
+
 export default {
   createFactory,
   createMockRouter,
   createMockI18n,
   createMockStore,
+  createDataParams,
   decodeHtml
 }
diff --git a/ui/tests/unit/components/view/ActionButton.spec.js b/ui/tests/unit/components/view/ActionButton.spec.js
index 1565b471548d..06c247babaca 100644
--- a/ui/tests/unit/components/view/ActionButton.spec.js
+++ b/ui/tests/unit/components/view/ActionButton.spec.js
@@ -129,12 +129,13 @@ describe('Components > View > ActionButton.vue', () => {
   describe('Method', () => {
     describe('handleShowBadge()', () => {
       it('API should be called and return not empty', async (done) => {
-        const postData = new URLSearchParams()
         mockAxios.mockResolvedValue({ testapinameresponse: { count: 2 } })
         const wrapper = factory({
           props: {
             actions: [
               {
+                command: 'test-api-case-3',
+                response: 'json',
                 label: 'label.action',
                 api: 'test-api-case-3',
                 showBadge: true,
@@ -150,12 +151,11 @@ describe('Components > View > ActionButton.vue', () => {
         await flushPromises()
         expect(mockAxios).toHaveBeenCalledTimes(1)
         expect(mockAxios).toHaveBeenCalledWith({
-          data: postData,
-          method: 'GET',
-          params: {
+          data: common.createDataParams({
             command: 'test-api-case-3',
             response: 'json'
-          },
+          }),
+          method: 'POST',
           url: '/'
         })
         expect(wrapper.vm.actionBadge).toEqual(expected)
@@ -164,12 +164,13 @@ describe('Components > View > ActionButton.vue', () => {
       })
 
       it('API should be called and return empty', async (done) => {
-        const postData = new URLSearchParams()
         mockAxios.mockResolvedValue({ data: [] })
         const wrapper = factory({
           props: {
             actions: [
               {
+                command: 'test-api-case-4',
+                response: 'json',
                 label: 'label.action',
                 api: 'test-api-case-4',
                 showBadge: true,
@@ -185,12 +186,11 @@ describe('Components > View > ActionButton.vue', () => {
         await flushPromises()
         expect(mockAxios).toHaveBeenCalledTimes(1)
         expect(mockAxios).toHaveBeenCalledWith({
-          data: postData,
-          method: 'GET',
-          params: {
+          data: common.createDataParams({
             command: 'test-api-case-4',
             response: 'json'
-          },
+          }),
+          method: 'POST',
           url: '/'
         })
         expect(wrapper.vm.actionBadge).toEqual(expected)
@@ -199,12 +199,13 @@ describe('Components > View > ActionButton.vue', () => {
       })
 
       it('API should be called and throw eror', async (done) => {
-        const postData = new URLSearchParams()
         mockAxios.mockRejectedValue('errMethodMessage')
         const wrapper = factory({
           props: {
             actions: [
               {
+                command: 'test-api-case-5',
+                response: 'json',
                 label: 'label.action',
                 api: 'test-api-case-5',
                 showBadge: true,
@@ -219,12 +220,11 @@ describe('Components > View > ActionButton.vue', () => {
         await flushPromises()
         expect(mockAxios).toHaveBeenCalledTimes(1)
         expect(mockAxios).toHaveBeenCalledWith({
-          data: postData,
-          method: 'GET',
-          params: {
+          data: common.createDataParams({
             command: 'test-api-case-5',
             response: 'json'
-          },
+          }),
+          method: 'POST',
           url: '/'
         })
         expect(wrapper.vm.actionBadge).toEqual({})
diff --git a/ui/tests/unit/views/AutogenView.spec.js b/ui/tests/unit/views/AutogenView.spec.js
index eb0352f99d1e..c20ee7db0ccf 100644
--- a/ui/tests/unit/views/AutogenView.spec.js
+++ b/ui/tests/unit/views/AutogenView.spec.js
@@ -434,7 +434,6 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'GET',
-          data: new URLSearchParams(),
           params: {
             command: 'listProjects',
             id: '111111111111111111111111111111111111',
@@ -576,16 +575,15 @@ describe('Views > AutogenView.vue', () => {
 
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
-          data: new URLSearchParams(),
-          method: 'GET',
-          params: {
+          data: common.createDataParams({
             command: 'testApiNameCase2',
+            response: 'json',
             listall: true,
             key: 'test-value',
             page: 1,
-            pagesize: 20,
-            response: 'json'
-          },
+            pagesize: 20
+          }),
+          method: 'POST',
           url: '/'
         })
 
@@ -604,16 +602,15 @@ describe('Views > AutogenView.vue', () => {
 
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
-          data: new URLSearchParams(),
-          method: 'GET',
-          params: {
+          data: common.createDataParams({
             command: 'testApiNameCase3',
+            response: 'json',
             listall: true,
             key: 'test-value',
             page: 1,
-            pagesize: 20,
-            response: 'json'
-          },
+            pagesize: 20
+          }),
+          method: 'POST',
           url: '/'
         })
         done()
@@ -666,17 +663,16 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
+            response: 'json',
             listall: true,
             id: 'test-id',
             hostname: 'test-id',
             page: 1,
-            pagesize: 20,
-            response: 'json'
-          }
+            pagesize: 20
+          })
         })
         done()
       })
@@ -1259,14 +1255,13 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
+            response: 'json',
             listall: true,
-            showicon: true,
-            response: 'json'
-          }
+            showicon: true
+          })
         })
         expect(param).toEqual({
           name: 'template',
@@ -1298,13 +1293,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'listTestApiNames',
-            listall: true,
-            response: 'json'
-          }
+            response: 'json',
+            listall: true
+          })
         })
         expect(param).toEqual({
           name: 'testapiname',
@@ -1354,15 +1348,14 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
+            response: 'json',
             listall: true,
             name: 'test-name-value',
-            showicon: true,
-            response: 'json'
-          }
+            showicon: true
+          })
         })
         expect(param).toEqual({
           name: 'template',
@@ -1397,14 +1390,13 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'listTemplates',
+            response: 'json',
             listall: true,
-            templatefilter: 'executable',
-            response: 'json'
-          }
+            templatefilter: 'executable'
+          })
         })
         expect(param).toEqual({
           name: 'id',
@@ -1437,14 +1429,13 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'listIsos',
+            response: 'json',
             listall: true,
-            isofilter: 'executable',
-            response: 'json'
-          }
+            isofilter: 'executable'
+          })
         })
         expect(param).toEqual({
           name: 'id',
@@ -1477,14 +1468,13 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'listHosts',
+            response: 'json',
             listall: true,
-            type: 'routing',
-            response: 'json'
-          }
+            type: 'routing'
+          })
         })
         expect(param).toEqual({
           name: 'id',
@@ -1513,13 +1503,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            listall: true,
-            response: 'json'
-          }
+            response: 'json',
+            listall: true
+          })
         })
         expect(param).toEqual({
           name: 'id',
@@ -1556,11 +1545,10 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'GET',
-          data: new URLSearchParams(),
           params: {
             command: 'queryAsyncJobResult',
-            jobId: 'test-job-id',
-            response: 'json'
+            response: 'json',
+            jobId: 'test-job-id'
           }
         })
         done()
@@ -1598,11 +1586,10 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'GET',
-          data: new URLSearchParams(),
           params: {
             command: 'queryAsyncJobResult',
-            jobId: 'test-job-id',
-            response: 'json'
+            response: 'json',
+            jobId: 'test-job-id'
           }
         })
 
@@ -1635,11 +1622,10 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'GET',
-          data: new URLSearchParams(),
           params: {
             command: 'queryAsyncJobResult',
-            jobId: 'test-job-id',
-            response: 'json'
+            response: 'json',
+            jobId: 'test-job-id'
           }
         })
         done()
@@ -2382,13 +2368,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            id: 'test-resource-id',
-            response: 'json'
-          }
+            response: 'json',
+            id: 'test-resource-id'
+          })
         })
         done()
       })
@@ -2421,13 +2406,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            id: 'test-resource-id',
-            response: 'json'
-          }
+            response: 'json',
+            id: 'test-resource-id'
+          })
         })
         done()
       })
@@ -2459,13 +2443,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            column1: false,
-            response: 'json'
-          }
+            response: 'json',
+            column1: false
+          })
         })
         done()
       })
@@ -2497,13 +2480,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            column1: false,
-            response: 'json'
-          }
+            response: 'json',
+            column1: false
+          })
         })
         done()
       })
@@ -2535,13 +2517,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            column1: false,
-            response: 'json'
-          }
+            response: 'json',
+            column1: false
+          })
         })
         done()
       })
@@ -2573,12 +2554,11 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
             response: 'json'
-          }
+          })
         })
         done()
       })
@@ -2615,13 +2595,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            column1: 'column-value2',
-            response: 'json'
-          }
+            response: 'json',
+            column1: 'column-value2'
+          })
         })
         done()
       })
@@ -2674,13 +2653,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            column1: 'test-id-2,test-id-3',
-            response: 'json'
-          }
+            response: 'json',
+            column1: 'test-id-2,test-id-3'
+          })
         })
         done()
       })
@@ -2713,13 +2691,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'createAccount',
-            account: 'test-account-value',
-            response: 'json'
-          }
+            response: 'json',
+            account: 'test-account-value'
+          })
         })
         done()
       })
@@ -2752,13 +2729,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'addAccountToProject',
-            keypair: 'test-keypair-value',
-            response: 'json'
-          }
+            response: 'json',
+            keypair: 'test-keypair-value'
+          })
         })
         done()
       })
@@ -2809,13 +2785,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            keypair: 'test-name-2',
-            response: 'json'
-          }
+            response: 'json',
+            keypair: 'test-name-2'
+          })
         })
         done()
       })
@@ -2848,13 +2823,12 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
-            column1: 'test-column-value',
-            response: 'json'
-          }
+            response: 'json',
+            column1: 'test-column-value'
+          })
         })
         done()
       })
@@ -2890,14 +2864,13 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
+            response: 'json',
             column1: 'test-column1-value',
-            column2: 'test-column2-value',
-            response: 'json'
-          }
+            column2: 'test-column2-value'
+          })
         })
         done()
       })
@@ -2939,14 +2912,13 @@ describe('Views > AutogenView.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'testApiNameCase1',
+            response: 'json',
             column1: 'test-column1-value',
-            column2: 'test-name-value',
-            response: 'json'
-          }
+            column2: 'test-name-value'
+          })
         })
         done()
       })
@@ -2966,6 +2938,8 @@ describe('Views > AutogenView.vue', () => {
         await wrapper.setData({
           showAction: true,
           currentAction: {
+            command: 'testApiNameCase1',
+            response: 'json',
             api: 'testApiNameCase1',
             label: 'label.name',
             params: [{ name: 'id', type: 'uuid' }],
@@ -2980,17 +2954,15 @@ describe('Views > AutogenView.vue', () => {
         await flushPromises()
 
         const postData = new URLSearchParams()
+        postData.append('command', 'testApiNameCase1')
+        postData.append('response', 'json')
         postData.append('id', 'test-id-value')
 
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'POST',
-          data: postData,
-          params: {
-            command: 'testApiNameCase1',
-            response: 'json'
-          }
+          data: postData
         })
         done()
       })
diff --git a/ui/tests/unit/views/compute/MigrateWizard.spec.js b/ui/tests/unit/views/compute/MigrateWizard.spec.js
index d3ee49426dcb..0ade85c20518 100644
--- a/ui/tests/unit/views/compute/MigrateWizard.spec.js
+++ b/ui/tests/unit/views/compute/MigrateWizard.spec.js
@@ -148,7 +148,6 @@ describe('Views > compute > MigrateWizard.vue', () => {
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'GET',
-          data: new URLSearchParams(),
           params: {
             command: 'findHostsForMigration',
             virtualmachineid: undefined,
@@ -171,7 +170,6 @@ describe('Views > compute > MigrateWizard.vue', () => {
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'GET',
-          data: new URLSearchParams(),
           params: {
             command: 'findHostsForMigration',
             virtualmachineid: null,
@@ -194,7 +192,6 @@ describe('Views > compute > MigrateWizard.vue', () => {
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'GET',
-          data: new URLSearchParams(),
           params: {
             command: 'findHostsForMigration',
             virtualmachineid: 'test-id-value',
@@ -218,7 +215,6 @@ describe('Views > compute > MigrateWizard.vue', () => {
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'GET',
-          data: new URLSearchParams(),
           params: {
             command: 'findHostsForMigration',
             virtualmachineid: 'test-id-value',
@@ -246,7 +242,6 @@ describe('Views > compute > MigrateWizard.vue', () => {
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
           method: 'GET',
-          data: new URLSearchParams(),
           params: {
             command: 'findHostsForMigration',
             virtualmachineid: 'test-id-value',
@@ -350,14 +345,13 @@ describe('Views > compute > MigrateWizard.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'migrateVirtualMachineWithVolume',
+            response: 'json',
             hostid: 'test-host-id',
-            virtualmachineid: 'test-resource-id',
-            response: 'json'
-          }
+            virtualmachineid: 'test-resource-id'
+          })
         })
         done()
       })
@@ -396,14 +390,13 @@ describe('Views > compute > MigrateWizard.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'migrateVirtualMachine',
+            response: 'json',
             hostid: 'test-host-id',
-            virtualmachineid: 'test-resource-id',
-            response: 'json'
-          }
+            virtualmachineid: 'test-resource-id'
+          })
         })
         done()
       })
@@ -442,14 +435,13 @@ describe('Views > compute > MigrateWizard.vue', () => {
         expect(mockAxios).toHaveBeenCalled()
         expect(mockAxios).toHaveBeenLastCalledWith({
           url: '/',
-          method: 'GET',
-          data: new URLSearchParams(),
-          params: {
+          method: 'POST',
+          data: common.createDataParams({
             command: 'migrateSystemVm',
+            response: 'json',
             hostid: 'test-host-id',
-            virtualmachineid: 'test-resource-id',
-            response: 'json'
-          }
+            virtualmachineid: 'test-resource-id'
+          })
         })
         done()
       })