@modern-js/plugin-data-loader 2.69.4 → 3.0.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/cli/createRequest.js +122 -141
- package/dist/cjs/cli/data.js +129 -148
- package/dist/cjs/cli/generateClient.js +52 -52
- package/dist/cjs/cli/loader.js +63 -62
- package/dist/cjs/common/constants.js +41 -31
- package/dist/cjs/runtime/errors.js +84 -89
- package/dist/cjs/runtime/index.js +143 -155
- package/dist/cjs/runtime/response.js +66 -77
- package/dist/esm/cli/createRequest.mjs +93 -0
- package/dist/esm/cli/data.mjs +111 -0
- package/dist/esm/cli/generateClient.mjs +22 -0
- package/dist/esm/cli/loader.mjs +34 -0
- package/dist/esm/common/constants.mjs +4 -0
- package/dist/esm/runtime/errors.mjs +52 -0
- package/dist/esm/runtime/index.mjs +114 -0
- package/dist/esm/runtime/response.mjs +42 -0
- package/dist/esm-node/cli/createRequest.mjs +93 -0
- package/dist/esm-node/cli/data.mjs +111 -0
- package/dist/esm-node/cli/generateClient.mjs +22 -0
- package/dist/esm-node/cli/loader.mjs +34 -0
- package/dist/esm-node/common/constants.mjs +4 -0
- package/dist/esm-node/runtime/errors.mjs +52 -0
- package/dist/esm-node/runtime/index.mjs +114 -0
- package/dist/esm-node/runtime/response.mjs +42 -0
- package/dist/types/cli/createRequest.d.ts +1 -2
- package/dist/types/cli/loader.d.ts +2 -2
- package/dist/types/runtime/errors.d.ts +1 -1
- package/dist/types/runtime/response.d.ts +1 -1
- package/package.json +22 -26
- package/rslib.config.mts +4 -0
- package/rstest.config.ts +18 -0
- package/dist/esm/cli/createRequest.js +0 -297
- package/dist/esm/cli/data.js +0 -491
- package/dist/esm/cli/generateClient.js +0 -21
- package/dist/esm/cli/loader.js +0 -93
- package/dist/esm/common/constants.js +0 -8
- package/dist/esm/runtime/errors.js +0 -90
- package/dist/esm/runtime/index.js +0 -191
- package/dist/esm/runtime/response.js +0 -107
- package/dist/esm-node/cli/createRequest.js +0 -126
- package/dist/esm-node/cli/data.js +0 -140
- package/dist/esm-node/cli/generateClient.js +0 -32
- package/dist/esm-node/cli/loader.js +0 -47
- package/dist/esm-node/common/constants.js +0 -8
- package/dist/esm-node/runtime/errors.js +0 -75
- package/dist/esm-node/runtime/index.js +0 -142
- package/dist/esm-node/runtime/response.js +0 -63
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
import { AbortedDeferredError, DeferredData } from "@modern-js/runtime-utils/browser";
|
|
2
|
+
const DEFERRED_VALUE_PLACEHOLDER_PREFIX = '__deferred_promise:';
|
|
3
|
+
async function parseDeferredReadableStream(stream) {
|
|
4
|
+
if (!stream) throw new Error('parseDeferredReadableStream requires stream argument');
|
|
5
|
+
let deferredData;
|
|
6
|
+
const deferredResolvers = {};
|
|
7
|
+
try {
|
|
8
|
+
const sectionReader = readStreamSections(stream);
|
|
9
|
+
const initialSectionResult = await sectionReader.next();
|
|
10
|
+
const initialSection = initialSectionResult.value;
|
|
11
|
+
if (!initialSection) throw new Error('no critical data');
|
|
12
|
+
const criticalData = JSON.parse(initialSection);
|
|
13
|
+
if ('object' == typeof criticalData && null !== criticalData) {
|
|
14
|
+
for (const [eventKey, value] of Object.entries(criticalData))if ('string' == typeof value && value.startsWith(DEFERRED_VALUE_PLACEHOLDER_PREFIX)) {
|
|
15
|
+
deferredData = deferredData || {};
|
|
16
|
+
deferredData[eventKey] = new Promise((resolve, reject)=>{
|
|
17
|
+
deferredResolvers[eventKey] = {
|
|
18
|
+
resolve: (value)=>{
|
|
19
|
+
resolve(value);
|
|
20
|
+
delete deferredResolvers[eventKey];
|
|
21
|
+
},
|
|
22
|
+
reject: (error)=>{
|
|
23
|
+
reject(error);
|
|
24
|
+
delete deferredResolvers[eventKey];
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
(async ()=>{
|
|
31
|
+
try {
|
|
32
|
+
for await (const section of sectionReader){
|
|
33
|
+
const [event, ...sectionDataStrings] = section.split(':');
|
|
34
|
+
const sectionDataString = sectionDataStrings.join(':');
|
|
35
|
+
const data = JSON.parse(sectionDataString);
|
|
36
|
+
if ('data' === event) {
|
|
37
|
+
for (const [key, value] of Object.entries(data))if (deferredResolvers[key]) deferredResolvers[key].resolve(value);
|
|
38
|
+
} else if ('error' === event) for (const [key, value] of Object.entries(data)){
|
|
39
|
+
const err = new Error(value.message);
|
|
40
|
+
err.stack = value.stack;
|
|
41
|
+
if (deferredResolvers[key]) deferredResolvers[key].reject(err);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
for (const [key, resolver] of Object.entries(deferredResolvers))resolver.reject(new AbortedDeferredError(`Deferred ${key} will never resolved`));
|
|
45
|
+
} catch (error) {
|
|
46
|
+
for (const resolver of Object.values(deferredResolvers))resolver.reject(error);
|
|
47
|
+
}
|
|
48
|
+
})();
|
|
49
|
+
return new DeferredData({
|
|
50
|
+
...criticalData,
|
|
51
|
+
...deferredData
|
|
52
|
+
});
|
|
53
|
+
} catch (error) {
|
|
54
|
+
for (const resolver of Object.values(deferredResolvers))resolver.reject(error);
|
|
55
|
+
throw error;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
async function* readStreamSections(stream) {
|
|
59
|
+
const reader = stream.getReader();
|
|
60
|
+
let buffer = [];
|
|
61
|
+
let sections = [];
|
|
62
|
+
let closed = false;
|
|
63
|
+
const encoder = new TextEncoder();
|
|
64
|
+
const decoder = new TextDecoder();
|
|
65
|
+
const readStreamSection = async ()=>{
|
|
66
|
+
if (sections.length > 0) return sections.shift();
|
|
67
|
+
while(!closed && 0 === sections.length){
|
|
68
|
+
const chunk = await reader.read();
|
|
69
|
+
if (chunk.done) {
|
|
70
|
+
closed = true;
|
|
71
|
+
break;
|
|
72
|
+
}
|
|
73
|
+
buffer.push(chunk.value);
|
|
74
|
+
try {
|
|
75
|
+
const bufferedString = decoder.decode(mergeArrays(...buffer));
|
|
76
|
+
const splitSections = bufferedString.split('\n\n');
|
|
77
|
+
if (splitSections.length >= 2) {
|
|
78
|
+
sections.push(...splitSections.slice(0, -1));
|
|
79
|
+
buffer = [
|
|
80
|
+
encoder.encode(splitSections.slice(-1).join('\n\n'))
|
|
81
|
+
];
|
|
82
|
+
}
|
|
83
|
+
if (sections.length > 0) break;
|
|
84
|
+
} catch {
|
|
85
|
+
continue;
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
if (sections.length > 0) return sections.shift();
|
|
89
|
+
if (buffer.length > 0) {
|
|
90
|
+
const bufferedString = decoder.decode(mergeArrays(...buffer));
|
|
91
|
+
sections = bufferedString.split('\n\n').filter((s)=>s);
|
|
92
|
+
buffer = [];
|
|
93
|
+
}
|
|
94
|
+
return sections.shift();
|
|
95
|
+
};
|
|
96
|
+
let section = await readStreamSection();
|
|
97
|
+
while(section){
|
|
98
|
+
yield section;
|
|
99
|
+
section = await readStreamSection();
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
function mergeArrays(...arrays) {
|
|
103
|
+
const out = new Uint8Array(arrays.reduce((total, arr)=>total + arr.length, 0));
|
|
104
|
+
let offset = 0;
|
|
105
|
+
for (const arr of arrays){
|
|
106
|
+
out.set(arr, offset);
|
|
107
|
+
offset += arr.length;
|
|
108
|
+
}
|
|
109
|
+
return out;
|
|
110
|
+
}
|
|
111
|
+
export { parseDeferredReadableStream };
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import path from "path";
|
|
2
|
+
const generateClient = ({ inline, action, routeId })=>{
|
|
3
|
+
let requestCode = "";
|
|
4
|
+
const requestCreatorPath = path.join(__dirname, './createRequest').replace('/cjs/cli/', '/esm/cli/').replace(/\\/g, '/');
|
|
5
|
+
const importCode = `
|
|
6
|
+
import { createRequest, createActionRequest } from '${requestCreatorPath}';
|
|
7
|
+
`;
|
|
8
|
+
requestCode = inline ? action ? `
|
|
9
|
+
export const loader = createRequest('${routeId}');
|
|
10
|
+
export const action = createActionRequest('${routeId}')
|
|
11
|
+
` : `
|
|
12
|
+
export const loader = createRequest('${routeId}');
|
|
13
|
+
` : `
|
|
14
|
+
export default createRequest('${routeId}');
|
|
15
|
+
`;
|
|
16
|
+
const generatedCode = `
|
|
17
|
+
${importCode}
|
|
18
|
+
${requestCode}
|
|
19
|
+
`;
|
|
20
|
+
return generatedCode;
|
|
21
|
+
};
|
|
22
|
+
export { generateClient };
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { promisify } from "util";
|
|
2
|
+
import { logger } from "@modern-js/utils/logger";
|
|
3
|
+
import { generateClient } from "./generateClient";
|
|
4
|
+
async function loader(source) {
|
|
5
|
+
this.cacheable();
|
|
6
|
+
const target = this._compiler?.options.target;
|
|
7
|
+
const shouldSkip = (compileTarget)=>target === compileTarget || Array.isArray(target) && target.includes(compileTarget);
|
|
8
|
+
if (shouldSkip('node') || shouldSkip('webworker') || shouldSkip('async-node')) return source;
|
|
9
|
+
const { resourceQuery } = this;
|
|
10
|
+
const options = resourceQuery.slice(1).split('&').reduce((pre, cur)=>{
|
|
11
|
+
const [key, value] = cur.split('=');
|
|
12
|
+
if (key && value) pre[key] = 'true' === value ? true : 'false' === value ? false : value;
|
|
13
|
+
return pre;
|
|
14
|
+
}, {});
|
|
15
|
+
if (!options.loaderId || options.retain) return source;
|
|
16
|
+
if (options.clientData) {
|
|
17
|
+
const readFile = promisify(this.fs.readFile);
|
|
18
|
+
try {
|
|
19
|
+
const clientDataPath = this.resourcePath.includes('.loader.') ? this.resourcePath.replace('.loader.', '.data.client.') : this.resourcePath.replace('.data.', '.data.client.');
|
|
20
|
+
this.addDependency(clientDataPath);
|
|
21
|
+
const clientDataContent = await readFile(clientDataPath);
|
|
22
|
+
return clientDataContent;
|
|
23
|
+
} catch (error) {
|
|
24
|
+
if ('development' === process.env.NODE_ENV) logger.error(`Failed to read the clientData file ${options.clientData}`);
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
const code = generateClient({
|
|
28
|
+
inline: options.inline,
|
|
29
|
+
action: options.action,
|
|
30
|
+
routeId: options.routeId
|
|
31
|
+
});
|
|
32
|
+
return code;
|
|
33
|
+
}
|
|
34
|
+
export { loader as default };
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { isRouteErrorResponse } from "@modern-js/runtime-utils/router";
|
|
2
|
+
function sanitizeError(error) {
|
|
3
|
+
if (error instanceof Error && 'development' !== process.env.NODE_ENV && 'test' !== process.env.NODE_ENV) {
|
|
4
|
+
const sanitized = new Error(error.message || 'Unexpected Server Error');
|
|
5
|
+
sanitized.stack = void 0;
|
|
6
|
+
return sanitized;
|
|
7
|
+
}
|
|
8
|
+
return error;
|
|
9
|
+
}
|
|
10
|
+
function sanitizeErrors(errors) {
|
|
11
|
+
return Object.entries(errors).reduce((acc, [routeId, error])=>Object.assign(acc, {
|
|
12
|
+
[routeId]: sanitizeError(error)
|
|
13
|
+
}), {});
|
|
14
|
+
}
|
|
15
|
+
function serializeError(error) {
|
|
16
|
+
const sanitized = sanitizeError(error);
|
|
17
|
+
return {
|
|
18
|
+
message: sanitized.message,
|
|
19
|
+
stack: sanitized.stack
|
|
20
|
+
};
|
|
21
|
+
}
|
|
22
|
+
function serializeErrors(errors) {
|
|
23
|
+
if (!errors) return null;
|
|
24
|
+
const entries = Object.entries(errors);
|
|
25
|
+
const serialized = {};
|
|
26
|
+
for (const [key, val] of entries)if (isRouteErrorResponse(val)) serialized[key] = {
|
|
27
|
+
...val,
|
|
28
|
+
__type: 'RouteErrorResponse'
|
|
29
|
+
};
|
|
30
|
+
else if (val instanceof Error) {
|
|
31
|
+
const sanitized = sanitizeError(val);
|
|
32
|
+
serialized[key] = {
|
|
33
|
+
message: sanitized.message,
|
|
34
|
+
stack: sanitized.stack,
|
|
35
|
+
__type: 'Error',
|
|
36
|
+
...'Error' !== sanitized.name ? {
|
|
37
|
+
__subType: sanitized.name
|
|
38
|
+
} : {}
|
|
39
|
+
};
|
|
40
|
+
} else serialized[key] = val;
|
|
41
|
+
return serialized;
|
|
42
|
+
}
|
|
43
|
+
function errorResponseToJson(errorResponse) {
|
|
44
|
+
return Response.json(serializeError(errorResponse.error || new Error('Unexpected Server Error')), {
|
|
45
|
+
status: errorResponse.status,
|
|
46
|
+
statusText: errorResponse.statusText,
|
|
47
|
+
headers: {
|
|
48
|
+
'X-Modernjs-Error': 'yes'
|
|
49
|
+
}
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
export { errorResponseToJson, sanitizeError, sanitizeErrors, serializeError, serializeErrors };
|
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
import { transformNestedRoutes } from "@modern-js/runtime-utils/browser";
|
|
2
|
+
import { createRequestContext, reporterCtx, storage } from "@modern-js/runtime-utils/node";
|
|
3
|
+
import { DEFERRED_SYMBOL, createStaticHandler, isRouteErrorResponse } from "@modern-js/runtime-utils/router";
|
|
4
|
+
import { matchEntry } from "@modern-js/runtime-utils/server";
|
|
5
|
+
import { time } from "@modern-js/runtime-utils/time";
|
|
6
|
+
import { parseHeaders } from "@modern-js/runtime-utils/universal/request";
|
|
7
|
+
import { isPlainObject } from "@modern-js/utils/lodash";
|
|
8
|
+
import { LOADER_REPORTER_NAME } from "@modern-js/utils/universal/constants";
|
|
9
|
+
import { CONTENT_TYPE_DEFERRED, LOADER_ID_PARAM } from "../common/constants";
|
|
10
|
+
import { errorResponseToJson, serializeError } from "./errors";
|
|
11
|
+
import { createDeferredReadableStream } from "./response";
|
|
12
|
+
const redirectStatusCodes = new Set([
|
|
13
|
+
301,
|
|
14
|
+
302,
|
|
15
|
+
303,
|
|
16
|
+
307,
|
|
17
|
+
308
|
|
18
|
+
]);
|
|
19
|
+
function isRedirectResponse(status) {
|
|
20
|
+
return redirectStatusCodes.has(status);
|
|
21
|
+
}
|
|
22
|
+
function isResponse(value) {
|
|
23
|
+
return null != value && 'number' == typeof value.status && 'string' == typeof value.statusText && 'object' == typeof value.headers && void 0 !== value.body;
|
|
24
|
+
}
|
|
25
|
+
function convertModernRedirectResponse(headers, basename) {
|
|
26
|
+
const newHeaders = new Headers(headers);
|
|
27
|
+
let redirectUrl = headers.get('Location');
|
|
28
|
+
if ('/' !== basename) redirectUrl = redirectUrl.replace(basename, '');
|
|
29
|
+
newHeaders.set('X-Modernjs-Redirect', redirectUrl);
|
|
30
|
+
newHeaders.delete('Location');
|
|
31
|
+
return new Response(null, {
|
|
32
|
+
status: 204,
|
|
33
|
+
headers: newHeaders
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
function hasFileExtension(pathname) {
|
|
37
|
+
const lastSegment = pathname.split('/').pop() || '';
|
|
38
|
+
const dotIndex = lastSegment.lastIndexOf('.');
|
|
39
|
+
if (-1 === dotIndex) return false;
|
|
40
|
+
const extension = lastSegment.substring(dotIndex).toLowerCase();
|
|
41
|
+
return '.html' !== extension;
|
|
42
|
+
}
|
|
43
|
+
const handleRequest = async ({ request, serverRoutes, routes: routesConfig, context, onTiming })=>{
|
|
44
|
+
const url = new URL(request.url);
|
|
45
|
+
const routeId = url.searchParams.get(LOADER_ID_PARAM);
|
|
46
|
+
if (hasFileExtension(url.pathname)) return;
|
|
47
|
+
const entry = matchEntry(url.pathname, serverRoutes);
|
|
48
|
+
if (!routeId || !entry) return;
|
|
49
|
+
const basename = entry.urlPath;
|
|
50
|
+
const end = time();
|
|
51
|
+
const { reporter, loaderContext, monitors } = context;
|
|
52
|
+
const headersData = parseHeaders(request);
|
|
53
|
+
const activeDeferreds = new Map();
|
|
54
|
+
return storage.run({
|
|
55
|
+
headers: headersData,
|
|
56
|
+
monitors,
|
|
57
|
+
request,
|
|
58
|
+
activeDeferreds
|
|
59
|
+
}, async ()=>{
|
|
60
|
+
const routes = transformNestedRoutes(routesConfig);
|
|
61
|
+
const { queryRoute } = createStaticHandler(routes, {
|
|
62
|
+
basename
|
|
63
|
+
});
|
|
64
|
+
const requestContext = createRequestContext(loaderContext);
|
|
65
|
+
requestContext.set(reporterCtx, reporter);
|
|
66
|
+
let response;
|
|
67
|
+
try {
|
|
68
|
+
response = await queryRoute(request, {
|
|
69
|
+
routeId,
|
|
70
|
+
requestContext
|
|
71
|
+
});
|
|
72
|
+
if (isResponse(response) && isRedirectResponse(response.status)) response = convertModernRedirectResponse(response.headers, basename);
|
|
73
|
+
else if (isPlainObject(response) && (DEFERRED_SYMBOL in response || activeDeferreds.get(routeId))) {
|
|
74
|
+
let deferredData;
|
|
75
|
+
deferredData = DEFERRED_SYMBOL in response ? response[DEFERRED_SYMBOL] : activeDeferreds.get(routeId);
|
|
76
|
+
const body = createDeferredReadableStream(deferredData, request.signal);
|
|
77
|
+
const init = deferredData.init || {};
|
|
78
|
+
if (init.status && isRedirectResponse(init.status)) {
|
|
79
|
+
if (!init.headers) throw new Error('redirect response includes no headers');
|
|
80
|
+
response = convertModernRedirectResponse(new Headers(init.headers), basename);
|
|
81
|
+
} else {
|
|
82
|
+
const headers = new Headers(init.headers);
|
|
83
|
+
headers.set('Content-Type', `${CONTENT_TYPE_DEFERRED}; charset=UTF-8`);
|
|
84
|
+
init.headers = headers;
|
|
85
|
+
response = new Response(body, init);
|
|
86
|
+
}
|
|
87
|
+
} else response = isResponse(response) ? response : new Response(JSON.stringify(response), {
|
|
88
|
+
headers: {
|
|
89
|
+
'Content-Type': 'application/json; charset=utf-8'
|
|
90
|
+
}
|
|
91
|
+
});
|
|
92
|
+
const cost = end();
|
|
93
|
+
response.headers.set('X-Modernjs-Response', 'yes');
|
|
94
|
+
onTiming?.(`${LOADER_REPORTER_NAME}-navigation`, cost);
|
|
95
|
+
} catch (error) {
|
|
96
|
+
if (isResponse(error)) {
|
|
97
|
+
error.headers.set('X-Modernjs-Catch', 'yes');
|
|
98
|
+
response = error;
|
|
99
|
+
} else if (isRouteErrorResponse(error)) response = errorResponseToJson(error);
|
|
100
|
+
else {
|
|
101
|
+
const errorInstance = error instanceof Error || error instanceof DOMException ? error : new Error('Unexpected Server Error');
|
|
102
|
+
response = new Response(JSON.stringify(serializeError(errorInstance)), {
|
|
103
|
+
status: 500,
|
|
104
|
+
headers: {
|
|
105
|
+
'X-Modernjs-Error': 'yes',
|
|
106
|
+
'Content-Type': 'application/json'
|
|
107
|
+
}
|
|
108
|
+
});
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
return response;
|
|
112
|
+
});
|
|
113
|
+
};
|
|
114
|
+
export { handleRequest, hasFileExtension, isRedirectResponse, isResponse };
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { TextEncoder } from "util";
|
|
2
|
+
import { serializeJson } from "@modern-js/runtime-utils/node";
|
|
3
|
+
function isTrackedPromise(value) {
|
|
4
|
+
return null != value && 'function' == typeof value.then && true === value._tracked;
|
|
5
|
+
}
|
|
6
|
+
const DEFERRED_VALUE_PLACEHOLDER_PREFIX = '__deferred_promise:';
|
|
7
|
+
function createDeferredReadableStream(deferredData, signal) {
|
|
8
|
+
const encoder = new TextEncoder();
|
|
9
|
+
const stream = new ReadableStream({
|
|
10
|
+
async start (controller) {
|
|
11
|
+
const criticalData = {};
|
|
12
|
+
const preresolvedKeys = [];
|
|
13
|
+
for (const [key, value] of Object.entries(deferredData.data))if (isTrackedPromise(value)) {
|
|
14
|
+
criticalData[key] = `${DEFERRED_VALUE_PLACEHOLDER_PREFIX}${key}`;
|
|
15
|
+
if (void 0 !== value._data || void 0 !== value._error) preresolvedKeys.push(key);
|
|
16
|
+
} else criticalData[key] = value;
|
|
17
|
+
controller.enqueue(encoder.encode(`${JSON.stringify(criticalData)}\n\n`));
|
|
18
|
+
for (const preresolvedKey of preresolvedKeys)enqueueTrackedPromise(controller, encoder, preresolvedKey, deferredData.data[preresolvedKey]);
|
|
19
|
+
const unsubscribe = deferredData.subscribe((aborted, settledKey)=>{
|
|
20
|
+
if (settledKey) enqueueTrackedPromise(controller, encoder, settledKey, deferredData.data[settledKey]);
|
|
21
|
+
});
|
|
22
|
+
await deferredData.resolveData(signal);
|
|
23
|
+
unsubscribe();
|
|
24
|
+
controller.close();
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
return stream;
|
|
28
|
+
}
|
|
29
|
+
function enqueueTrackedPromise(controller, encoder, settledKey, promise) {
|
|
30
|
+
if ('_error' in promise) {
|
|
31
|
+
const { _error } = promise;
|
|
32
|
+
controller.enqueue(encoder.encode(`error:${serializeJson({
|
|
33
|
+
[settledKey]: {
|
|
34
|
+
message: _error.message,
|
|
35
|
+
stack: _error.stack
|
|
36
|
+
}
|
|
37
|
+
})}\n\n`));
|
|
38
|
+
} else controller.enqueue(encoder.encode(`data:${JSON.stringify({
|
|
39
|
+
[settledKey]: promise._data ?? null
|
|
40
|
+
})}\n\n`));
|
|
41
|
+
}
|
|
42
|
+
export { createDeferredReadableStream };
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
import { redirect } from "@modern-js/runtime-utils/router";
|
|
2
|
+
import { compile } from "path-to-regexp";
|
|
3
|
+
import { CONTENT_TYPE_DEFERRED, DIRECT_PARAM, LOADER_ID_PARAM } from "../common/constants.mjs";
|
|
4
|
+
import { parseDeferredReadableStream } from "./data.mjs";
|
|
5
|
+
const getRequestUrl = ({ params, request, routeId })=>{
|
|
6
|
+
const url = new URL(request.url);
|
|
7
|
+
const toPath = compile(url.pathname, {
|
|
8
|
+
encode: encodeURIComponent
|
|
9
|
+
});
|
|
10
|
+
const newPathName = toPath(params);
|
|
11
|
+
url.pathname = newPathName;
|
|
12
|
+
url.searchParams.append(LOADER_ID_PARAM, routeId);
|
|
13
|
+
url.searchParams.append(DIRECT_PARAM, 'true');
|
|
14
|
+
return url;
|
|
15
|
+
};
|
|
16
|
+
const handleRedirectResponse = (res)=>{
|
|
17
|
+
const { headers } = res;
|
|
18
|
+
const location = headers.get('X-Modernjs-Redirect');
|
|
19
|
+
if (location) throw redirect(location);
|
|
20
|
+
return res;
|
|
21
|
+
};
|
|
22
|
+
const isDeferredResponse = (res)=>res.headers.get('Content-Type')?.match(CONTENT_TYPE_DEFERRED) && res.body;
|
|
23
|
+
const isRedirectResponse = (res)=>null != res.headers.get('X-Modernjs-Redirect');
|
|
24
|
+
const isErrorResponse = (res)=>null != res.headers.get('X-Modernjs-Error');
|
|
25
|
+
function isOtherErrorResponse(res) {
|
|
26
|
+
return res.status >= 400 && null == res.headers.get('X-Modernjs-Error') && null == res.headers.get('X-Modernjs-Catch') && null == res.headers.get('X-Modernjs-Response');
|
|
27
|
+
}
|
|
28
|
+
const isCatchResponse = (res)=>null != res.headers.get('X-Modernjs-Catch');
|
|
29
|
+
const handleErrorResponse = async (res)=>{
|
|
30
|
+
const data = await res.json();
|
|
31
|
+
const error = new Error(data.message);
|
|
32
|
+
error.stack = data.stack;
|
|
33
|
+
throw error;
|
|
34
|
+
};
|
|
35
|
+
const handleNetworkErrorResponse = async (res)=>{
|
|
36
|
+
const text = await res.text();
|
|
37
|
+
const error = new Error(text);
|
|
38
|
+
error.stack = void 0;
|
|
39
|
+
throw error;
|
|
40
|
+
};
|
|
41
|
+
const createRequest = (routeId, method = 'get')=>async ({ params, request })=>{
|
|
42
|
+
const url = getRequestUrl({
|
|
43
|
+
params,
|
|
44
|
+
request,
|
|
45
|
+
routeId
|
|
46
|
+
});
|
|
47
|
+
let res;
|
|
48
|
+
res = await fetch(url, {
|
|
49
|
+
method,
|
|
50
|
+
signal: request.signal
|
|
51
|
+
}).catch((error)=>{
|
|
52
|
+
throw error;
|
|
53
|
+
});
|
|
54
|
+
if (isRedirectResponse(res)) return handleRedirectResponse(res);
|
|
55
|
+
if (isErrorResponse(res)) return await handleErrorResponse(res);
|
|
56
|
+
if (isCatchResponse(res)) throw res;
|
|
57
|
+
if (isDeferredResponse(res)) {
|
|
58
|
+
const deferredData = await parseDeferredReadableStream(res.body);
|
|
59
|
+
return deferredData.data;
|
|
60
|
+
}
|
|
61
|
+
if (isOtherErrorResponse(res)) return await handleNetworkErrorResponse(res);
|
|
62
|
+
return res;
|
|
63
|
+
};
|
|
64
|
+
const createActionRequest = (routeId)=>async ({ params, request })=>{
|
|
65
|
+
const url = getRequestUrl({
|
|
66
|
+
params,
|
|
67
|
+
request,
|
|
68
|
+
routeId
|
|
69
|
+
});
|
|
70
|
+
const init = {
|
|
71
|
+
signal: request.signal
|
|
72
|
+
};
|
|
73
|
+
if ('GET' !== request.method) {
|
|
74
|
+
init.method = request.method;
|
|
75
|
+
const contentType = request.headers.get('Content-Type');
|
|
76
|
+
if (contentType && /\bapplication\/json\b/.test(contentType)) {
|
|
77
|
+
init.headers = {
|
|
78
|
+
'Content-Type': contentType
|
|
79
|
+
};
|
|
80
|
+
init.body = JSON.stringify(await request.json());
|
|
81
|
+
} else if (contentType && /\btext\/plain\b/.test(contentType)) {
|
|
82
|
+
init.headers = {
|
|
83
|
+
'Content-Type': contentType
|
|
84
|
+
};
|
|
85
|
+
init.body = await request.text();
|
|
86
|
+
} else if (contentType && /\bapplication\/x-www-form-urlencoded\b/.test(contentType)) init.body = new URLSearchParams(await request.text());
|
|
87
|
+
else init.body = await request.formData();
|
|
88
|
+
}
|
|
89
|
+
const res = await fetch(url, init);
|
|
90
|
+
if (!res.ok) throw res;
|
|
91
|
+
return res;
|
|
92
|
+
};
|
|
93
|
+
export { createActionRequest, createRequest, getRequestUrl };
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
import { AbortedDeferredError, DeferredData } from "@modern-js/runtime-utils/browser";
|
|
2
|
+
const DEFERRED_VALUE_PLACEHOLDER_PREFIX = '__deferred_promise:';
|
|
3
|
+
async function parseDeferredReadableStream(stream) {
|
|
4
|
+
if (!stream) throw new Error('parseDeferredReadableStream requires stream argument');
|
|
5
|
+
let deferredData;
|
|
6
|
+
const deferredResolvers = {};
|
|
7
|
+
try {
|
|
8
|
+
const sectionReader = readStreamSections(stream);
|
|
9
|
+
const initialSectionResult = await sectionReader.next();
|
|
10
|
+
const initialSection = initialSectionResult.value;
|
|
11
|
+
if (!initialSection) throw new Error('no critical data');
|
|
12
|
+
const criticalData = JSON.parse(initialSection);
|
|
13
|
+
if ('object' == typeof criticalData && null !== criticalData) {
|
|
14
|
+
for (const [eventKey, value] of Object.entries(criticalData))if ('string' == typeof value && value.startsWith(DEFERRED_VALUE_PLACEHOLDER_PREFIX)) {
|
|
15
|
+
deferredData = deferredData || {};
|
|
16
|
+
deferredData[eventKey] = new Promise((resolve, reject)=>{
|
|
17
|
+
deferredResolvers[eventKey] = {
|
|
18
|
+
resolve: (value)=>{
|
|
19
|
+
resolve(value);
|
|
20
|
+
delete deferredResolvers[eventKey];
|
|
21
|
+
},
|
|
22
|
+
reject: (error)=>{
|
|
23
|
+
reject(error);
|
|
24
|
+
delete deferredResolvers[eventKey];
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
(async ()=>{
|
|
31
|
+
try {
|
|
32
|
+
for await (const section of sectionReader){
|
|
33
|
+
const [event, ...sectionDataStrings] = section.split(':');
|
|
34
|
+
const sectionDataString = sectionDataStrings.join(':');
|
|
35
|
+
const data = JSON.parse(sectionDataString);
|
|
36
|
+
if ('data' === event) {
|
|
37
|
+
for (const [key, value] of Object.entries(data))if (deferredResolvers[key]) deferredResolvers[key].resolve(value);
|
|
38
|
+
} else if ('error' === event) for (const [key, value] of Object.entries(data)){
|
|
39
|
+
const err = new Error(value.message);
|
|
40
|
+
err.stack = value.stack;
|
|
41
|
+
if (deferredResolvers[key]) deferredResolvers[key].reject(err);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
for (const [key, resolver] of Object.entries(deferredResolvers))resolver.reject(new AbortedDeferredError(`Deferred ${key} will never resolved`));
|
|
45
|
+
} catch (error) {
|
|
46
|
+
for (const resolver of Object.values(deferredResolvers))resolver.reject(error);
|
|
47
|
+
}
|
|
48
|
+
})();
|
|
49
|
+
return new DeferredData({
|
|
50
|
+
...criticalData,
|
|
51
|
+
...deferredData
|
|
52
|
+
});
|
|
53
|
+
} catch (error) {
|
|
54
|
+
for (const resolver of Object.values(deferredResolvers))resolver.reject(error);
|
|
55
|
+
throw error;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
async function* readStreamSections(stream) {
|
|
59
|
+
const reader = stream.getReader();
|
|
60
|
+
let buffer = [];
|
|
61
|
+
let sections = [];
|
|
62
|
+
let closed = false;
|
|
63
|
+
const encoder = new TextEncoder();
|
|
64
|
+
const decoder = new TextDecoder();
|
|
65
|
+
const readStreamSection = async ()=>{
|
|
66
|
+
if (sections.length > 0) return sections.shift();
|
|
67
|
+
while(!closed && 0 === sections.length){
|
|
68
|
+
const chunk = await reader.read();
|
|
69
|
+
if (chunk.done) {
|
|
70
|
+
closed = true;
|
|
71
|
+
break;
|
|
72
|
+
}
|
|
73
|
+
buffer.push(chunk.value);
|
|
74
|
+
try {
|
|
75
|
+
const bufferedString = decoder.decode(mergeArrays(...buffer));
|
|
76
|
+
const splitSections = bufferedString.split('\n\n');
|
|
77
|
+
if (splitSections.length >= 2) {
|
|
78
|
+
sections.push(...splitSections.slice(0, -1));
|
|
79
|
+
buffer = [
|
|
80
|
+
encoder.encode(splitSections.slice(-1).join('\n\n'))
|
|
81
|
+
];
|
|
82
|
+
}
|
|
83
|
+
if (sections.length > 0) break;
|
|
84
|
+
} catch {
|
|
85
|
+
continue;
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
if (sections.length > 0) return sections.shift();
|
|
89
|
+
if (buffer.length > 0) {
|
|
90
|
+
const bufferedString = decoder.decode(mergeArrays(...buffer));
|
|
91
|
+
sections = bufferedString.split('\n\n').filter((s)=>s);
|
|
92
|
+
buffer = [];
|
|
93
|
+
}
|
|
94
|
+
return sections.shift();
|
|
95
|
+
};
|
|
96
|
+
let section = await readStreamSection();
|
|
97
|
+
while(section){
|
|
98
|
+
yield section;
|
|
99
|
+
section = await readStreamSection();
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
function mergeArrays(...arrays) {
|
|
103
|
+
const out = new Uint8Array(arrays.reduce((total, arr)=>total + arr.length, 0));
|
|
104
|
+
let offset = 0;
|
|
105
|
+
for (const arr of arrays){
|
|
106
|
+
out.set(arr, offset);
|
|
107
|
+
offset += arr.length;
|
|
108
|
+
}
|
|
109
|
+
return out;
|
|
110
|
+
}
|
|
111
|
+
export { parseDeferredReadableStream };
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import path from "path";
|
|
2
|
+
const generateClient = ({ inline, action, routeId })=>{
|
|
3
|
+
let requestCode = "";
|
|
4
|
+
const requestCreatorPath = path.join(__dirname, './createRequest').replace('/cjs/cli/', '/esm/cli/').replace(/\\/g, '/');
|
|
5
|
+
const importCode = `
|
|
6
|
+
import { createRequest, createActionRequest } from '${requestCreatorPath}';
|
|
7
|
+
`;
|
|
8
|
+
requestCode = inline ? action ? `
|
|
9
|
+
export const loader = createRequest('${routeId}');
|
|
10
|
+
export const action = createActionRequest('${routeId}')
|
|
11
|
+
` : `
|
|
12
|
+
export const loader = createRequest('${routeId}');
|
|
13
|
+
` : `
|
|
14
|
+
export default createRequest('${routeId}');
|
|
15
|
+
`;
|
|
16
|
+
const generatedCode = `
|
|
17
|
+
${importCode}
|
|
18
|
+
${requestCode}
|
|
19
|
+
`;
|
|
20
|
+
return generatedCode;
|
|
21
|
+
};
|
|
22
|
+
export { generateClient };
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { promisify } from "util";
|
|
2
|
+
import { logger } from "@modern-js/utils/logger";
|
|
3
|
+
import { generateClient } from "./generateClient.mjs";
|
|
4
|
+
async function loader(source) {
|
|
5
|
+
this.cacheable();
|
|
6
|
+
const target = this._compiler?.options.target;
|
|
7
|
+
const shouldSkip = (compileTarget)=>target === compileTarget || Array.isArray(target) && target.includes(compileTarget);
|
|
8
|
+
if (shouldSkip('node') || shouldSkip('webworker') || shouldSkip('async-node')) return source;
|
|
9
|
+
const { resourceQuery } = this;
|
|
10
|
+
const options = resourceQuery.slice(1).split('&').reduce((pre, cur)=>{
|
|
11
|
+
const [key, value] = cur.split('=');
|
|
12
|
+
if (key && value) pre[key] = 'true' === value ? true : 'false' === value ? false : value;
|
|
13
|
+
return pre;
|
|
14
|
+
}, {});
|
|
15
|
+
if (!options.loaderId || options.retain) return source;
|
|
16
|
+
if (options.clientData) {
|
|
17
|
+
const readFile = promisify(this.fs.readFile);
|
|
18
|
+
try {
|
|
19
|
+
const clientDataPath = this.resourcePath.includes('.loader.') ? this.resourcePath.replace('.loader.', '.data.client.') : this.resourcePath.replace('.data.', '.data.client.');
|
|
20
|
+
this.addDependency(clientDataPath);
|
|
21
|
+
const clientDataContent = await readFile(clientDataPath);
|
|
22
|
+
return clientDataContent;
|
|
23
|
+
} catch (error) {
|
|
24
|
+
if ('development' === process.env.NODE_ENV) logger.error(`Failed to read the clientData file ${options.clientData}`);
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
const code = generateClient({
|
|
28
|
+
inline: options.inline,
|
|
29
|
+
action: options.action,
|
|
30
|
+
routeId: options.routeId
|
|
31
|
+
});
|
|
32
|
+
return code;
|
|
33
|
+
}
|
|
34
|
+
export { loader as default };
|