วิธีการติดตั้ง Umami ใน Astro

1
<script defer src="https://cloud.umami.is/script.js" data-website-id="<ID>" ></script>

1
<script defer src="/my-script.js" data-website-id="<ID>"></script>

1
const ScriptName = '/script.js';
2
const Endpoint = '/api/send';
3

4
const ScriptWithoutExtension = ScriptName.replace('.js', '')
5

6
addEventListener('fetch', event => {
7
    event.passThroughOnException();
8
    // stop send request to umami and just return 200 ok
9
    event.respondWith(handleRequest(event));
10

11
    return new Response(null, { status: 404 });
12
})
13

14
async function handleRequest(event) {
15
  const pathname = new URL(event.request.url).pathname
16
  const [baseUri, ...extensions] = pathname.split('.')
17

18
  if (baseUri.endsWith(ScriptWithoutExtension)) {
19
      return getScript(event, extensions)
20
  } else if (pathname.endsWith(Endpoint)) {
21
      return postData(event)
22
  }
23
  return new Response(null, { status: 404 })
24
}
25

26
async function getScript(event, extensions) {
27
    let response = await caches.default.match(event.request);
28
    if (!response) {
29
        response = await fetch("https://cloud.umami.is/script.js");
30
        event.waitUntil(caches.default.put(event.request, response.clone()));
31
    }
32
    return response;
33
}
34

35
async function postData(event) {
36
    const request = new Request(event.request);
37
    request.headers.delete('cookie');
38
    return await fetch("https://api-gateway.umami.dev/api/send", request);
39
}

1
<script
2
  defer
3
  is:inline
4
  data-astro-rerun
5
  src="https://cloud.umami.is/script.js"
6
  data-website-id="<ID>">
7
</script>