rawalcher/short-link-backend
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

integrate files with serving (even though ugly)

Browse source
This commit is contained in:
= 2024-12-16 20:17:09 +01:00
parent 63fd2b7cca
commit 897310fe28
7 changed files with 83 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/index.html
View file

@ -24,6 +24,7 @@
flex-direction: column;
align-items: center;
justify-content: center;
background-color: transparent;
}
</style>
</head>
@ -38,6 +39,7 @@
<input type="button" id="shortenButton" value="Submit">
</div>
<div id="output-container"></div>
<div id="error-container"></div>
</div>
<script src="index.js"></script>
</body>

14
frontend/index.js
View file

@ -17,18 +17,26 @@ document.getElementById("urlInput").addEventListener("input", function() {
document.getElementById("shortenButton").addEventListener("click", async function() {
const urlInput = document.getElementById("urlInput").value;
const outputContainer = document.getElementById("output-container");
const errorContainer = document.getElementById("error-container");
if (urlInput) {
// const shortenedUrl = urlInput + "-short"; // only for testing
const shortenedUrl = await fetch("0.0.0.0:8080/", {
const response = await fetch("/", {
method: "POST",
headers: {
"Content-Type": "text/plain",
},
body: urlInput,
});
outputContainer.innerHTML = `<p>Shortened URL: <a href="${shortenedUrl}" target="_blank">${shortenedUrl}</a></p>`;
if (response.ok){
const shortenedUrl = await response.text();
outputContainer.innerHTML = `<p>Shortened URL: <a href="${shortenedUrl}" target="_blank">${shortenedUrl}</a></p>`;
errorContainer.innerHTML = "";
}else{
const error = await response.text();
errorContainer.innerHTML = `<p>Something went wrong: ${error}</p>`;
outputContainer.innerHTML = "";
}
}
});