To get Databuddy working with Astro you first need to add the snippet provided to the end of your body tag. The easiest way to do this is with a shared layout component.

--- layouts/base.astro ---

<body>
<script
      src="https://cdn.databuddy.cc/databuddy.js"
      data-client-id="..."
      data-enable-batching="true"
      crossorigin="anonymous"
      async></script>
</body>

However at this point the snippet won’t work as expected. That’s because by default Astro performs some processing on script tags.

To fix this we simply need to add the is:inline directive to the script tag.

--- layouts/base.astro ---

<body>
<script
      is:inline
      src="https://cdn.databuddy.cc/databuddy.js"
      data-client-id="..."
      data-enable-batching="true"
      crossorigin="anonymous"
      async></script>
</body>

Explanation

The performance optimisations that Astro performs causes the Databuddy script to be executed as a module.

Since the script relys on document.currentScript to be available as opposed to the import.meta object available in modules, the script will fail to initialise.

Adding the is:inline directive fixes this by preventing Astro from processing the script tag. This is good practice for any CDN-hosted scripts you add to your site.

Databuddy + Astro

Explanation