RetryPlugin
Introduction
Resource retry plugin is used to retry resources when they fail to load, thereby increasing the success rate of resource loading. In Module Federation, we provide the retry plugin RetryPlugin
to increase the retry mechanism, which can improve the stability of the application.
Installation
This RetryPlugin
is Provided by the @module-federation/retry-plugin
package
npm add @module-federation/retry-plugin --save
Usage
RetryPlugin
is a runtime plugin, we can register this plugin through the runtimePlugin
of the build plugin or register it at runtime and configure retry parameters and retry logic, etc.:
NOTE
Note: Choose either of the two ways to register the build plugin and do not register it repeatedly
Method1: Register in the build plugin
import { ModuleFederationPlugin } from '@module-federation/enhanced/rspack';
import { defineConfig } from '@rsbuild/core';
export default defineConfig({
tools: {
rspack: (config, { appendPlugins }) => {
appendPlugins([
new ModuleFederationPlugin({
...,
+ runtimePlugins: [
+ path.join(__dirname, './src/runtime-plugin/retry.ts'),
+ ],
}),
]);
},
},
});
// ./src/runtime-plugin/retry.ts
import { RetryPlugin } from '@module-federation/retry-plugin';
const retryPlugin = () => RetryPlugin({
fetch: {
url: 'http://localhost:2008/not-exist-mf-manifest.json',
fallback: () => 'http://localhost:2001/mf-manifest.json',
},
script: {
// url: 'http://localhost:2008/not-exist-mf-manifest.json',
url: 'http://localhost:2001/static/js/async/src_App_tsx.js',
customCreateScript: (url: string, attrs: Record<string, string>) => {
let script = document.createElement('script');
script.src = `http://localhost:2011/static/js/async/src_App_tsx.js`;
script.setAttribute('loader-hoos', 'isTrue');
script.setAttribute('crossorigin', 'anonymous');
return script;
},
}
})
export default retryPlugin;
Method2: Register it at runtime
import {
RetryPlugin,
} from '@module-federation/retry-plugin';
init({
name: 'federation_consumer',
remotes: [],
plugins: [
RetryPlugin({
fetch: {
// the retry resource url
url: 'http://localhost:2008/not-exist-mf-manifest.json',
// after all retried failed, set a fallback function to guarantee a fallback resource
fallback: () => 'http://localhost:2001/mf-manifest.json',
},
script: {
// the retry resource url
url: 'http://localhost:2001/static/js/async/src_App_tsx.js',
// if you need to custom create script element, pass `customCreateScript` and plugin will use customCreateScript to create script element
customCreateScript: (url: string, attrs: Record<string, string>) => {
let script = document.createElement('script');
script.src = `http://localhost:2011/static/js/async/src_App_tsx.js`;
script.setAttribute('loader-hoos', 'isTrue');
script.setAttribute('crossorigin', 'anonymous');
return script;
},
},
}),
],
});
the resource that needs to be retried is divided into two types: the fetch
type and the script
type, and we control the retry logic of these two resource types through the fetch
parameter and the script
parameter, respectively.
Type
const RetryPlugin: (params: RetryPluginParams) => FederationRuntimePlugin;
type RetryPluginParams = {
fetch?: FetchWithRetryOptions; // fetch retry options
script?: ScriptWithRetryOptions; // script retry options
};
type FetchWithRetryOptions = {
url?: string;
options?: RequestInit;
retryTimes?: number;
retryDelay?: number;
fallback?: () => string;
}
type ScriptWithRetryOptions = {
url?: string;
attrs?: Record<string, string>;
retryTimes?: number;
customCreateScript?: CreateScriptFunc;
}
RetryPluginParams type description
RetryPluginParams
is the parameter type used to configure RetryPlugin
, which contains retry options for two types of resources: fetch
and script
.
Properties
FetchWithRetryOptions type description
FetchWithRetryOptions
is the type used to configure the retry options for fetch type resources.
属性
Properties
-
url:
string
- Optional. When not set, all failed resources will default to retry logic.
- The URL of the resource to be retried.
-
options:
RequestInit
- Optional.
- The request options for the fetch request.
-
retryTimes:
number
- Optional.
- The number of retry attempts. Defaults to 3.
-
retryDelay:
number
- Optional.
- The delay between retry attempts in milliseconds. Defaults to 1000.
-
fallback:
ScriptWithRetryOptions Type Description
ScriptWithRetryOptions
is the type used to configure the retry options for script type resources.
Properties
-
url:
string
- Optional. When not set, all failed resources will default to retry logic.
- The URL of the resource to be retried.
-
attrs:
Record<string, string>
- Optional
- The attributes to be passed to the script element.
-
retryTimes:
number
- Optional
- The number of retry attempts. Defaults to 3.
-
retryDelay:
number
- Optional
- The delay between retry attempts in milliseconds. Defaults to 1000.
-
customCreateScript:
CreateScriptFunc
- Optional.
- A custom function to create the script element.