Fixed issue where Envoy wasn't routing requests from localhost:8080 to the emulator's gRPC server on port 8554, making it impossible to see, hear, or interact with the emulator using the WebRTC or PNG views.

Author: KQT2000

LICENSE

@@ -28,7 +28,7 @@ static_resources:
                   max_stream_duration:
                     grpc_timeout_header_max: 0s
               - match:
-                  prefix: "/android.emulation.control"
+                  prefix: "/android.emulation.control.EmulatorController"
                 route:
                   cluster: emulator_service_grpc
                   timeout: 0s
@@ -105,6 +105,7 @@ static_resources:
     connect_timeout: 0.250s
     type: STRICT_DNS
     lb_policy: ROUND_ROBIN
+    http2_protocol_options: {}
     load_assignment:
       cluster_name: emulator_service_grpc
       endpoints:

js/develop/envoy.yaml

@@ -15,6 +15,7 @@ services:
       - "80:8080"
       - "443:8443"
       - "8001:8001"
+      - "8080:8080"
   emulator:
     image: emulator_emulator:latest
     build:

js/docker/docker-compose-build.yaml

@@ -8,12 +8,11 @@ services:
     expose:
       - "8080"
       - "8001"
-      - "8443"
     ports:
       - "80:8080"
-      - "443:8443"
+      - "443:8080"
       - "8001:8001"
-
+      - "8080:8080"
   emulator:
     image: emulator_emulator:latest
     container_name: emulator_emulator
@@ -25,20 +24,19 @@ services:
     shm_size: 128M
     expose:
       - "8554"
-
-  jwt_signer:
-    image: emulator_jwt_signer:latest
-    container_name: emulator_jwt_signer
-    networks:
-      envoymesh:
-        aliases:
-          - jwt_signer
-    expose:
-      - "8080"
+  #jwt_signer:
+  #  image: emulator_jwt_signer:latest
+  #  container_name: emulator_jwt_signer
+  #  networks:
+  #    envoymesh:
+  #      aliases:
+  #        - jwt_signer
+  #  expose:
+  #    - "8080"
 
   nginx:
     image: emulator_nginx:latest
-    network_mode: "host"
+    # network_mode: "host"
     container_name: emulator_nginx
     networks:
       envoymesh:

js/docker/docker-compose.yaml

@@ -105,6 +105,7 @@ static_resources:
     connect_timeout: 0.250s
     type: STRICT_DNS
     lb_policy: ROUND_ROBIN
+    http2_protocol_options: {}
     load_assignment:
       cluster_name: emulator_service_grpc
       endpoints:

js/docker/envoy.yaml

@@ -15,7 +15,9 @@ var EMULATOR_GRPC =
   "//" +
   window.location.hostname +
   ":" +
-  window.location.port;
+  // For some reason, process.env.NODE_ENV either doesn't exist or is equal to "development", causing EMULATOR_GRPC to equal/point to "localhost:" verus "localhost:8080" which is where Envoy is listening for gRPC-Web requests. Hard-coding the appendation of ":8080" as we've done here restores some functionality, as now both the WebRTC and PNG views return a status of "connecting" and the JavaScript console no longer logs any 'JWT is missing' errors. However, the WebRTC and PNG views never return a status of "connected" so video and audio of the emulator cannot be seen/heard.
+  "8080";
+  // window.location.port;
 if (development) {
   EMULATOR_GRPC = window.location.protocol + "//" +
     window.location.hostname + ":8080";

js/src/App.js

@@ -211,6 +211,8 @@ class EmulatorScreen extends React.Component {
                   volume={volume}
                   gps={gps}
                   width={200}
+                  // For some reason, height was not defined. Maybe it was accidentally omitted? Omitting this property will cause the Emulator HTML element that displays the emulator screen not to render since only the width will be rendered.
+                  // height={500}
                 />
                 <p>State: {emuState} </p>
               </Container>