Creating short links from JavaScript application

Short links can be created by using:

a POST HTTP request to https://api.short.io/links/public, with JSON body;

How to create short links by using JavaScript

1) Get your public API key here: https://app.short.io/settings/integrations/api-key

Click "Create API key".
Add a Public key.

2) Use the script below.

📘
Remember to paste appropriate values to the following objects: "domain" and "authorization".

var data = {
    "domain":"YOUR_DOMAIN",
    "originalURL": document.getElementById(ID).value
    }; 
 fetch('https://api.short.io/links/public', {
    method: 'post',
    headers: {
      'accept': 'application/json',
      'Content-Type': 'application/json',
      'authorization': 'PUBLIC_API_KEY'
    },
    body: JSON.stringify(data)
  }).then(function(response){ 
     return response.json();
    }).then(function(data){
    alert(data.shortURL)
    })
 }

3) JSON Response (a new link is created).

Most important parameter here is the "shortURL" (the URL of the newly-created short link).

{
  "id":271395962,
  "originalURL":"https://your-long-url.com",
  "DomainId":9026,
  "archived":false,
  "path":"LwM61L",
  "source":"public",
  "redirectType":null,
  "createdAt":"2020-04-02T11:41:21.589Z",
  "OwnerId":9346,
  "updatedAt":"2020-04-02T11:41:21.589Z",
  "secureShortURL":"https://example.com/LwM61L",
  "shortURL":"https://example.com/LwM61L",
  "duplicate":false
}

4) Here's how the script and HTML are operating:

5) Use this code to reproduce the above behavior.

<html>
  <head>
    <link>
  </head>
  <body>
    <h1 class="message">Shorten your first link!</h1>
      <div>
          <input name="text" type="url" value  id="linkinput" placeholder="Paste a URL to shorten" >
          <input type="submit" id="myinput" value="Shorten">
      </div>
    <p id="message"></p>
 <script>
document.getElementById("myinput").onclick = function() {
  var link = document.getElementById("linkinput").value;
  var data = {
    "domain":"YOUR_DOMAIN",
    "originalURL": link,
    "allowDuplicates":false }; 
 fetch('https://api.short.cm/links/public', {
    method: 'post',
    headers: {
      'accept': 'application/json',
      'Content-Type': 'application/json',
      'authorization': 'API_KEY'
    },
    body: JSON.stringify(data)
  }) .then(function(response) {
        return response.json();
    }) 
    .then(function(data){ 
    document.getElementById("message").innerHTML = "Your short link is " + data.shortURL })
    document.getElementById("linkinput").value='';
 }
    </script>
  </body>
</html>

Down below, you can find a video tutorial on creating a public link shortener:

(Video courtesy of Ryder Cragie)