fastAPI / index.html
Almaatla's picture
Create index.html
334632d verified
raw
history blame
2.42 kB
<!DOCTYPE html>
<html>
<head>
<title>Text Embedding and Similarity Search</title>
</head>
<body>
<h1>Text Embedding and Similarity Search</h1>
<h2>Embed a string</h2>
<form id="embed-form">
<label for="embed-input">String to embed:</label><br>
<input type="text" id="embed-input" name="embed-input"><br>
<input type="submit" value="Embed">
</form>
<h2>Search for a string</h2>
<form id="search-form">
<label for="search-input">String to search:</label><br>
<input type="text" id="search-input" name="search-input"><br>
<label for="n-input">Number of results to return:</label><br>
<input type="number" id="n-input" name="n-input" min="1" value="5"><br>
<input type="submit" value="Search">
</form>
<div id="results"></div>
<script>
document.getElementById("embed-form").addEventListener("submit", function(event) {
event.preventDefault();
const text = document.getElementById("embed-input").value;
fetch("/embed", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({text: text})
})
.then(response => response.json())
.then(data => {
document.getElementById("results").innerHTML = data.message;
});
});
document.getElementById("search-form").addEventListener("submit", function(event) {
event.preventDefault();
const text = document.getElementById("search-input").value;
const n = document.getElementById("n-input").value;
fetch("/search", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({text: text, n: n})
})
.then(response => response.json())
.then(data => {
let resultsHtml = `<h3>Top ${n} results:</h3>`;
for (let i = 0; i < data.distances.length; i++) {
resultsHtml += `<p>${i+1}. Index: ${data.indices[i]}, Distance: ${data.distances[i]}</p>`;
}
document.getElementById("results").innerHTML = resultsHtml;
});
});
</script>
</body>
</html>