read from kv to table

Read from a KV Store and output to HTML table

info

CF documentation: https://developers.cloudflare.com/workers/runtime-apis/kv/

addEventListener('fetch', event => {
    event.respondWith(handleRequest(event))
})

const style = `<style>
  table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
  }
  
  td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
  }
  
  tr:nth-child(even) {
  background-color: #dddddd;
  }
  </style>`

/**
* Respond to the request
* @param {Request} request
*/
async function handleRequest(event) {
    const allKeys = await COOKIES.list();

    var countOfKeys = allKeys.keys.length;
    console.log(allKeys)
    var html = style + "<h1>Output of KV Store values - " + countOfKeys + "</h1><table><tr><th>Name</th><th>Value</th></tr>";

    // Worker API limits are worker to 1000 requests MAX - that's 1 to get the list and 999 key values.
    if (countOfKeys > 999) {
        html += "<tr><td colspan='2'>List contains more than 999 entries - this data is incomplete.</td></tr>";
    }

    for (var i = 0; i < countOfKeys - 1; i++) // Worker API limits as above
    {
        var key = allKeys.keys[i].name;
        var value = await COOKIES.get(key);

        html += "<tr><td>" + key + "</td><td>" + value + "</td></tr>"
    }

    html += "</table>";

    return new Response(html, {
        headers: {
            "content-type": "text/html;charset=UTF-8",
        },
    });
}