Added CF Worker caching

README.md

@@ -27,7 +27,6 @@ Licensed under the permissive MIT license. Feel free to send a pull request!
 ### Things to tackle in the future
 
 - Combining multiple images together (would be outside CF Worker)
-- Caching responses (I haven't done this yet as this is still being actively worked on!)
 - Caching guest token (So we don't have to bother Twitter for one on every request)
 
 ### Bugs or issues?

src/constants.ts

@@ -41,8 +41,8 @@ export const Constants = {
   },
   RESPONSE_HEADERS: {
     'content-type': 'text/html;charset=UTF-8',
-    'x-powered-by': '🏳️‍⚧️ Trans Rights'
+    'x-powered-by': '🏳️‍⚧️ Trans Rights',
-    // 'cache-control': 'max-age=1'
+    'cache-control': 'max-age=86400'
   },
   DEFAULT_COLOR: '#10A3FF'
 };

src/server.ts

@@ -23,22 +23,44 @@ String.prototype.format = function (options: any) {
 
 const router = Router();
 
-const statusRequest = async (request: any) => {
+const statusRequest = async (request: any, event: FetchEvent) => {
   const { id, mediaNumber } = request.params;
   const url = new URL(request.url);
   const userAgent = request.headers.get('User-Agent');
 
   if (userAgent.match(/bot/gi) !== null) {
-    return new Response(await handleStatus(id, parseInt(mediaNumber || 1), userAgent), {
+    // https://developers.cloudflare.com/workers/examples/cache-api/
+    const cacheUrl = new URL(request.url);
+    const cacheKey = new Request(cacheUrl.toString(), request);
+    const cache = caches.default;
+    
+    let response = await cache.match(cacheKey);
+
+    if (response) {
+      console.log('Cache hit');
+      return response;
+    }
+
+    console.log('Cache miss');
+
+    response = new Response(await handleStatus(id, parseInt(mediaNumber || 1), userAgent), {
       headers: Constants.RESPONSE_HEADERS,
       status: 200
     });
+
+    // Store the fetched response as cacheKey
+    // Use waitUntil so you can return the response without blocking on
+    // writing to cache
+    event.waitUntil(cache.put(cacheKey, response.clone()));
+
+    return response;
+
   } else {
     return Response.redirect(`${Constants.TWITTER_ROOT}${url.pathname}`, 302);
   }
 };
 
-const profileRequest = async (request: any) => {
+const profileRequest = async (request: any, _event: FetchEvent) => {
   const { handle } = request.params;
   const url = new URL(request.url);
 
@@ -92,5 +114,5 @@ router.all('*', async request => {
   Event to receive web requests on Cloudflare Worker
 */
 addEventListener('fetch', (event: FetchEvent) => {
-  event.respondWith(router.handle(event.request));
+  event.respondWith(router.handle(event.request, event));
 });