sse-client.js

let currentEventSource = null;

function IsNullOrEmpty(str) {
    if (str === null) {
        return true;
    }
    if (typeof str === "string" && str.length === 0) {
        return true;
    }
    return false;
}

function ReadInputValue(name) {
    return document.getElementById(name).value;
}

function SetValue(name, value) {
    document.getElementById(name).value = value;
}

function SetHtml(name, value) {
    document.getElementById(name).innerHTML = value;
}

function HandleMessage(data) {
    const message = 
    `UserId: ${data.userId}, 
        Event: ${data.eventId}
        Completion: ${data.completionId}
        Status: ${data.status}
        Message: ${data.message} \n
    `

    document.getElementById("result").innerHTML += formatted + "<br>";
}

function ResetConnection() {
    if (typeof EventSource === "undefined") {
        throw new Error("SSE not supported");
    }
    if (currentEventSource !== null) {
        currentEventSource.close();
        currentEventSource = null;
    }

    const guid = ReadInputValue("clientId");
    const url = ` https://localhost:7267/api/sse/subscribe/${guid}`;

    currentEventSource = new EventSource(url);
    currentEventSource.onmessage = (e) => {
        const data = JSON.parse(event.data);

        HandleMessage(data);
    };
    SetHtml("usedId", guid);
}

function Send() {
    let sender = ReadInputValue("clientId");
    if (IsNullOrEmpty(sender)) {
        sender = null;
    }

    let recipient = ReadInputValue("recipient");
    if (IsNullOrEmpty(recipient)) {
        recipient = null;
    }

    const message = ReadInputValue("message");

    const param = {
        Sender: sender,
        Recipient: recipient,
        Message: message,
    };

    fetch("https://localhost:7067/api/EventSubscription/publish", {
        method: "POST",
        body: JSON.stringify(param),
        headers: {
            "Content-type": "application/json; charset=UTF-8",
        },
    });
}

function GetGuid() {
    const url = "https://localhost:7067/api/Guid";
    fetch(url)
        .then((response) => {
            if (response.ok) {
                return response.json();
            } else {
                throw new Error("Guid request failed");
            }
        })
        .then((data) => {
            SetValue("guid", data.guid);
        });
}