diff --git a/apps/widget/src/app/ModelAssessment.tsx b/apps/widget/src/app/ModelAssessment.tsx
index 0c4a54df4f..96a42db49e 100644
--- a/apps/widget/src/app/ModelAssessment.tsx
+++ b/apps/widget/src/app/ModelAssessment.tsx
@@ -14,7 +14,10 @@ import {
 import { ModelAssessmentDashboard } from "@responsible-ai/model-assessment";
 import React from "react";
 
-import { callFlaskService, connectToFlaskService } from "./callFlaskService";
+import {
+  callFlaskService,
+  connectToFlaskServiceWithBackupCall
+} from "./callFlaskService";
 import { CallbackType, IModelAssessmentProps } from "./ModelAssessmentUtils";
 
 export class ModelAssessment extends React.Component<IModelAssessmentProps> {
@@ -33,16 +36,18 @@ export class ModelAssessment extends React.Component<IModelAssessmentProps> {
         objectDetectionCache: Map<string, [number, number, number]>,
         abortSignal: AbortSignal
       ): Promise<any[]> => {
-        return connectToFlaskService(
+        const parameters = [
+          selectionIndexes,
+          aggregateMethod,
+          className,
+          iouThreshold,
+          objectDetectionCache
+        ];
+        return connectToFlaskServiceWithBackupCall(
           this.props.config,
-          [
-            selectionIndexes,
-            aggregateMethod,
-            className,
-            iouThreshold,
-            objectDetectionCache
-          ],
+          parameters,
           "handle_object_detection_json",
+          "/get_object_detection_metrics",
           abortSignal
         );
       };
@@ -57,10 +62,12 @@ export class ModelAssessment extends React.Component<IModelAssessmentProps> {
         >,
         abortSignal: AbortSignal
       ): Promise<any[]> => {
-        return connectToFlaskService(
+        const parameters = [selectionIndexes, questionAnsweringCache];
+        return connectToFlaskServiceWithBackupCall(
           this.props.config,
-          [selectionIndexes, questionAnsweringCache],
+          parameters,
           "handle_question_answering_json",
+          "/get_question_answering_metrics",
           abortSignal
         );
       };
diff --git a/apps/widget/src/app/callFlaskService.ts b/apps/widget/src/app/callFlaskService.ts
index 34d26f22df..412ba73583 100644
--- a/apps/widget/src/app/callFlaskService.ts
+++ b/apps/widget/src/app/callFlaskService.ts
@@ -57,14 +57,48 @@ export async function connectToFlaskService<TRequest, TResponse>(
     socket.on("disconnect", () => {
       console.log("socket disconnected");
     });
+    socket.on("error", (error: Error) => {
+      console.log(`Encountered socket error, aborting connection: ${error}`);
+      reject(error);
+    });
     socket.emit(
       urlPath,
       {
         data: JSON.stringify(data)
       },
       (response: IDataResponse<TResponse>) => {
+        console.log(response);
+        if (response === undefined) {
+          console.log("Encountered socket error, aborting connection");
+          return reject(new Error("No response from socket"));
+        }
         return resolve(response.data);
       }
     );
   });
 }
+
+export async function connectToFlaskServiceWithBackupCall<TRequest, TResponse>(
+  config: Pick<IAppConfig, "baseUrl" | "withCredentials">,
+  data: TRequest,
+  urlPathConnect: string,
+  urlPathCall: string,
+  abortSignal?: AbortSignal
+): Promise<TResponse> {
+  return connectToFlaskService<TRequest, TResponse>(
+    config,
+    data,
+    urlPathConnect,
+    abortSignal
+  ).catch((error) => {
+    console.log(
+      `Error connecting to socket, falling back to http request: ${error}`
+    );
+    return callFlaskService<TRequest, TResponse>(
+      config,
+      data,
+      urlPathCall,
+      abortSignal
+    );
+  });
+}