Question getting retry to work

[ericalderman-emilio]

Here's my function using ky in a browser:

var knackGetRecords = async function(URL, payload) {
    const { default: ky } = await import ('https://cdnjs.cloudflare.com/ajax/libs/ky/0.27.0/index.min.js');
    try {
      const response = ky.put(URL, {
        json: payload,
        headers: {
          'X-Knack-Application-Id': appId,
          'X-Knack-REST-API-KEY': 'knack',
          'Authorization': Knack.getUserToken(),
          'content-type': 'application/json'
        },
        retry: {
          limit: 10,
          methods: ["put", "options"],
          statusCodes: [403, 429, 401, 500, 502, 400, 503]
        },
        hooks: {
          beforeRetry: [
            (options, error, retryCount) => {
              console.log('Retrying Knack API PUT call, retry count: ' + retryCount);
            }
          ]
        }
      }).json();
      return response;
    } catch (error) {
      console.log('Giving up on completing Knack API PUT call.');
      alert('To proceed, you must log out of Knack and log back in.');
      throw error;
    }
}

However the retries don't seem to be working. I'm seeing occasional 503 errors from my API calls in the browser, but I never see any retries or the console messages. What am I doing wrong?

I have almost the identical code with got running in Node.JS without a problem.

[sindresorhus]

Not an answer to your main question, but there's no need to wrap your code in new Promise.

[ericalderman-emilio]

I actually had it that way at first, but then I added it because I thought I read that ky does not return a Promise? Actually maybe I should remove that and add await.

(Sorry for adding this as an issue instead of discussion)

[ericalderman-emilio]

@sindresorhus Does it look to you like I've got the retry parameters correct?

[sindresorhus]

Does it look to you like I've got the retry parameters correct?

Yes

[ericalderman-emilio]

OK what's actually happening is when i am calling ky.put, the preflight OPTIONS request is sometimes encountering a 503 Service Unavailable error. So the error is not coming from the PUT but the OPTIONS call. I thought I would be covering this case by including the "options" in the methods list.

Any ideas why this wouldn't be caught by retry? Also, it doesn't even seem to be caught as an error for the try...catch handler.

(Code updated above to reflect current version)

[ericalderman-emilio]

I'm wondering if it's related to JakeChampion/fetch#426 - that it's just not possible with CORS requests to detect an error on a PUT call with payload, when the OPTIONS request is what gets the 503 error...?

[ericalderman-emilio]

@sindresorhus Any ideas about this? Do retries work with POST/PUT calls with payloads, if the failure is on the pre-flight OPTIONS call?

[khiet-vo]

I have same problem that BeforeRetry doesn't work on React Native...
BeforeRequest and AfterResponse is fine. But Cannot use afterResponse for refreshToken, it will create an endless loop

export const apiRoot = ky.create({
  prefixUrl,
  headers: {
    Accept: 'application/json',
  },
  hooks: {
    beforeRetry: [
      async ({ request, options, error, retryCount }) => {
        console.log('(╯°□°)╯ -- error:', error)

        console.log('(╯°□°)╯ -- retryCount:', retryCount);

        try {
          if (retryCount === 3) {
            throw new Error('Failed to retry');
          }
          if (error?.response?.status === 401) {
            const refreshStore = Storage.getItem(EKeyData.REFRESH_TOKEN);
            if (refreshStore) {
              const response = (await apiRoot
                .post('refresh-token', {
                  json: { refreshToken: refreshStore },
                })
                .json()) as TRespLogin;
              if (!response.token) {
                throw new Error('Token is exp');
              }
              const userData = userDataFromToken(response.token);
              useAuthState
                .getState()
                .logIn(userData, response.token, response.refreshToken);
              request.headers.set('Authorization', `Bearer ${response.token}`);
            } else {
              RootNavigation.navigate('Login');
            }
          }
        } catch (error) {
          RootNavigation.navigate('Login');
        }
      },
    ],
    beforeRequest: [beforeRequest],
  },
  retry: {
    methods: ['get', 'post'],
    limit: 2,
    statusCodes: [401],
  },
});