From 4a303324490b8dfa11b31b395b26dc641fa4fe66 Mon Sep 17 00:00:00 2001 From: alan <67932758+alan16742@users.noreply.github.com> Date: Sat, 26 Oct 2024 12:33:53 +0800 Subject: [PATCH 1/6] support for files pagnation, remove python backend --- back-end-cf/index.js | 32 ++++++++++----------- front-end/index.html | 68 ++++++++++++++++++++++++++------------------ 2 files changed, 55 insertions(+), 45 deletions(-) diff --git a/back-end-cf/index.js b/back-end-cf/index.js index accb45a9..eab9f75d 100644 --- a/back-end-cf/index.js +++ b/back-end-cf/index.js @@ -95,7 +95,7 @@ async function handleRequest(request) { } // List a folder - const files = await fetchFiles(requestPath, body.passwd); + const files = await fetchFiles(requestPath, body.passwd, body.skipToken); return new Response(files, { headers: returnHeaders, }); @@ -188,7 +188,7 @@ async function authenticate(path, passwd) { } } -async function fetchFiles(path, passwd) { +async function fetchFiles(path, passwd, skipToken, order) { const parent = path || '/'; try { await authenticate(path, passwd); @@ -202,30 +202,28 @@ async function fetchFiles(path, passwd) { if (path === '/') path = ''; if (path || EXPOSE_PATH) - path = ':' + encodeURIComponent(EXPOSE_PATH + path) + ':'; + path = ':' + encodeURIComponent(EXPOSE_PATH + path); const accessToken = await fetchAccessToken(); - const expand = - '/children?select=name,size,parentReference,lastModifiedDateTime,@microsoft.graph.downloadUrl&$top=200'; + const expand = ':/children' + + '?select=name,size,parentReference,lastModifiedDateTime,@microsoft.graph.downloadUrl' + + `&$top=50${order ? '&$orderby=' + order : ''}` + + (skipToken ? '&skiptoken=' + skipToken : ''); const uri = OAUTH.apiUrl + path + expand; - let pageRes = await getContent(uri, { + const pageRes = await getContent(uri, { Authorization: 'Bearer ' + accessToken, }); if (pageRes.error) { throw new Error('request failed'); } - - let children = pageRes.value; - while (pageRes['@odata.nextLink']) { - pageRes = await getContent(pageRes['@odata.nextLink'], { - Authorization: 'Bearer ' + accessToken, - }); - children = children.concat(pageRes.value); - } + + skipToken = pageRes['@odata.nextLink'] ? new URL(pageRes['@odata.nextLink']).searchParams.get('$skiptoken') : ''; + const children = pageRes.value; return JSON.stringify({ parent, + skipToken, files: children .map((file) => ({ name: file.name, @@ -244,9 +242,9 @@ async function downloadFile(filePath, format, stream) { } filePath = encodeURIComponent(`${EXPOSE_PATH}${filePath}`); - const uri = - `${OAUTH.apiUrl}:${filePath}:/content` + - (format ? `?format=${format}` : ''); + const uri = `${OAUTH.apiUrl}:${filePath}:/content` + + (format ? `?format=${format}` : '') + + (format === 'jpg' ? '&width=30000&height=30000' : ''); const accessToken = await fetchAccessToken(); return cacheFetch(uri, { diff --git a/front-end/index.html b/front-end/index.html index 676cc0b9..afd286aa 100644 --- a/front-end/index.html +++ b/front-end/index.html @@ -5,8 +5,7 @@ window.GLOBAL_CONFIG = { SCF_GATEWAY: `//tight-bar-e3b3.logi.workers.dev`, // Worker 或云函数网关地址 SITE_NAME: `FODI`, // 站点名称 - PRELOAD: false, - IS_CF: true, + PRELOAD: false, // 是否预加载文件列表 }; @@ -719,7 +718,7 @@ function renderPage(data, cache) { let files; if (data) { - files = JSON.parse(data); + files = typeof data === 'string' ? JSON.parse(data) : data; window.fileCache.set(files.parent, files); preCache(files, 0); } else { @@ -1074,7 +1073,7 @@ input.placeholder = '密码错误'; } else { window.fileCache.set(newFiles.parent, newFiles); - window.fileCache.set(`${newFiles.parent}/.upload`, passwd); + window.fileCache.set(`${newFiles.parent}/.password`, passwd); fetchFileList(newFiles.parent); } } @@ -1724,7 +1723,7 @@ window.api.url + '?upload', window.api.formatPayload( odPath, - window.fileCache.get(`${odPath}/.upload`) || '', + window.fileCache.get(`${odPath}/.password`), { files: currentPage, } @@ -1878,7 +1877,6 @@ JSON.stringify({ path, passwd, - ...window.api.accessToken, ...kvs, }), headers: { @@ -1898,28 +1896,42 @@ const initialPath = new URLSearchParams(window.location.search).get('path') || window.api.root; - if (window.GLOBAL_CONFIG.IS_CF) { - fetchFileList(initialPath); - addBackForwardListener(); - addFileUploadListener(); - } else { - sendRequest( - window.api.method, - window.api.url + '?accessToken', - null, - window.api.headers, - (data) => { - const accessToken = JSON.parse(data); - window.api.accessToken = { - encrypted: accessToken.encrypted, - plain: accessToken.plain, - }; - fetchFileList(initialPath); - addBackForwardListener(); - addFileUploadListener(); - } - ); - } + fetchFileList(initialPath); + addBackForwardListener(); + addFileUploadListener(); + const rightDiv = document.querySelector('div.right'); + rightDiv.addEventListener('scroll', function() { + const scrollPosition = rightDiv.scrollTop + rightDiv.clientHeight; + const scrollHeight = rightDiv.scrollHeight; + let loadedPages = window.fileCache.get(window.backFordwardCache.current); + let isRequestInProgress = false; + if (scrollPosition >= scrollHeight && loadedPages.skipToken) { + if(isRequestInProgress) return; + isRequestInProgress = true; + sendRequest( + window.api.method, + window.api.url, + window.api.formatPayload( + loadedPages.parent, + window.fileCache.get(`${loadedPages.parent}/.password`), + { skipToken: loadedPages.skipToken } + ), + window.api.headers, + (data) => { + data = JSON.parse(data); + loadedPages.files = loadedPages.files.concat(data.files); + loadedPages.skipToken = data.skipToken; + window.fileCache.set(window.backFordwardCache.current, loadedPages); + renderPage(loadedPages); + isRequestInProgress = false; + }, + () => { + const loadingText = loading.querySelector('.loading'); + loadingText.innerText = 'Loading NextPage Failed!'; + } + ); + } + }); }); From 164dcb52c1fbb96c459fb5538c6fbaeb623cbaf1 Mon Sep 17 00:00:00 2001 From: alan <67932758+alan16742@users.noreply.github.com> Date: Sun, 27 Oct 2024 22:12:43 +0800 Subject: [PATCH 2/6] fix: orderBy support --- back-end-cf/index.js | 7 ++++--- front-end/index.html | 41 +++++++++++++++++++++++++++++++++-------- 2 files changed, 37 insertions(+), 11 deletions(-) diff --git a/back-end-cf/index.js b/back-end-cf/index.js index eab9f75d..48530692 100644 --- a/back-end-cf/index.js +++ b/back-end-cf/index.js @@ -95,7 +95,7 @@ async function handleRequest(request) { } // List a folder - const files = await fetchFiles(requestPath, body.passwd, body.skipToken); + const files = await fetchFiles(requestPath, body.passwd, body.skipToken, body.orderby); return new Response(files, { headers: returnHeaders, }); @@ -188,7 +188,7 @@ async function authenticate(path, passwd) { } } -async function fetchFiles(path, passwd, skipToken, order) { +async function fetchFiles(path, passwd, skipToken, orderby) { const parent = path || '/'; try { await authenticate(path, passwd); @@ -207,7 +207,7 @@ async function fetchFiles(path, passwd, skipToken, order) { const accessToken = await fetchAccessToken(); const expand = ':/children' + '?select=name,size,parentReference,lastModifiedDateTime,@microsoft.graph.downloadUrl' + - `&$top=50${order ? '&$orderby=' + order : ''}` + + `&$top=50${orderby ? '&$orderby=' + orderby : ''}` + (skipToken ? '&skiptoken=' + skipToken : ''); const uri = OAUTH.apiUrl + path + expand; @@ -224,6 +224,7 @@ async function fetchFiles(path, passwd, skipToken, order) { return JSON.stringify({ parent, skipToken, + orderby, files: children .map((file) => ({ name: file.name, diff --git a/front-end/index.html b/front-end/index.html index afd286aa..cfd40740 100644 --- a/front-end/index.html +++ b/front-end/index.html @@ -1655,7 +1655,31 @@ }); } - function fetchFileList(path) { + function sortList(clickedElem) { + let loadedPages = window.fileCache.get(window.backFordwardCache.current); + const oldSortOrder = loadedPages?.orderby || 'name asc'; + const sortField = clickedElem.className; + const sortOrder = oldSortOrder.split(' ')[1] === 'asc' ? 'desc' : 'asc'; + const newSortOrder = `${sortField} ${sortOrder}`; + if (oldSortOrder === newSortOrder) { + return; + } + if (loadedPages.skipToken) { + window.fileCache.set(window.backFordwardCache.current, false); + fetchFileList(window.backFordwardCache.current, newSortOrder.replace('time', 'lastModifiedDateTime')); + } else{ + alert(newSortOrder); + loadedPages.orderby = newSortOrder; + loadedPages.files.sort((a, b) => { + if (a[sortField] < b[sortField]) return sortOrder === 'asc' ? -1 : 1; + if (a[sortField] > b[sortField]) return sortOrder === 'asc' ? 1 : -1; + return 0; + }); + renderPage(loadedPages); + } + } + + function fetchFileList(path, orderby) { // console.log('fetching ' + path); const loading = document.querySelector('.loading-wrapper'); loading.dataset.hidden = '0'; @@ -1673,7 +1697,7 @@ sendRequest( window.api.method, window.api.url, - window.api.formatPayload(path), + window.api.formatPayload(path, '', { orderby: orderby }), window.api.headers, renderPage, () => { @@ -1900,12 +1924,12 @@ addBackForwardListener(); addFileUploadListener(); const rightDiv = document.querySelector('div.right'); + let isRequestInProgress = false; rightDiv.addEventListener('scroll', function() { const scrollPosition = rightDiv.scrollTop + rightDiv.clientHeight; const scrollHeight = rightDiv.scrollHeight; let loadedPages = window.fileCache.get(window.backFordwardCache.current); - let isRequestInProgress = false; - if (scrollPosition >= scrollHeight && loadedPages.skipToken) { + if (scrollPosition >= scrollHeight - 20 && loadedPages.skipToken) { if(isRequestInProgress) return; isRequestInProgress = true; sendRequest( @@ -1914,7 +1938,7 @@ window.api.formatPayload( loadedPages.parent, window.fileCache.get(`${loadedPages.parent}/.password`), - { skipToken: loadedPages.skipToken } + { skipToken: loadedPages.skipToken, orderby: loadedPages.orderby } ), window.api.headers, (data) => { @@ -1928,6 +1952,7 @@ () => { const loadingText = loading.querySelector('.loading'); loadingText.innerText = 'Loading NextPage Failed!'; + isRequestInProgress = false; } ); } @@ -1994,9 +2019,9 @@
- ITEMS - TIME - SIZE + ITEMS + TIME + SIZE
From f432fcdb5d8d7dcfc393006d5a48e38556c7e46e Mon Sep 17 00:00:00 2001 From: LOGI <18008498+vcheckzen@users.noreply.github.com> Date: Sun, 27 Oct 2024 23:18:29 +0800 Subject: [PATCH 3/6] Update index.js --- back-end-cf/index.js | 33 +++++++++++++++++++++------------ 1 file changed, 21 insertions(+), 12 deletions(-) diff --git a/back-end-cf/index.js b/back-end-cf/index.js index 48530692..98a20148 100644 --- a/back-end-cf/index.js +++ b/back-end-cf/index.js @@ -95,7 +95,12 @@ async function handleRequest(request) { } // List a folder - const files = await fetchFiles(requestPath, body.passwd, body.skipToken, body.orderby); + const files = await fetchFiles( + requestPath, + body.passwd, + body.skipToken, + body.orderby + ); return new Response(files, { headers: returnHeaders, }); @@ -201,14 +206,15 @@ async function fetchFiles(path, passwd, skipToken, orderby) { } if (path === '/') path = ''; - if (path || EXPOSE_PATH) - path = ':' + encodeURIComponent(EXPOSE_PATH + path); - + if (path || EXPOSE_PATH) { + // if EXPOSE_PATH + path equals to an empty string, ':' will lead to an error. + path = ':' + encodeURIComponent(EXPOSE_PATH + path) + ':'; + } const accessToken = await fetchAccessToken(); - const expand = ':/children' + - '?select=name,size,parentReference,lastModifiedDateTime,@microsoft.graph.downloadUrl' + - `&$top=50${orderby ? '&$orderby=' + orderby : ''}` + - (skipToken ? '&skiptoken=' + skipToken : ''); + const expand = `/children?select=name,size,parentReference,lastModifiedDateTime,@microsoft.graph.downloadUrl + &$top=200${orderby ? '&$orderby=' + orderby : ''}${ + skipToken ? '&skiptoken=' + skipToken : '' + }`; const uri = OAUTH.apiUrl + path + expand; const pageRes = await getContent(uri, { @@ -217,8 +223,10 @@ async function fetchFiles(path, passwd, skipToken, orderby) { if (pageRes.error) { throw new Error('request failed'); } - - skipToken = pageRes['@odata.nextLink'] ? new URL(pageRes['@odata.nextLink']).searchParams.get('$skiptoken') : ''; + + skipToken = pageRes['@odata.nextLink'] + ? new URL(pageRes['@odata.nextLink']).searchParams.get('$skiptoken') + : ''; const children = pageRes.value; return JSON.stringify({ @@ -243,8 +251,9 @@ async function downloadFile(filePath, format, stream) { } filePath = encodeURIComponent(`${EXPOSE_PATH}${filePath}`); - const uri = `${OAUTH.apiUrl}:${filePath}:/content` + - (format ? `?format=${format}` : '') + + const uri = + `${OAUTH.apiUrl}:${filePath}:/content` + + (format ? `?format=${format}` : '') + (format === 'jpg' ? '&width=30000&height=30000' : ''); const accessToken = await fetchAccessToken(); From 46d408db799c687f8e5e8ee0d820dd6ca6d61c57 Mon Sep 17 00:00:00 2001 From: LOGI <18008498+vcheckzen@users.noreply.github.com> Date: Sun, 27 Oct 2024 23:19:57 +0800 Subject: [PATCH 4/6] Update index.html --- front-end/index.html | 35 +++++++++++++++++++++++++---------- 1 file changed, 25 insertions(+), 10 deletions(-) diff --git a/front-end/index.html b/front-end/index.html index cfd40740..16f0dbba 100644 --- a/front-end/index.html +++ b/front-end/index.html @@ -1656,7 +1656,9 @@ } function sortList(clickedElem) { - let loadedPages = window.fileCache.get(window.backFordwardCache.current); + let loadedPages = window.fileCache.get( + window.backFordwardCache.current + ); const oldSortOrder = loadedPages?.orderby || 'name asc'; const sortField = clickedElem.className; const sortOrder = oldSortOrder.split(' ')[1] === 'asc' ? 'desc' : 'asc'; @@ -1666,13 +1668,18 @@ } if (loadedPages.skipToken) { window.fileCache.set(window.backFordwardCache.current, false); - fetchFileList(window.backFordwardCache.current, newSortOrder.replace('time', 'lastModifiedDateTime')); - } else{ + fetchFileList( + window.backFordwardCache.current, + newSortOrder.replace('time', 'lastModifiedDateTime') + ); + } else { alert(newSortOrder); loadedPages.orderby = newSortOrder; loadedPages.files.sort((a, b) => { - if (a[sortField] < b[sortField]) return sortOrder === 'asc' ? -1 : 1; - if (a[sortField] > b[sortField]) return sortOrder === 'asc' ? 1 : -1; + if (a[sortField] < b[sortField]) + return sortOrder === 'asc' ? -1 : 1; + if (a[sortField] > b[sortField]) + return sortOrder === 'asc' ? 1 : -1; return 0; }); renderPage(loadedPages); @@ -1925,12 +1932,14 @@ addFileUploadListener(); const rightDiv = document.querySelector('div.right'); let isRequestInProgress = false; - rightDiv.addEventListener('scroll', function() { + rightDiv.addEventListener('scroll', function () { const scrollPosition = rightDiv.scrollTop + rightDiv.clientHeight; const scrollHeight = rightDiv.scrollHeight; - let loadedPages = window.fileCache.get(window.backFordwardCache.current); + let loadedPages = window.fileCache.get( + window.backFordwardCache.current + ); if (scrollPosition >= scrollHeight - 20 && loadedPages.skipToken) { - if(isRequestInProgress) return; + if (isRequestInProgress) return; isRequestInProgress = true; sendRequest( window.api.method, @@ -1938,14 +1947,20 @@ window.api.formatPayload( loadedPages.parent, window.fileCache.get(`${loadedPages.parent}/.password`), - { skipToken: loadedPages.skipToken, orderby: loadedPages.orderby } + { + skipToken: loadedPages.skipToken, + orderby: loadedPages.orderby, + } ), window.api.headers, (data) => { data = JSON.parse(data); loadedPages.files = loadedPages.files.concat(data.files); loadedPages.skipToken = data.skipToken; - window.fileCache.set(window.backFordwardCache.current, loadedPages); + window.fileCache.set( + window.backFordwardCache.current, + loadedPages + ); renderPage(loadedPages); isRequestInProgress = false; }, From 296756f123e58532e8d9696e6a0f66b5204486b8 Mon Sep 17 00:00:00 2001 From: LOGI <18008498+vcheckzen@users.noreply.github.com> Date: Sun, 27 Oct 2024 23:22:06 +0800 Subject: [PATCH 5/6] Update index.html --- front-end/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/front-end/index.html b/front-end/index.html index 16f0dbba..430ce2a4 100644 --- a/front-end/index.html +++ b/front-end/index.html @@ -1656,7 +1656,7 @@ } function sortList(clickedElem) { - let loadedPages = window.fileCache.get( + const loadedPages = window.fileCache.get( window.backFordwardCache.current ); const oldSortOrder = loadedPages?.orderby || 'name asc'; From fd6b04d9336afd4f1a5ec5f1e10ecc111876b53c Mon Sep 17 00:00:00 2001 From: LOGI <18008498+vcheckzen@users.noreply.github.com> Date: Sun, 27 Oct 2024 23:23:21 +0800 Subject: [PATCH 6/6] Update index.html