From ef8cf0b2837ccff07d86c6bed9b0029ed4251b90 Mon Sep 17 00:00:00 2001
From: sa_ddam213 <sa_ddam213@live.com>
Date: Sun, 23 Jul 2023 11:35:39 +1200
Subject: [PATCH] Add RequestVerificationToken logic fo ajax prefilter, Tidy up
 js cancel logic

---
 LLama.Web/Pages/Interactive.cshtml    | 25 +++++---------------
 LLama.Web/Pages/Interactive.cshtml.cs |  2 +-
 LLama.Web/wwwroot/js/site.js          | 34 ++++++++++++++++++++++++---
 3 files changed, 38 insertions(+), 23 deletions(-)

diff --git a/LLama.Web/Pages/Interactive.cshtml b/LLama.Web/Pages/Interactive.cshtml
index 7672d040..ae9c66cb 100644
--- a/LLama.Web/Pages/Interactive.cshtml
+++ b/LLama.Web/Pages/Interactive.cshtml
@@ -227,35 +227,22 @@
         }
 
 
-        const sendPrompt = () => {
+        const sendPrompt = async () => {
             const text = chatInput.val();
             if (text) {
                 disableControls();
                 outputContainer.append(Mustache.render(outputUserTemplate, { text: text, date: getDateTime() }));
-                connection.invoke('SendPrompt', text);
+                await connection.invoke('SendPrompt', text);
                 chatInput.val(null);
                 scrollToBottom(true);
             }
         }
 
-        const cancelPrompt = () => {
-            //TODO: Need to cancel inference via http as signalr will synchronize requests
-            // waiting on ModelSessionService so we can locate an cancel ModelSessions outside the Hub
-            //connection.invoke('CancelPrompt');
-
-            $.ajax({
-                url: '?handler=Cancel',
-                type: 'POST',
-                contentType: "application/json; charset=utf-8",
-                headers: {
-                    RequestVerificationToken:
-                        $('input:hidden[name="__RequestVerificationToken"]').val()
-                },
-                data: JSON.stringify({ connectionId: connectionId })
-            })
+        const cancelPrompt = async () => {
+            await ajaxPostJsonAsync('?handler=Cancel', { connectionId: connectionId });
         }
 
-        const loadModel = () => {
+        const loadModel = async () => {
             const modelName = getSelectedModel();
             const promptName = getSelectedPrompt();
             const parameterName = getSelectedParameter();
@@ -265,7 +252,7 @@
             }
 
             disableControls();
-            connection.invoke('LoadModel', modelName, promptName, parameterName);
+            await connection.invoke('LoadModel', modelName, promptName, parameterName);
         }
 
 
diff --git a/LLama.Web/Pages/Interactive.cshtml.cs b/LLama.Web/Pages/Interactive.cshtml.cs
index 7f0b5c1d..3d0ea81b 100644
--- a/LLama.Web/Pages/Interactive.cshtml.cs
+++ b/LLama.Web/Pages/Interactive.cshtml.cs
@@ -24,7 +24,7 @@ namespace LLama.Web.Pages
         {
         }
 
-        public async Task<IActionResult> OnPostCancel([FromBody]CancelModel model)
+        public async Task<IActionResult> OnPostCancel(CancelModel model)
         {
             await _modelSessionService.CancelAsync(model.ConnectionId);
             return new JsonResult(default);
diff --git a/LLama.Web/wwwroot/js/site.js b/LLama.Web/wwwroot/js/site.js
index ac49c186..c583c08d 100644
--- a/LLama.Web/wwwroot/js/site.js
+++ b/LLama.Web/wwwroot/js/site.js
@@ -1,4 +1,32 @@
-// Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
-// for details on configuring this project to bundle and minify static web assets.
+let _requestVerificationToken = $('input[name="__RequestVerificationToken"]').val();
+$.ajaxPrefilter(function (options, originalOptions) {
+	options.async = true;
+	if (options.type.toUpperCase() == "POST") {
+		options.data = $.param($.extend(originalOptions.data, { __RequestVerificationToken: _requestVerificationToken }));
+	}
+});
+$.ajaxSetup({ cache: false });
 
-// Write your JavaScript code.
+
+const ajaxPostJsonAsync = (url, data) => {
+	return $.ajax({
+		url: url,
+		cache: false,
+		async: true,
+		type: "POST",
+		dataType: 'json',
+		data: data
+	});
+}
+
+
+const ajaxGetJsonAsync = (url, data) => {
+	return $.ajax({
+		url: url,
+		cache: false,
+		async: true,
+		type: "GET",
+		dataType: 'json',
+		data: data
+	});
+}
\ No newline at end of file