PromucFlow_constructor/app/client/src/api/ApiUtils.ts
Hetu Nandu d783183b3c
chore: Add sentry error for API response meta check (#20367)
## Description

We have found api responses not responding with a responseMeta object
intermittently. Adding a sentry log to try and collect more data before
fixing this issue


Fixes #20278


Media
> A video or a GIF is preferred. when using Loom, don’t embed because it
looks like it’s a GIF. instead, just link to the video


## Type of change

> Please delete options that are not relevant.

- Chore (housekeeping or task changes that don't impact user perception)


## How Has This Been Tested?
> Please describe the tests that you ran to verify your changes. Provide
instructions, so we can reproduce.
> Please also list any relevant details for your test configuration.
> Delete anything that is not important

- Manual
- Jest
- Cypress

### Test Plan
> Add Testsmith test cases links that relate to this PR

### Issues raised during DP testing
> Link issues raised during DP testing for better visiblity and tracking
(copy link from comments dropped on this PR)


## Checklist:
### Dev activity
- [ ] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [ ] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


### QA activity:
- [ ] Test plan has been approved by relevant developers
- [ ] Test plan has been peer reviewed by QA
- [ ] Cypress test cases have been added and approved by either SDET or
manual QA
- [ ] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [ ] Added Test Plan Approved label after reveiwing all Cypress test
2023-02-10 13:26:36 +05:30

180 lines
6.0 KiB
TypeScript

import {
createMessage,
ERROR_0,
ERROR_500,
SERVER_API_TIMEOUT_ERROR,
} from "@appsmith/constants/messages";
import axios, { AxiosRequestConfig, AxiosResponse } from "axios";
import {
API_STATUS_CODES,
ERROR_CODES,
SERVER_ERROR_CODES,
} from "@appsmith/constants/ApiConstants";
import log from "loglevel";
import { ActionExecutionResponse } from "api/ActionAPI";
import store from "store";
import { logoutUser } from "actions/userActions";
import { AUTH_LOGIN_URL } from "constants/routes";
import { getCurrentGitBranch } from "selectors/gitSyncSelectors";
import getQueryParamsObject from "utils/getQueryParamsObject";
import { UserCancelledActionExecutionError } from "sagas/ActionExecution/errorUtils";
import AnalyticsUtil from "utils/AnalyticsUtil";
import { getAppsmithConfigs } from "ce/configs";
import * as Sentry from "@sentry/react";
import { CONTENT_TYPE_HEADER_KEY } from "constants/ApiEditorConstants/CommonApiConstants";
const executeActionRegex = /actions\/execute/;
const timeoutErrorRegex = /timeout of (\d+)ms exceeded/;
export const axiosConnectionAbortedCode = "ECONNABORTED";
const appsmithConfig = getAppsmithConfigs();
const makeExecuteActionResponse = (response: any): ActionExecutionResponse => ({
...response.data,
clientMeta: {
size: response.headers["content-length"],
duration: Number(performance.now() - response.config.timer).toFixed(),
},
});
const is404orAuthPath = () => {
const pathName = window.location.pathname;
return /^\/404/.test(pathName) || /^\/user\/\w+/.test(pathName);
};
// Request interceptor will add a timer property to the request.
// this will be used to calculate the time taken for an action
// execution request
export const apiRequestInterceptor = (config: AxiosRequestConfig) => {
config.headers = config.headers ?? {};
const branch =
getCurrentGitBranch(store.getState()) || getQueryParamsObject().branch;
if (branch && config.headers) {
config.headers.branchName = branch;
}
if (config.url?.indexOf("/git/") !== -1) {
config.timeout = 1000 * 120; // increase timeout for git specific APIs
}
const anonymousId = AnalyticsUtil.getAnonymousId();
appsmithConfig.segment.enabled &&
anonymousId &&
(config.headers["x-anonymous-user-id"] = anonymousId);
return { ...config, timer: performance.now() };
};
// On success of an API, if the api is an action execution,
// add the client meta object with size and time taken info
// otherwise just return the data
export const apiSuccessResponseInterceptor = (
response: AxiosResponse,
): AxiosResponse["data"] => {
if (response.config.url) {
if (response.config.url.match(executeActionRegex)) {
return makeExecuteActionResponse(response);
}
}
if (
response.headers[CONTENT_TYPE_HEADER_KEY] === "application/json" &&
!response.data.responseMeta
) {
Sentry.captureException(new Error("Api responded without response meta"), {
contexts: { response: response.data },
});
}
return response.data;
};
// Handle different api failure scenarios
export const apiFailureResponseInterceptor = (error: any) => {
// Return error when there is no internet
if (!window.navigator.onLine) {
return Promise.reject({
...error,
message: createMessage(ERROR_0),
});
}
// Return if the call was cancelled via cancel token
if (axios.isCancel(error)) {
throw new UserCancelledActionExecutionError();
}
// Return modified response if action execution failed
if (error.config && error.config.url.match(executeActionRegex)) {
return makeExecuteActionResponse(error.response);
}
// Return error if any timeout happened in other api calls
if (
error.code === axiosConnectionAbortedCode &&
error.message &&
error.message.match(timeoutErrorRegex)
) {
return Promise.reject({
...error,
message: createMessage(SERVER_API_TIMEOUT_ERROR),
code: ERROR_CODES.REQUEST_TIMEOUT,
});
}
if (error.response) {
if (error.response.status === API_STATUS_CODES.SERVER_ERROR) {
return Promise.reject({
...error,
code: ERROR_CODES.SERVER_ERROR,
message: createMessage(ERROR_500),
});
}
// The request was made and the server responded with a status code
// that falls out of the range of 2xx
if (!is404orAuthPath()) {
const currentUrl = `${window.location.href}`;
if (error.response.status === API_STATUS_CODES.REQUEST_NOT_AUTHORISED) {
// Redirect to login and set a redirect url.
store.dispatch(
logoutUser({
redirectURL: `${AUTH_LOGIN_URL}?redirectUrl=${encodeURIComponent(
currentUrl,
)}`,
}),
);
return Promise.reject({
code: ERROR_CODES.REQUEST_NOT_AUTHORISED,
message: "Unauthorized. Redirecting to login page...",
show: false,
});
}
const errorData = error.response.data.responseMeta ?? {};
if (
errorData.status === API_STATUS_CODES.RESOURCE_NOT_FOUND &&
(errorData.error.code === SERVER_ERROR_CODES.RESOURCE_NOT_FOUND ||
errorData.error.code === SERVER_ERROR_CODES.UNABLE_TO_FIND_PAGE)
) {
return Promise.reject({
code: ERROR_CODES.PAGE_NOT_FOUND,
message: "Resource Not Found",
show: false,
});
}
}
if (error.response.data.responseMeta) {
return Promise.resolve(error.response.data);
}
Sentry.captureException(new Error("Api responded without response meta"), {
contexts: { response: error.response.data },
});
return Promise.reject(error.response.data);
} else if (error.request) {
// The request was made but no response was received
// `error.request` is an instance of XMLHttpRequest in the browser and an instance of
// http.ClientRequest in node.js
log.error(error.request);
} else {
// Something happened in setting up the request that triggered an Error
log.error("Error", error.message);
}
log.debug(error.config);
return Promise.resolve(error);
};