{"id":13481421,"url":"https://github.com/jamesplease/react-request","last_synced_at":"2025-03-27T12:30:47.829Z","repository":{"id":55087762,"uuid":"118081035","full_name":"jamesplease/react-request","owner":"jamesplease","description":"Declarative HTTP requests for React","archived":true,"fork":false,"pushed_at":"2021-01-11T18:12:59.000Z","size":253,"stargazers_count":362,"open_issues_count":19,"forks_count":21,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-05-19T19:17:08.762Z","etag":null,"topics":["fetch","http","react","request"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jamesplease.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-01-19T05:23:35.000Z","updated_at":"2023-08-03T01:50:20.000Z","dependencies_parsed_at":"2022-08-14T11:40:15.212Z","dependency_job_id":null,"html_url":"https://github.com/jamesplease/react-request","commit_stats":null,"previous_names":["jmeas/react-request"],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jamesplease%2Freact-request","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jamesplease%2Freact-request/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jamesplease%2Freact-request/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jamesplease%2Freact-request/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jamesplease","download_url":"https://codeload.github.com/jamesplease/react-request/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245844815,"owners_count":20681783,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["fetch","http","react","request"],"created_at":"2024-07-31T17:00:51.688Z","updated_at":"2025-03-27T12:30:47.342Z","avatar_url":"https://github.com/jamesplease.png","language":"JavaScript","readme":"# React Request\n\n[![Travis build status](http://img.shields.io/travis/jamesplease/react-request.svg?style=flat)](https://travis-ci.org/jamesplease/react-request)\n[![npm version](https://img.shields.io/npm/v/react-request.svg)](https://www.npmjs.com/package/react-request)\n[![Test Coverage](https://coveralls.io/repos/github/jamesplease/react-request/badge.svg?branch=master)](https://coveralls.io/github/jamesplease/react-request?branch=master)\n[![gzip size](http://img.badgesize.io/https://unpkg.com/react-request/dist/react-request.min.js?compression=gzip)](https://unpkg.com/react-request/dist/react-request.min.js)\n\nDeclarative HTTP requests for React.\n\n### Motivation\n\nMaking a single HTTP request is not difficult to do in JavaScript. However,\ncomplex web applications often make many requests as the\nuser navigates through the app.\n\nFeatures such as request deduplication and response caching can often save the\ndeveloper of apps like these from headache and bugs. Although it is possible to\nimplement these features imperatively, it requires that you write a bit of\ncode, and that code can be tedious to test.\n\nA declarative API makes things a lot simpler for you, which is where React Request\ncomes in. React Request is a backend-agnostic, declarative solution for HTTP\nrequests in React, and its deduping and caching features are a delight to use.\n\n### Features\n\n✓ Uses the native [fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) API  \n✓ Smart [deduping of requests](./docs/guides/request-deduplication.md)  \n✓ Customizable [response caching](./docs/guides/response-caching.md)  \n✓ Integrates with external stores (such as [Redux](https://github.com/reactjs/redux))  \n✓ Reasonable footprint (~2kb gzipped)\n\n### Installation\n\nInstall using [npm](https://www.npmjs.com):\n\n```\nnpm install react-request\n```\n\nor [yarn](https://yarnpkg.com/):\n\n```\nyarn add react-request\n```\n\n### Documentation\n\n- [**Getting Started**](#getting-started)\n- [**API**](#api)\n  - [\\\u003cFetch/\\\u003e](#fetch-)\n    - [props](#props)\n    - [Arguments passed to the render prop](#propschildren)\n    - [Using `doFetch`](#using-dofetch)\n  - [fetchDedupe()](#fetchdedupe-input--init--dedupeoptions-)\n  - [getRequestKey()](#getrequestkey-url-method-body-responsetype-)\n  - [isRequestInFlight()](#isrequestinflight-requestkey-)\n  - [clearRequestCache()](#clearrequestcache)\n  - [clearResponseCache()](#clearresponsecache)\n- [**Guides ⇗**](./docs/guides/INDEX.md)\n  - [Response Caching ⇗](./docs/guides/response-caching.md)\n  - [Request Deduplication ⇗](./docs/guides/request-deduplication.md)\n  - [Request Keys ⇗](./docs/guides/request-keys.md)\n  - [Best Practices ⇗](./docs/guides/best-practices.md)\n  - [Using the `lazy` Prop ⇗](./docs/guides/using-the-lazy-prop.md)\n  - [Aborting ⇗](./docs/guides/aborting.md)\n  - [Differences with `fetch()` ⇗](./docs/guides/differences-with-fetch.md)\n  - [Differences with React Apollo ⇗](./docs/guides/differences-with-apollo.md)\n  - [Integration with Other Technologies ⇗](./docs/guides/integration-with-other-technologies.md)\n- [**Examples ⇗**](./docs/examples.md)\n- [**FAQ ⇗**](./docs/FAQ.md)\n- [**Roadmap ⇗**](./ROADMAP.md)\n- [**Acknowledgements**](#acknowledgements)\n\n### Getting Started\n\nHere's a quick look at what using React Request is like:\n\n```jsx\nimport React, { Component } from 'react';\nimport { Fetch } from 'react-request';\n\nclass App extends Component {\n  render() {\n    return (\n      \u003cFetch url=\"https://jsonplaceholder.typicode.com/posts/1\"\u003e\n        {({ fetching, failed, data }) =\u003e {\n          if (fetching) {\n            return \u003cdiv\u003eLoading data...\u003c/div\u003e;\n          }\n\n          if (failed) {\n            return \u003cdiv\u003eThe request did not succeed.\u003c/div\u003e;\n          }\n\n          if (data) {\n            return (\n              \u003cdiv\u003e\n                \u003cdiv\u003ePost ID: {data.id}\u003c/div\u003e\n                \u003cdiv\u003ePost Title: {data.title}\u003c/div\u003e\n              \u003c/div\u003e\n            );\n          }\n\n          return null;\n        }}\n      \u003c/Fetch\u003e\n    );\n  }\n}\n```\n\nNeed to make multiple requests? You can use any tool that you would like that\nallows you to \"compose\" [render prop components](https://reactjs.org/docs/render-props.html) together. This example\nuses [React Composer](https://github.com/jamesplease/react-composer):\n\n```jsx\nimport React, { Component } from 'react';\nimport Composer from 'react-composer';\n\nclass App extends Component {\n  render() {\n    return (\n      \u003cComposer\n        components={[\n          \u003cFetch url=\"https://jsonplaceholder.typicode.com/posts/1\" /\u003e,\n          \u003cFetch\n            url=\"https://jsonplaceholder.typicode.com/posts/1\"\n            method=\"DELETE\"\n          /\u003e,\n        ]}\u003e\n        {([readPost, deletePost]) =\u003e {\n          return (\n            \u003cdiv\u003e\n              {readPost.fetching \u0026\u0026 'Loading post 1'}\n              {!readPost.fetching \u0026\u0026 'Post 1 is not being fetched'}\n              \u003cbutton onClick={() =\u003e deletePost.doFetch()}\u003e\n                Delete Post 1\n              \u003c/button\u003e\n            \u003c/div\u003e\n          );\n        }}\n      \u003c/Composer\u003e\n    );\n  }\n}\n```\n\nThese examples just scratch the surface of what React Request can do for you.\nCheck out the API reference below, or\n[read the guides](https://github.com/jamesplease/react-request/blob/master/docs/guides/INDEX.md),\nto learn more.\n\n### API\n\n#### `\u003cFetch /\u003e`\n\nA component for making a single HTTP request. This is the export from this library that you will use\nmost frequently.\n\n```jsx\nimport { Fetch } from 'react-request';\n```\n\n##### Props\n\nThe `\u003cFetch/\u003e` components accepts every value of `init` and `input`\nfrom the\n[`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch)\nAPI as a prop, in addition to a few other things.\n\nThe complete list of props is:\n\n| Prop                                 | Default value    | Description                                                                                                                                                                                                                                |\n| ------------------------------------ | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |\n| url                                  |                  | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). The URL to send the request to                                                                                                         |\n| method                               | `'GET'`          | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). The HTTP method to use                                                                                                                 |\n| body                                 |                  | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). The request body to send along with the request                                                                                        |\n| credentials                          |                  | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). The request credentials you want to use for the request: `omit`, `same-origin`, or `include.`                                          |\n| headers                              |                  | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). Headers to send along with the request                                                                                                 |\n| [children](#propschildren)           |                  | A function that is called with a single argument containing information about the request. Learn more.                                                                                                                                     |\n| [lazy](#propslazy)                   | _Varies_         | Whether or not the request is made when the component mounts.                                                                                                                                                                              |\n| [beforeFetch](#propsbeforefetch)     |                  | A function called before a network request is made.                                                                                                                                                                                        |\n| [afterFetch](#propsafterfetch)       |                  | A function that is only called after a network request is made.                                                                                                                                                                            |\n| [onResponse](#propsonresponse)       |                  | A function called anytime a response is received, whether from the network or cache.                                                                                                                                                       |\n| [transformData](#propstransformdata) |                  | A function that is called with the body of the response, allowing you to transform it.                                                                                                                                                     |\n| [responseType](#propsresponsetype)   | `'json'`         | Whether or not the request is made when the component mounts.                                                                                                                                                                              |\n| [requestName](#propsrequestname)     |                  | A name to give this request, which can be useful for debugging.                                                                                                                                                                            |\n| [fetchPolicy](#propsfetchpolicy)     |                  | The cache strategy to use.                                                                                                                                                                                                                 |\n| [cacheResponse](#propscacheresponse) | _Varies_         | Whether or not to cache the response for this request.                                                                                                                                                                                     |\n| [dedupe](#propsdedupe)               | `true`           | Whether or not to dedupe this request.                                                                                                                                                                                                     |\n| [requestKey](#propsrequestkey)       | _Generated_      | A key that is used for deduplication and response caching.                                                                                                                                                                                 |\n| mode                                 |                  | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). The mode you want to use for the request                                                                                               |\n| cache                                |                  | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). The browser's cache mode you want to use for the request                                                                               |\n| redirect                             |                  | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). The redirect mode to use                                                                                                               |\n| referrer                             | `'about:client'` | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). The referrer to use for the request                                                                                                    |\n| referrerPolicy                       | `''`             | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). Specifies the value of the referer HTTP header.                                                                                        |\n| integrity                            | `''`             | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). Contains the [subresource integrity](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity) value of the request |\n| keepalive                            |                  | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). Can be used to allow the request to outlive the page                                                                                   |\n| signal                               |                  | From [`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch). An AbortSignal object instance                                                                                                         |\n\nTo learn more about the valid options for the props that come from `fetch`, refer to the\n[`fetch()`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch)\ndocumentation.\n\nThe following example demonstrates some of the most commonly-used props that come from `fetch()`:\n\n```jsx\n\u003cFetch\n  url=\"/posts/2\"\n  method=\"patch\"\n  credentials=\"same-origin\"\n  headers={{\n    'csrf-token': myCsrfToken,\n  }}\n  body={JSON.stringify({ title: 'New post' })}\u003e\n  {({ doFetch }) =\u003e {\n    \u003cbutton onClick={() =\u003e doFetch()}\u003eUpdate Post\u003c/button\u003e;\n  }}\n\u003c/Fetch\u003e\n```\n\nIn addition to the `fetch()` props, there are a number of other useful props.\n\n##### `props.children`\n\n`children` is the [render prop](https://reactjs.org/docs/render-props.html) of this component.\nIt is called with one argument, `result`, an object with the following keys:\n\n| Key         | Type     | Description                                                                                                                                                                                                                                                                                                             |\n| ----------- | -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| fetching    | Boolean  | A Boolean representing whether or not a request is currently in flight for this component                                                                                                                                                                                                                               |\n| failed      | Boolean  | A Boolean representing whether or not the request failed for any reason. This includes network errors and status codes that are greater than or equal to`400`.                                                                                                                                                          |\n| error       | Object   | An error object representing a network error occurred. Note that HTTP \"error\" status codes do not cause errors; only failed or aborted network requests do. For more, see the [\"Using Fetch\" MDN guide](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#Checking_that_the_fetch_was_successful). |\n| response    | Object   | An instance of [Response](https://developer.mozilla.org/en-US/docs/Web/API/Response). The [`body`](https://developer.mozilla.org/en-US/docs/Web/API/Body) will already be read, and made available to you as `response.data`.                                                                                           |\n| data        | Object   | The data returned in `response`. This will be different from `response.data` if a `transformData` prop was passed to `\u003cFetch/\u003e`.                                                                                                                                                                                        |\n| doFetch     | Function | A function that allows you to manually make the HTTP request. [Read more.](#using-dofetch)                                                                                                                                                                                                                              |\n| url         | String   | The URL that was passed as a prop to `\u003cFetch /\u003e`                                                                                                                                                                                                                                                                        |\n| requestName | String   | The name of the request (see `requestName` below)                                                                                                                                                                                                                                                                       |\n| requestKey  | String   | The [request key](./docs/guides/request-keys.md) of the request                                                                                                                                                                                                                                                         |\n\n###### Using doFetch\n\nThere are three common use cases for the `doFetch` prop:\n\n- You can use it to \"refresh\" the data by making a follow-up request for read requests\n- You can use it to retry the request if there is any sort of error\n- You must manually call this method to actually make the request anytime that the `lazy` prop\n  is passed as `true`.\n\n`doFetch` accepts one argument: `options`. Any of the `fetch()` options, such as `url`, `method`, and\n`body` are valid `options`. You may also specify a new `requestKey` if you are manually generating your\nown keys. This method allows you to customize the request from within the component based on the\ncomponent's state.\n\n`doFetch` returns a Promise that **always** resolves. It resolves to the same argument that the\n[`afterFetch`](#afterFetch) prop receives.\n\nIn the following example, we demonstrate how you can modify the request by passing options to `doFetch`.\n\n```jsx\n\u003cFetch {...props}\u003e\n  {({ doFetch }) =\u003e (\n    // You can pass options to `doFetch` to customize the request. All of the props from `fetch()`, such as `url`,\n    // `body`, and so on, are supported.\n    \u003cbutton onClick={() =\u003e doFetch({ body: this.getResponseBody() })}\u003e\n      Perform Action\n    \u003c/button\u003e\n  )}\n\u003c/Fetch\u003e\n```\n\n##### `props.lazy`\n\nWhether or not the request will be called when the component mounts. The default value\nis based on the request method that you use.\n\n| Method                   | Default value |\n| ------------------------ | ------------- |\n| GET, HEAD, OPTIONS       | `false`       |\n| POST, PUT, PATCH, DELETE | `true`        |\n\n```jsx\n\u003cFetch url=\"/books\" lazy\u003e\n  {({ doFetch }) =\u003e {\n    \u003cbutton onClick={() =\u003e doFetch()}\u003eLoad the books\u003c/button\u003e;\n  }}\n\u003c/Fetch\u003e\n```\n\n##### `props.beforeFetch`\n\nA function that is called just before a network request is initiated. It is called\nwith one argument, an object with the following keys:\n\n- `url`: The URL of the request\n- `init`: The second argument passed to `global.fetch()`, which specifies things\n  such as the body, method, and so on\n- `requestKey`: Either the computed request key, or the value of the\n  `requestKey` prop\n\nThis feature is useful for analytics, or syncing response data with a data store such\nas [Redux](https://github.com/reactjs/redux/).\n\n\u003e Note: This function is not called when the component reads from the cache.\n\n##### `props.afterFetch`\n\nA function that is called anytime that a network response is received. It is called\nwith one argument, an object with the following keys:\n\n- `url`: The URL of the request\n- `init`: The second argument passed to `global.fetch()`, which specifies things\n  such as the body, method, and so on\n- `requestKey`: Either the computed request key, or the value of the\n  `requestKey` prop\n- `response`: The response that was received from the HTTP request\n- `data`: The transformed data from the response. This will be different from\n  `response.data` if a `transformData` function was passed as a prop to `\u003cFetch/\u003e`.\n- `error`: An error returned from the HTTP request\n- `didUnmount`: A Boolean representing whether or not the component has unmounted\n\nThis can be used for analytics or syncing response data with a data store such\nas [Redux](https://github.com/reactjs/redux/).\n\n\u003e Note: This function is not called when the component reads from the cache.\n\n##### `props.onResponse`\n\nA function that is called every time a response is received, whether that\nresponse is from the cache or from a network request. Receives two arguments:\n`error` and `response`.\n\n```jsx\n\u003cFetch\n  url=\"/posts/2\"\n  onResponse={(error, response) =\u003e {\n    if (error) {\n      console.log('Ruh roh', error);\n    } else {\n      console.log('Got a response!', response);\n    }\n  }}\u003e\n  {() =\u003e {\n    \u003cdiv\u003eHello\u003c/div\u003e;\n  }}\n\u003c/Fetch\u003e\n```\n\n##### `props.transformData`\n\nA function that is called with the data returned from the response. You can use this\nhook to transform the data before it is passed into `children`.\n\n```jsx\n\u003cFetch\n  url=\"/posts/2\"\n  transformData={data =\u003e data.post\u003e\n  {({ fetching, error, response, data }) =\u003e {\n    \u003cdiv\u003e\n      {fetching \u0026\u0026 ('Loading...')}\n      {error \u0026\u0026 ('There was an error.')}\n      {!fetching \u0026\u0026 !error \u0026\u0026 response.status === 200 \u0026\u0026 (\n        \u003cdiv\u003e\n          \u003ch1\u003e{data.title}\u003c/h1\u003e\n          \u003cdiv\u003e{data.content}\u003c/div\u003e\n        \u003c/div\u003e\n      )}\n    \u003c/div\u003e\n  }}\n\u003c/Fetch\u003e\n```\n\n\u003e Note: `transformData` does not modify the value of `response.data`. The transformed data is\n\u003e made available to you in the [render prop argument](#children) under the `data` key.\n\n##### `props.responseType`\n\nThe content type of the response body. Defaults to `\"json\"` unless the response has a 204 status code,\nin which case it will be `\"text\"` instead. Valid values are any of the methods on\n[Body](https://developer.mozilla.org/en-US/docs/Web/API/Body).\n\nAlternatively, you may specify a function that returns a string. The function will be called with one\nargument: `response`. This allows you to dynamically specify the response type based on information\nabout the response, such as its status code.\n\n```jsx\n// If you have an endpoint that just returns raw text, you could, for instance, convert it into\n// an object using `responseType` and `transformData`.\n\u003cFetch\n  url=\"/countries/2\"\n  responseType=\"text\"\n  transformData={countryName =\u003e {\n    return {\n      countryName,\n    };\n  }}\u003e\n  {({ data }) =\u003e {\n    if (data) {\n      return \u003cdiv\u003e{data.countryName}\u003c/div\u003e;\n    }\n\n    return null;\n  }}\n\u003c/Fetch\u003e\n```\n\nIf the response body cannot be parsed as the `responseType` that you specify, then `data` will\nbe set to `null`.\n\n##### `props.requestName`\n\nA name to give this request, which can help with debugging purposes. The request name is\nanalogous to a function name in JavaScript. Although we could use anonymous functions\neverywhere, we tend to give them names to help humans read and debug the code.\n\n```jsx\n\u003cFetch url={`/posts/${postId}`} requestName=\"readPost\" /\u003e\n```\n\n\u003e Note: This feature is analogous to the [operation name](http://graphql.org/learn/queries/#operation-name) in GraphQL.\n\n##### `props.fetchPolicy`\n\nThis determines how the request interacts with the cache. Valid options are:\n\n- `\"cache-first\"`\n- `\"cache-and-network\"`\n- `\"network-only\"`\n- `\"cache-only\"`\n\nFor documentation on what each of these values do, refer to the [response caching guide](./docs/guides/response-caching.md).\n\nThe default value of this prop is based on the value of the `method` prop that you pass to `\u003cFetch/\u003e`.\n\n| Method                   | Default value    |\n| ------------------------ | ---------------- |\n| GET, HEAD, OPTIONS       | `\"cache-first\"`  |\n| POST, PUT, PATCH, DELETE | `\"network-only\"` |\n\n\u003e This prop behaves identically to the Apollo prop\n\u003e [with the same name](https://www.apollographql.com/docs/react/basics/queries.html#graphql-config-options-fetchPolicy).\n\n##### `props.cacheResponse`\n\nWhether or not the response will be cached. The default value is based on the value of the `method` prop that you pass\nto `\u003cFetch/\u003e`.\n\n| Method                   | Default value |\n| ------------------------ | ------------- |\n| GET, HEAD, OPTIONS       | `true`        |\n| POST, PUT, PATCH, DELETE | `false`       |\n\nFor documentation on this prop, refer to the [response caching guide](./docs/guides/response-caching.md).\n\n##### `props.dedupe`\n\nA Boolean value representing whether or not the request should be\n[deduplicated](./docs/guides/request-deduplication.md).\nDefaults to `true`.\n\n##### `props.requestKey`\n\nA string that is used to control the request deduplication and response caching features. By default,\na key is generated for you. Specifying a custom key is an advanced feature that you may not need.\n\nFor more, see the [request key](https://github.com/jamesplease/react-request/blob/master/docs/guides/request-keys.md)\nguide.\n\n---\n\nThe rest of the API documentation describes the other named exports from the `react-request` package. Typically,\nyou won't need to use these, but they are available should you need them.\n\n#### `fetchDedupe( input [, init] [, dedupeOptions] )`\n\nThis is the `fetchDedupe` export from the [Fetch Dedupe](https://github.com/jamesplease/fetch-dedupe)\nlibrary. Fetch Dedupe powers the request deduplication in React Request.\n\nWhenever you need to make a standalone HTTP request outside of the\n`\u003cFetch /\u003e` component, then you can use this with confidence that you won't send a\nduplicate request.\n\nFor more, refer to [the documentation of fetch-dedupe](https://github.com/jamesplease/fetch-dedupe).\n\n#### `getRequestKey({ url, method, body, responseType })`\n\nGenerates a request key. All of the values are optional. You typically never need to use this, as request\nkeys are generated automatically for you when you use React Request or Fetch Dedupe.\n\nThis method comes from [`fetch-dedupe`](https://github.com/jamesplease/fetch-dedupe).\n\n#### `isRequestInFlight( requestKey )`\n\nReturn a Boolean representing if a request for `requestKey` is in flight or not.\n\nThis method comes from [`fetch-dedupe`](https://github.com/jamesplease/fetch-dedupe).\n\n#### `clearRequestCache()`\n\nWipes the cache of deduped requests. Mostly useful for testing.\n\nThis method comes from [`fetch-dedupe`](https://github.com/jamesplease/fetch-dedupe).\n\n\u003e Note: this method is not safe to use in application code.\n\n#### `clearResponseCache()`\n\nWipes the cache of cached responses. Mostly useful for testing.\n\n\u003e Note: this method is not safe to use in application code.\n\n### Acknowledgements\n\nThis library was inspired by [Apollo](https://www.apollographql.com). The\nlibrary [Holen](https://github.com/tkh44/holen) was referenced during the\ncreation of this library.\n","funding_links":[],"categories":["Components","JavaScript"],"sub_categories":["Data"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjamesplease%2Freact-request","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjamesplease%2Freact-request","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjamesplease%2Freact-request/lists"}