| | <!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> |
| |
|
