web app Error: Argument 1 of FileReader.readAsText does not implement interface Blob

[njordr]

When I load for the first time the web interface, the page is like this picture:

After about 4/5 minutes it display the services discovered.

In the browser console (both Firefox and Chrome) I can find this error:

Error: Argument 1 of FileReader.readAsText does not implement interface Blob.
s/this._readChunk@http://arkham.syshell.net:7777/ui/bower_components/papaparse/papaparse.min.js:6:5519
s/this._nextChunk@http://arkham.syshell.net:7777/ui/bower_components/papaparse/papaparse.min.js:6:5328
s/this.stream@http://arkham.syshell.net:7777/ui/bower_components/papaparse/papaparse.min.js:6:5204
t@http://arkham.syshell.net:7777/ui/bower_components/papaparse/papaparse.min.js:6:465
updateData@http://arkham.syshell.net:7777/ui/services/services.js:125:13
@http://arkham.syshell.net:7777/ui/services/services.js:159:4
processQueue@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:16696:28
scheduleProcessQueue/<@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:16712:27
$eval@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:17994:16
$digest@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:17808:15
$apply@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:18102:13
done@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12082:36
completeRequest@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12291:7
requestError@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12229:9
 3 angular.js:14199:18
	consoleLog/< http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:14199:18
	$ExceptionHandlerProvider/this.$get</< http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:10707:7
	processQueue http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:16704:9
	scheduleProcessQueue/< http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:16712:27
	$eval http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:17994:16
	$digest http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:17808:15
	$apply http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:18102:13
	done http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12082:36
	completeRequest http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12291:7
	requestError http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12229:9

[mihaitodor]

Interesting. Are you using HAProxy as a proxy? If not, is there anything else listening on http://arkham.syshell.net:3212?

[njordr]

Nope, I'm trying to setup Envoy as a proxy and the port 3212 is blocked by iptables. Let me know if you need the port 7777 open to test by yourself

[mihaitodor]

OK, I'm guessing the timeout behaves in a funny way due to the iptables block. That UI code should not even try to ping HAProxy when running with Envoy. I might allocate some time to clean it up soon, but no promises.

In the mean time, as a test, could you please spin up an HTTP server on port 3212 and have it return HTTP 200 with no content? I'm curious if this makes the issue go away.

[njordr]

With the webserver on port 3212 the services page content is displayed in a few seconds, but still the error in the console:

Error: Argument 1 of FileReader.readAsText does not implement interface Blob.
s/this._readChunk@http://arkham.syshell.net:7777/ui/bower_components/papaparse/papaparse.min.js:6:5519
s/this._nextChunk@http://arkham.syshell.net:7777/ui/bower_components/papaparse/papaparse.min.js:6:5328
s/this.stream@http://arkham.syshell.net:7777/ui/bower_components/papaparse/papaparse.min.js:6:5204
t@http://arkham.syshell.net:7777/ui/bower_components/papaparse/papaparse.min.js:6:465
updateData@http://arkham.syshell.net:7777/ui/services/services.js:125:13
@http://arkham.syshell.net:7777/ui/services/services.js:159:4
processQueue@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:16696:28
scheduleProcessQueue/<@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:16712:27
$eval@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:17994:16
$digest@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:17808:15
$apply@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:18102:13
done@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12082:36
completeRequest@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12291:7
requestError@http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12229:9
 5 angular.js:14199:18
	consoleLog/< http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:14199:18
	$ExceptionHandlerProvider/this.$get</< http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:10707:7
	processQueue http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:16704:9
	scheduleProcessQueue/< http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:16712:27
	$eval http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:17994:16
	$digest http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:17808:15
	$apply http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:18102:13
	done http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12082:36
	completeRequest http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12291:7
	requestError http://arkham.syshell.net:7777/ui/bower_components/angular/angular.js:12229:9

Anyway, not a great issue :)

[mihaitodor]

OK, thanks for the confirmation. It's not great that the UI can take so long to load. I'll see if I can come up with a simple way to tell it to stop looking for HAProxy when Envoy is being used.

PS: There is also a crude text-based UI that can be accessed via the /servers endpoint. That one should load instantly, though.

[relistan]

There are two things going on there:

1. What @mihaitodor said about needing some UI work to stop looking for HAproxy when not running HAproxy. This will require a way to configure the UI from the Sidecar config and probably looks like an endpoint that just serves a UI config.
2. The way the UI polling works causes it to delay up to the full polling interval on first page load. I'm not a UI engineer and it's not great Angular code. Any help there is appreciated.