Bazel + Angular + SocketIO V3 Przyczyny: Uncaught TypeError: XMLHttpRequest nie jest konstruktorem

Question

Chcę dodać socket.io-client (v3) do mojej aplikacji Angular. Używam Bazela do budowania i uruchamiania Angulara. Niestety pojawia się ten błąd w konsoli przeglądarki podczas uruchamiania serwera ts_devserver :

ERROR Error: Uncaught (in promise): TypeError: XMLHttpRequest is not a constructor
TypeError: XMLHttpRequest is not a constructor
    at ts_scripts.js?v=80175740:15476
    at Object.14.../globalThis (ts_scripts.js?v=80175740:15480)

Miałem ten sam problem podczas pracy z Socket.IO v2. Ale stare rozwiązanie już nie działa.

Również tym razem nie działa nawet uruchomienie aplikacji Angular w produkcji.

Minimalna reprodukcja

Możesz spróbować sam: flolu / angular-bazel-socketio3-issue

Po prostu biegnij yarn installi wtedy yarn dev. Błąd znajduje się w konsoli przeglądarki pod adresem http: // localhost: 4200.

Pamiętaj, że podczas uruchamiania aplikacji w środowisku produkcyjnym z yarn prodadresem http: // localhost: 4000 występuje inny błąd :

ERROR Error: Uncaught (in promise): ReferenceError: Cannot access 'e' before initialization
ReferenceError: Cannot access 'e' before initialization
    at home.module-7db83ffb.js:formatted:953

Answer 1

Nie mam pojęcia, dlaczego rozwiązanie Sebastiana już nie działa. engine.io-clientniewiele się zmieniło, jak widzę, i nadal ma kilka wymagań, "xmlhttprequest-ssl"które należy zastąpić "../xmlhttprequest". I to właśnie robi w tym scenariuszu. Ale moje node_modules nie zmieniają się po tym skrypcie, może robię coś źle.

Ale w każdym razie to, co zadziałało, robi dokładnie to samo, ale przez patch-package(po prostu jestem bardziej przyzwyczajony do tego do łatania node_modules).

Jeśli chodzi o pakiet produkcyjny, udało mi się go uruchomić po usunięciu nadmiaru zapotrzebowania, który powoduje błąd w produkcji.

To powiedziawszy, oto ostatnia łatka (włóż ją patches/engine.io-client+4.0.2.patch):

diff --git a/node_modules/engine.io-client/lib/transports/index.js b/node_modules/engine.io-client/lib/transports/index.js
index 923223d..1ec2668 100755
--- a/node_modules/engine.io-client/lib/transports/index.js
+++ b/node_modules/engine.io-client/lib/transports/index.js
@@ -1,4 +1,4 @@
-const XMLHttpRequest = require("xmlhttprequest-ssl");
+const XMLHttpRequest = require("../xmlhttprequest");
 const XHR = require("./polling-xhr");
 const JSONP = require("./polling-jsonp");
 const websocket = require("./websocket");
diff --git a/node_modules/engine.io-client/lib/transports/polling-xhr.js b/node_modules/engine.io-client/lib/transports/polling-xhr.js
index 9988b02..a2ff168 100755
--- a/node_modules/engine.io-client/lib/transports/polling-xhr.js
+++ b/node_modules/engine.io-client/lib/transports/polling-xhr.js
@@ -1,6 +1,6 @@
 /* global attachEvent */
 
-const XMLHttpRequest = require("xmlhttprequest-ssl");
+const XMLHttpRequest = require("../xmlhttprequest");
 const Polling = require("./polling");
 const Emitter = require("component-emitter");
 const { pick } = require("../util");
@@ -15,7 +15,6 @@ const debug = require("debug")("engine.io-client:polling-xhr");
 function empty() {}
 
 const hasXHR2 = (function() {
-  const XMLHttpRequest = require("xmlhttprequest-ssl");
   const xhr = new XMLHttpRequest({ xdomain: false });
   return null != xhr.responseType;
 })();

Nie zapomnij również dodać pakietu poprawek w kroku po instalacji:

"postinstall": "patch-package && ngcc"