|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<title>URL.cut</title> |
|
<p></p> |
|
</head> |
|
<body> |
|
<h1>URLcut</h1> |
|
<label for="long-url">Enter a long link:</label> |
|
<p></p> |
|
<input type="text" id="long-url" placeholder="https://example.com"> |
|
<p></p> |
|
<button id="shorten-button">Shorten</button> |
|
<br> |
|
<p></p> |
|
<label for="short-url">Short link:</label> |
|
<p></p> |
|
<input type="text" id="short-url" readonly> |
|
<p></p> |
|
<script> |
|
document.getElementById("shorten-button").addEventListener("click", function() { |
|
var longUrl = document.getElementById("long-url").value; |
|
|
|
|
|
fetch("https://api-ssl.bitly.com/v4/shorten", { |
|
method: "POST", |
|
headers: { |
|
"Content-Type": "application/json", |
|
"Authorization": "YOUR_API_TOKEN_BITLY" |
|
}, |
|
body: JSON.stringify({ |
|
long_url: longUrl |
|
}) |
|
}) |
|
.then(response => response.json()) |
|
.then(data => { |
|
var shortUrl = data.link; |
|
document.getElementById("short-url").value = shortUrl; |
|
}) |
|
.catch(error => { |
|
console.error(error); |
|
document.getElementById("short-url").value = "Ошибка при сокращении ссылки."; |
|
}); |
|
}); |
|
</script> |
|
<p></p> |
|
Link shortener |
|
</body> |
|
</html> |
|
|
