|
| 1 | +/** |
| 2 | + * Copyright (c) Facebook, Inc. and its affiliates. |
| 3 | + * |
| 4 | + * This source code is licensed under the MIT license found in the |
| 5 | + * LICENSE file in the root directory of this source tree. |
| 6 | + * |
| 7 | + * @flow |
| 8 | + */ |
| 9 | + |
| 10 | +import { |
| 11 | + enableCache, |
| 12 | + enableFetchInstrumentation, |
| 13 | +} from 'shared/ReactFeatureFlags'; |
| 14 | + |
| 15 | +import ReactCurrentCache from './ReactCurrentCache'; |
| 16 | + |
| 17 | +function createFetchCache(): Map<string, Array<any>> { |
| 18 | + return new Map(); |
| 19 | +} |
| 20 | + |
| 21 | +const simpleCacheKey = '["GET",[],null,"follow",null,null,null,null]'; // generateCacheKey(new Request('https://blank')); |
| 22 | + |
| 23 | +function generateCacheKey(request: Request): string { |
| 24 | + // We pick the fields that goes into the key used to dedupe requests. |
| 25 | + // We don't include the `cache` field, because we end up using whatever |
| 26 | + // caching resulted from the first request. |
| 27 | + // Notably we currently don't consider non-standard (or future) options. |
| 28 | + // This might not be safe. TODO: warn for non-standard extensions differing. |
| 29 | + // IF YOU CHANGE THIS UPDATE THE simpleCacheKey ABOVE. |
| 30 | + return JSON.stringify([ |
| 31 | + request.method, |
| 32 | + Array.from(request.headers.entries()), |
| 33 | + request.mode, |
| 34 | + request.redirect, |
| 35 | + request.credentials, |
| 36 | + request.referrer, |
| 37 | + request.referrerPolicy, |
| 38 | + request.integrity, |
| 39 | + ]); |
| 40 | +} |
| 41 | + |
| 42 | +if (enableCache && enableFetchInstrumentation) { |
| 43 | + if (typeof fetch === 'function') { |
| 44 | + const originalFetch = fetch; |
| 45 | + try { |
| 46 | + // eslint-disable-next-line no-native-reassign |
| 47 | + fetch = function fetch( |
| 48 | + resource: URL | RequestInfo, |
| 49 | + options?: RequestOptions, |
| 50 | + ) { |
| 51 | + const dispatcher = ReactCurrentCache.current; |
| 52 | + if (!dispatcher) { |
| 53 | + // We're outside a cached scope. |
| 54 | + return originalFetch(resource, options); |
| 55 | + } |
| 56 | + if ( |
| 57 | + options && |
| 58 | + options.signal && |
| 59 | + options.signal !== dispatcher.getCacheSignal() |
| 60 | + ) { |
| 61 | + // If we're passed a signal that is not ours, then we assume that |
| 62 | + // someone else controls the lifetime of this object and opts out of |
| 63 | + // caching. It's effectively the opt-out mechanism. |
| 64 | + // Ideally we should be able to check this on the Request but |
| 65 | + // it always gets initialized with its own signal so we don't |
| 66 | + // know if it's supposed to override - unless we also override the |
| 67 | + // Request constructor. |
| 68 | + return originalFetch(resource, options); |
| 69 | + } |
| 70 | + // Normalize the Request |
| 71 | + let url: string; |
| 72 | + let cacheKey: string; |
| 73 | + if (typeof resource === 'string' && !options) { |
| 74 | + // Fast path. |
| 75 | + cacheKey = simpleCacheKey; |
| 76 | + url = resource; |
| 77 | + } else { |
| 78 | + // Normalize the request. |
| 79 | + const request = new Request(resource, options); |
| 80 | + if ( |
| 81 | + (request.method !== 'GET' && request.method !== 'HEAD') || |
| 82 | + // $FlowFixMe: keepalive is real |
| 83 | + request.keepalive |
| 84 | + ) { |
| 85 | + // We currently don't dedupe requests that might have side-effects. Those |
| 86 | + // have to be explicitly cached. We assume that the request doesn't have a |
| 87 | + // body if it's GET or HEAD. |
| 88 | + // keepalive gets treated the same as if you passed a custom cache signal. |
| 89 | + return originalFetch(resource, options); |
| 90 | + } |
| 91 | + cacheKey = generateCacheKey(request); |
| 92 | + url = request.url; |
| 93 | + } |
| 94 | + const cache = dispatcher.getCacheForType(createFetchCache); |
| 95 | + const cacheEntries = cache.get(url); |
| 96 | + let match; |
| 97 | + if (cacheEntries === undefined) { |
| 98 | + // We pass the original arguments here in case normalizing the Request |
| 99 | + // doesn't include all the options in this environment. |
| 100 | + match = originalFetch(resource, options); |
| 101 | + cache.set(url, [cacheKey, match]); |
| 102 | + } else { |
| 103 | + // We use an array as the inner data structure since it's lighter and |
| 104 | + // we typically only expect to see one or two entries here. |
| 105 | + for (let i = 0, l = cacheEntries.length; i < l; i += 2) { |
| 106 | + const key = cacheEntries[i]; |
| 107 | + const value = cacheEntries[i + 1]; |
| 108 | + if (key === cacheKey) { |
| 109 | + match = value; |
| 110 | + // I would've preferred a labelled break but lint says no. |
| 111 | + return match.then(response => response.clone()); |
| 112 | + } |
| 113 | + } |
| 114 | + match = originalFetch(resource, options); |
| 115 | + cacheEntries.push(cacheKey, match); |
| 116 | + } |
| 117 | + // We clone the response so that each time you call this you get a new read |
| 118 | + // of the body so that it can be read multiple times. |
| 119 | + return match.then(response => response.clone()); |
| 120 | + }; |
| 121 | + // We don't expect to see any extra properties on fetch but if there are any, |
| 122 | + // copy them over. Useful for extended fetch environments or mocks. |
| 123 | + Object.assign(fetch, originalFetch); |
| 124 | + } catch (error) { |
| 125 | + // Log even in production just to make sure this is seen if only prod is frozen. |
| 126 | + // eslint-disable-next-line react-internal/no-production-logging |
| 127 | + console.warn( |
| 128 | + 'React was unable to patch the fetch() function in this environment. ' + |
| 129 | + 'Suspensey APIs might not work correctly as a result.', |
| 130 | + ); |
| 131 | + } |
| 132 | + } |
| 133 | +} |
0 commit comments