Improved encoding handling in text to speech

src/assistant/speechServer.ts

@@ -2,14 +2,15 @@ import * as http from 'http';
 import {parse}  from 'url';
 
 import CodemakerService from '../service/codemakerService';
+import availablePort from '../net/socket';
 
 export default class SpeechServer {
 
     private readonly codemakerSerivce: CodemakerService;    
 
     private readonly host = 'localhost';
 
-    private port: number = 52010;
+    private port: number = 52020;
 
     private server?: http.Server;
 
@@ -20,7 +21,9 @@ export default class SpeechServer {
     start() {
         const requestListener = (req: http.IncomingMessage, res: http.ServerResponse) => {
             const url = parse(req.url!, true);
-            this.codemakerSerivce.assistantSpeech(url.query['input'] as string).then((result) => {                                
+            const input = Buffer.from(url.query['input'] as string, 'base64url').toString('utf-8');
+
+            this.codemakerSerivce.assistantSpeech(input).then((result) => {                                
                 res.setHeader('Content-Type', 'audio/mp3');
                 res.writeHead(200);
                 res.write(result.audio);

webview/js/main.js

@@ -155,7 +155,8 @@ function createMessageElement(sender, message) {
         let audio = null;
         equalizerButtonElement.addEventListener('click', function(event) {            
             if (!audio) {
-                audio = new Audio(`${window.speachEndpoint}?input=${message.message}`);
+                const input = encodeBase64url(message.message);
+                audio = new Audio(`${window.speachEndpoint}?input=${input}`);
                 audio.autoplay = true;
                 ['pause', 'ended'].forEach(event => {
                     audio.addEventListener(event, () => {
@@ -248,3 +249,12 @@ function addCopyButtonToCodeBlocks(element) {
 function isAssistant(sender) {
     return sender === 'Assistant';
 }
+
+function encodeBase64url(input) {
+    const encoded = new TextEncoder().encode(input);
+    const bytes = Array.from(encoded, (byte) =>
+        String.fromCodePoint(byte),
+    ).join("");
+    const base64Encoded = btoa(bytes);
+    return base64Encoded.replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
+}