Installation

Installieren Sie das Consent SDK in Ihrem Projekt.

NPM Package

$ npm install @breakpilot/consent-sdk

Framework-spezifische Imports

Vanilla JavaScript

import { ConsentManager } from '@breakpilot/consent-sdk';

const consent = new ConsentManager({
  apiEndpoint: 'https://api.example.com/consent',
  siteId: 'your-site-id',
});

await consent.init();

React

import { ConsentProvider, useConsent } from '@breakpilot/consent-sdk/react';

function App() {
  return (
    <ConsentProvider
      config={{
        apiEndpoint: 'https://api.example.com/consent',
        siteId: 'your-site-id',
      }}
    >
      <YourApp />
    </ConsentProvider>
  );
}

Vue 3

import { createApp } from 'vue';
import { ConsentPlugin } from '@breakpilot/consent-sdk/vue';

const app = createApp(App);

app.use(ConsentPlugin, {
  apiEndpoint: 'https://api.example.com/consent',
  siteId: 'your-site-id',
});

Script Blocking einrichten

Um Third-Party Scripts automatisch zu blockieren, verwenden Sie das data-consent Attribut:

<!-- Analytics Script (blockiert bis Consent) -->
<script
  data-consent="analytics"
  data-src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"
  type="text/plain"
></script>

<!-- Marketing Script (blockiert bis Consent) -->
<script data-consent="marketing" type="text/plain">
  fbq('init', 'YOUR_PIXEL_ID');
</script>

<!-- Embedded iFrame (blockiert bis Consent) -->
<iframe
  data-consent="social"
  data-src="https://www.youtube.com/embed/VIDEO_ID"
  width="560"
  height="315"
></iframe>

Systemvoraussetzungen

Anforderung	Minimum
Node.js	>= 18.0.0
React (optional)	>= 17.0.0
Vue (optional)	>= 3.0.0
TypeScript (optional)	>= 4.7.0

Browser-Unterstuetzung

Das SDK unterstuetzt alle modernen Browser mit ES2017+ Unterstuetzung. Fuer aeltere Browser wird ein automatischer Fallback fuer Crypto-Funktionen bereitgestellt.

Browser	Minimum Version
Chrome	>= 60
Firefox	>= 55
Safari	>= 11
Edge	>= 79 (Chromium)