Block all outgoing HTTP requests from page (javascript) [closed]

I am trying to make a very basic proxy just for learning purposes. The PHP file accesses a URL and displays it. I’m trying to block all outgoing HTTP requests from any links in the page displayed. I tried using a service worker but it does nothing – all requests go through.

proxy.php:

<script type="text/javascript">
function sendm(){
  navigator.serviceWorker.controller.postMessage('test');
}

if ('serviceWorker' in navigator) { 
  window.addEventListener('load', function() {
    navigator.serviceWorker.register('sw.js').then(function(registration) {
      console.log('Service worker registered with scope: ', registration.scope);
    }, function(err) {
      console.log('ServiceWorker registration failed: ', err);
    });
  });
}

  
</script>


<!DOCTYPE html>
<html>

<body>

<div class="content">

<?php


    $url = "www.ft.com";
    $curl = curl_init();
    curl_setopt($curl, CURLOPT_URL, $url);

    curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($curl, CURLOPT_FOLLOWLOCATION, true);
    $response = curl_exec($curl);
    echo $response;

?>
</div>
</body>
</html>

service worker:

self.addEventListener('fetch', function(event) {
  event.respondWith(
    //fetch(event.request)
  );
});

What am I doing wrong? The service worker is registered successfully, but just doesn’t block any requests.