Update src/components/loader/tw-progress-monitor.js

src/components/loader/tw-progress-monitor.js

@@ -1,34 +1,39 @@
-import CorsProxy from 'cors-proxy-library';
+// 必要なモジュールをインポート
+const corsAnywhere = require('cors-anywhere');
+const XMLHttpRequest = require('xmlhttprequest').XMLHttpRequest;
 
+// CORSプロキシサーバーの設定
+const host = '127.0.0.1';
+const port = 8080;
+
+corsAnywhere.createServer({
+  originWhitelist: [], // すべてのオリジンを許可
+  requireHeaders: [],
+}).listen(port, host, () => {
+  console.log(`CORS Anywhere server is running on ${host}:${port}`);
+});
+
+// グローバルな進行状況管理変数
 let total = 0;
 let complete = 0;
-
-// 0 - none
-// 1 - load json
-// 2 - load assets
 let state = 0;
-
 let currentProgress = 0;
-
 let progressHandler = (state, progress, complete, total) => {};
 
+// 進行状況ハンドラを設定する関数
 export const setProgressHandler = newHandler => {
     progressHandler = newHandler;
     progressHandler(state, currentProgress, complete, total);
 };
 
-let progressHandlerTimeout = null;
-const fireProgressHandler = () => {
-    progressHandler(state, currentProgress, complete, total);
-    progressHandlerTimeout = null;
-};
-
+// 進行状況更新をキューに入れる関数
 const queueProgressHandlerUpdate = () => {
     if (progressHandlerTimeout === null) {
         progressHandlerTimeout = requestAnimationFrame(fireProgressHandler);
     }
 };
 
+// 進行状況を更新する関数
 const setProgress = progress => {
     if (progress < 0) {
         progress = 0;
@@ -40,6 +45,7 @@ const setProgress = progress => {
     queueProgressHandlerUpdate();
 };
 
+// ステータスを設定する関数
 const setState = newState => {
     if (state === newState) {
         return;
@@ -50,11 +56,11 @@ const setState = newState => {
     setProgress(0);
 };
 
-export const fetchWithProgress = url => {
+// XMLHttpRequestで進行状況を監視してリソースを取得する関数
+const fetchWithProgress = url => {
     setState(1);
-    const proxyUrl = CorsProxy.getProxyUrl(url);
+    const proxyUrl = `http://127.0.0.1:8080/` + encodeURIComponent(url);  // ローカルのCORSプロキシを使用
     return new Promise((resolve, reject) => {
-        // XMLHttpRequestの進行状況処理
         const xhr = new XMLHttpRequest();
         xhr.responseType = 'blob';
         xhr.onload = () => {