1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-04 23:14:56 +01:00
metamask-extension/ui/app/helpers/utils/fetch-with-cache.js
Mark Stacey 5ee1291662
Prevent accidental use of globals (#8340)
Previously all browser globals were allowed to be used anywhere by
ESLint because we had set the `env` property to `browser` in the ESLint
config. This has made it easy to accidentally use browser globals
(e.g. #8338), so it has been removed. Instead we now have a short list
of allowed globals.

All browser globals are now accessed as properties on `window`.

Unfortunately this change resulted in a few different confusing unit
test errors, as some of our unit tests setup assumed that a particular
global would be used via `window` or `global`. In particular,
`window.fetch` didn't work correctly because it wasn't patched by the
AbortController polyfill (only `global.fetch` was being patched).
The `jsdom-global` package we were using complicated matters by setting
all of the JSDOM `window` properties directly on `global`, overwriting
the `AbortController` for example.

The `helpers.js` test setup module has been simplified somewhat by
removing `jsdom-global` and constructing the JSDOM instance manually.
The JSDOM window is set on `window`, and a few properties are set on
`global` as well as needed by various dependencies. `node-fetch` and
the AbortController polyfill/patch now work as expected as well,
though `fetch` is only available on `window` now.
2020-04-15 14:23:27 -03:00

54 lines
1.8 KiB
JavaScript

import {
loadLocalStorageData,
saveLocalStorageData,
} from '../../../lib/local-storage-helpers'
import fetchWithTimeout from '../../../../app/scripts/lib/fetch-with-timeout'
const fetchWithCache = async (url, fetchOptions = {}, { cacheRefreshTime = 360000, timeout = 30000 } = {}) => {
if (fetchOptions.body || (fetchOptions.method && fetchOptions.method !== 'GET')) {
throw new Error('fetchWithCache only supports GET requests')
}
if (!(fetchOptions.headers instanceof window.Headers)) {
fetchOptions.headers = new window.Headers(fetchOptions.headers)
}
if (
fetchOptions.headers &&
fetchOptions.headers.has('Content-Type') &&
fetchOptions.headers.get('Content-Type') !== 'application/json'
) {
throw new Error('fetchWithCache only supports JSON responses')
}
const currentTime = Date.now()
const cachedFetch = loadLocalStorageData('cachedFetch') || {}
const { cachedResponse, cachedTime } = cachedFetch[url] || {}
if (cachedResponse && currentTime - cachedTime < cacheRefreshTime) {
return cachedResponse
} else {
fetchOptions.headers.set('Content-Type', 'application/json')
const _fetch = timeout ?
fetchWithTimeout({ timeout }) :
window.fetch
const response = await _fetch(url, {
referrerPolicy: 'no-referrer-when-downgrade',
body: null,
method: 'GET',
mode: 'cors',
...fetchOptions,
})
if (!response.ok) {
throw new Error(`Fetch failed with status '${response.status}': '${response.statusText}'`)
}
const responseJson = await response.json()
const cacheEntry = {
cachedResponse: responseJson,
cachedTime: currentTime,
}
cachedFetch[url] = cacheEntry
saveLocalStorageData(cachedFetch, 'cachedFetch')
return responseJson
}
}
export default fetchWithCache