> ## Documentation Index
> Fetch the complete documentation index at: https://documentation.onesignal.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Web SDK - Özel Kod Kurulumu

> Özel kod entegrasyonu kullanarak OneSignal Web Push bildirimlerini kurma hakkında eksiksiz kılavuz. Chrome, Firefox, Safari ve diğer web tarayıcıları için JavaScript SDK, service worker'ları ve Safari sertifikalarını yapılandırın.

export const SdkReleasesIframe = ({sdkFilter = undefined, viewMode = undefined, height, ...frameProps}) => {
  const baseUrl = 'https://onesignal.github.io/sdk-releases';
  const buildUrl = (theme, sdkFilter, viewMode) => {
    const url = new URL(baseUrl);
    const params = new URLSearchParams();
    if (theme) {
      params.set('theme', theme);
    }
    if (sdkFilter) {
      params.set('sdk', sdkFilter);
    }
    if (viewMode) {
      params.set('viewMode', viewMode);
    }
    if (params.toString()) {
      url.search = params.toString();
    }
    return url.toString();
  };
  const detectTheme = () => {
    if (document.documentElement.classList.contains('dark')) {
      return 'dark';
    }
    return 'light';
  };
  const [theme, setTheme] = useState('light');
  const [iframeSrc, setIframeSrc] = useState(() => {
    const initialTheme = detectTheme();
    return buildUrl(initialTheme, sdkFilter, viewMode);
  });
  useEffect(() => {
    const currentTheme = detectTheme();
    setTheme(currentTheme);
    setIframeSrc(buildUrl(currentTheme, sdkFilter, viewMode));
    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
    const handleThemeChange = () => {
      const newTheme = detectTheme();
      setTheme(newTheme);
      setIframeSrc(buildUrl(newTheme, sdkFilter, viewMode));
    };
    if (mediaQuery.addEventListener) {
      mediaQuery.addEventListener('change', handleThemeChange);
    } else {
      mediaQuery.addListener(handleThemeChange);
    }
    window.addEventListener('storage', handleThemeChange);
    const observer = new MutationObserver(handleThemeChange);
    observer.observe(document.documentElement, {
      attributes: true,
      attributeFilter: ['class', 'data-theme']
    });
    return () => {
      if (mediaQuery.removeEventListener) {
        mediaQuery.removeEventListener('change', handleThemeChange);
      } else {
        mediaQuery.removeListener(handleThemeChange);
      }
      window.removeEventListener('storage', handleThemeChange);
      observer.disconnect();
    };
  }, [sdkFilter, viewMode]);
  const getIframeHeight = () => {
    if (viewMode === 'table') {
      return '450';
    }
    if (viewMode === 'mini') {
      return '170';
    }
    return '800';
  };
  const iframeHeight = height || getIframeHeight();
  return <Frame {...frameProps}>
      <iframe src={iframeSrc} width="100%" height={iframeHeight} frameBorder="0" style={{
    border: "none"
  }} title="SDK Releases" key={iframeSrc} />
    </Frame>;
};

<SdkReleasesIframe sdkFilter="react,vue,vue3,angular,wordpress" viewMode="table" height="380" />

<Warning>
  Bu Özel Kod kurulumunu yalnızca gelişmiş yapılandırma veya programatik kontrole ihtiyacınız varsa kullanın. Çoğu kullanıcı için şunları öneriyoruz:

  * [Tipik Web Push Kurulumu](./web-push-setup)
  * [WordPress Kurulumu](./wordpress)
  * [Shopify Kurulumu](./shopify)
</Warning>

Bir JavaScript framework'ü kullanıyorsanız bu özel kılavuzları takip edin:

* [Angular Kurulumu](./angular-setup)
* [React JS Kurulumu](./react-js-setup)
* [Vue JS Kurulumu](./vue-js-setup)

## Gereksinimler

* HTTPS web sitesi: Web push, HTTP'de veya gizli/özel modlarda çalışmaz.
* Sunucu erişimi: Sitenize bir service worker dosyası yüklemeniz gerekecektir.
* Tek kaynak: Web push, [Aynı kaynak politikasını](https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy) takip eder. Birden fazla kaynağınız (alan adı/alt alan adı) varsa birden fazla OneSignal uygulamasına ihtiyacınız olacaktır (kaynak başına bir tane). Bu tarayıcı kısıtlamasına uymak için şunlardan birini yapabilirsiniz:
  * Abonelikler için trafiği tek bir kaynağa yönlendirin.
  * Kaynak başına bir tane olmak üzere birden fazla OneSignal uygulaması oluşturun.

***

## OneSignal uygulamanızı ve platformunuzu yapılandırın

OneSignal panosunda:

* **Settings > Push & In-App > Web** bölümüne gidin.
* **Custom Code** entegrasyon türünü seçin.

### Site kurulumu

Site ayrıntılarını ekleyin:

* **Site Name**: Sitenizin adı ve varsayılan bildirim başlığı.
* **Site URL**: Sitenizin tam [kaynağı](https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy), örn. `https://yourdomain.com`. Siteniz bu şekilde yapılandırılmamışsa `www.` kullanmaktan kaçının. Birden fazla kaynağınız varsa [Gereksinimlere](#requirements) bakın.
* **Auto Resubscribe**: Kullanıcılar tarayıcı verilerini temizledikten sonra sitenize döndüklerinde otomatik olarak yeniden abone olmak için bunu etkinleştirin (yeni izin istemi gerekmez).
* **Default Icon URL**: Bildirimlerde ve istemlerde görünen kare `256x256px` PNG veya JPG resim yükleyin. Ayarlanmazsa varsayılan olarak bir zil simgesi kullanılır.

<Frame caption="OneSignal panosundaki Web ayarları">
  <img src="https://mintcdn.com/onesignal/uaUYB-ILUGPSRvKB/images/docs/web-push-site-settings.png?fit=max&auto=format&n=uaUYB-ILUGPSRvKB&q=85&s=893a536c16cb4c439bc8fe53892861da" alt="OneSignal web push configuration showing site name, URL, and icon settings" width="2072" height="712" data-path="images/docs/web-push-site-settings.png" />
</Frame>

#### Yerel test

Localhost'ta test etmek için üretim uygulamanızdan ayrı bir OneSignal uygulaması kullanın ve `init` seçeneklerinize `allowLocalhostAsSecureOrigin: true` ekleyin.

Kendi imzalı sertifikayla HTTPS üzerinde localhost test ediyorsanız Chrome'a `--allow-insecure-localhost` ile geçersiz sertifikaları yok saymasını söylemeniz gerekebilir. Firefox ve Safari, güvenlik sertifikaları için istisna eklemek üzere yerleşik mekanizmalar sağlar.

```html theme={null}
  <script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
  <script>
    window.OneSignalDeferred = window.OneSignalDeferred || [];
    OneSignalDeferred.push(function(OneSignal) {
      OneSignal.init({
        appId: "YOUR_OS_APP_ID",
        allowLocalhostAsSecureOrigin: true,
      });
    });
  </script>
```

### Safari web push sertifikası (isteğe bağlı)

OneSignal, Safari sertifikalarını otomatik olarak ücretsiz sağlar. Bunu yalnızca kullanmanız gereken mevcut Safari Web Push sertifikalarınız varsa etkinleştirin.

<Frame caption="Mevcut sertifikalar için Safari sertifika yükleme seçeneği">
  <img src="https://mintcdn.com/onesignal/uaUYB-ILUGPSRvKB/images/docs/web-push-safari-cert.png?fit=max&auto=format&n=uaUYB-ILUGPSRvKB&q=85&s=a7bbe7cac04c5b2b90988b67f6abc38c" alt="Safari certificate upload option" width="1876" height="882" data-path="images/docs/web-push-safari-cert.png" />
</Frame>

Etkinleştirilirse, `Safari Web .p12 Push Certificate`'ınızı yükleyin ve parolayı girin.

Devam etmek için **Save**'e tıklayın.

### Service worker dosyalarını yükleyin

Web push yapılandırmasının sonraki sayfasında `OneSignalSDKWorker.js` service worker dosyası sağlanacaktır.

Web SDK varsayılan olarak bu dosyayı sitenizin kökünde arar, örn. `https://yourdomain.com/OneSignalSDKWorker.js`. Dosya konumunu, adını ve kapsamını kodda değiştirebilirsiniz.

<Card title="OneSignal service worker" icon="gear" href="./onesignal-service-worker">
  Gelişmiş service worker yapılandırması, özel entegrasyon ve diğer sağlayıcılardan geçiş.
</Card>

### Siteye kod ekleyin

Bu kodu web sitenizin `<head>` bölümüne ekleyin. Şunları değiştirin:

* `YOUR_ONESIGNAL_APP_ID` yerine OneSignal panosundaki gerçek Uygulama ID'nizi yazın
* `YOUR_SAFARI_WEB_ID` yerine OneSignal panosundaki gerçek Safari Web ID'nizi yazın

```html HTML theme={null}
<script src="https://cdn.onesignal.com/sdks/web/v16/OneSignalSDK.page.js" defer></script>
<script>
  window.OneSignalDeferred = window.OneSignalDeferred || [];
  OneSignalDeferred.push(async function(OneSignal) {
    await OneSignal.init({
      appId: "YOUR_ONESIGNAL_APP_ID",
      safari_web_id: "YOUR_SAFARI_WEB_ID",
      notifyButton: {
        enable: true,
      },
    });
  });
</script>
```

### iOS web push desteği

Apple, iOS 16.4+ çalıştıran iPhone ve iPad'lerde web push bildirimlerini desteklemeye başladı. Desteklenen bir tarayıcıda ziyaret edildiğinde web push'un çalıştığı Android cihazların aksine Apple, `manifest.json` dosyası ve kullanıcının sitenizi ana ekranına eklemesi gibi birkaç ek gereksinim ekledi.

<Card title="iOS web push kurulumu" icon="apple" href="./web-push-for-ios">
  Gerekli `manifest.json` dosyasını ekleyin ve kullanıcıları sitenizi ana ekranlarına eklemeye yönlendirin.
</Card>

***

## OneSignal SDK entegrasyonunu test etme

Bu kılavuz, push bildirimleri ve abonelik kaydı test ederek OneSignal SDK entegrasyonunuzun düzgün çalıştığını doğrulamanıza yardımcı olur.

### Web push aboneliklerini kontrol edin

<Steps>
  <Step title="Test cihazında sitenizi başlatın.">
    * Test ederken Chrome, Firefox, Edge veya Safari kullanın.
    * **Gizli veya özel tarama modunu kullanmayın.** Kullanıcılar bu modlarda push bildirimlerine abone olamazlar.
    * İstemler [izin istemleri](/docs/en/permission-requests) yapılandırmanıza göre görünmelidir.
    * Push bildirimlerine abone olmak için yerel istemde **İzin Ver**'e tıklayın.

    <Frame caption="Web push yerel izin istemi">
      <img src="https://mintcdn.com/onesignal/FXJz6yFfOqztaEND/images/push/web-push-native-permission-prompt.png?fit=max&auto=format&n=FXJz6yFfOqztaEND&q=85&s=91c15dd6677de6a0ba37da20449ccca1" alt="Kullanıcıya bildirimlere izin verip vermeyeceğini soran tarayıcı yerel izin istemi" width="1724" height="974" data-path="images/push/web-push-native-permission-prompt.png" />
    </Frame>
  </Step>

  <Step title="OneSignal panonuzu kontrol edin">
    * **Kitle > Abonelikler**'e gidin.
    * **Abone** durumuna sahip yeni bir girdi görmelisiniz.

    <Frame caption="'Subscribed' durumuna sahip aboneliği gösteren pano">
      <img src="https://mintcdn.com/onesignal/KPVdijCt4_xCbkO8/images/dashboard/web-push-subscription-status.png?fit=max&auto=format&n=KPVdijCt4_xCbkO8&q=85&s=786e9c5e4131f01fef20d11bebd1a3d0" alt="Subscribed durumunda bir web push aboneliği gösteren OneSignal pano Abonelikler sayfası" width="1188" height="742" data-path="images/dashboard/web-push-subscription-status.png" />
    </Frame>

    <Check>Başarıyla bir [web push aboneliği](/docs/en/subscriptions) oluşturdunuz.
    Web push abonelikleri, kullanıcılar sitenizde push bildirimlerine ilk kez abone olduğunda oluşturulur.</Check>
  </Step>
</Steps>

### Test aboneliklerini ayarlayın

Test abonelikleri, bir mesaj göndermeden önce push bildirimi test etmek için yararlıdır.

<Steps>
  <Step title="Test Aboneliklerine ekleyin.">
    Panoda, aboneliğin yanında **Seçenekler (üç nokta)** düğmesine tıklayın ve **Test Aboneliklerine Ekle**'yi seçin.

    <Frame caption="Test Aboneliklerine cihaz ekleme">
      <img src="https://mintcdn.com/onesignal/NCUI56Tiw7V-s0dT/images/dashboard/add-to-test-subscriptions.png?fit=max&auto=format&n=NCUI56Tiw7V-s0dT&q=85&s=2455d4cd74ea4ad686f76730cd95bbaa" alt="Test Aboneliklerine Ekle seçeneğini gösteren abonelikteki seçenekler menüsü" width="1188" height="742" data-path="images/dashboard/add-to-test-subscriptions.png" />
    </Frame>
  </Step>

  <Step title="Aboneliğinizi adlandırın.">
    Cihazınızı daha sonra **Test Abonelikleri sekmesinde** kolayca tanımlayabilmeniz için aboneliği adlandırın.
  </Step>

  <Step title="Test kullanıcıları segmenti oluşturun.">
    **Kitle > Segmentler > Yeni Segment**'e gidin.
  </Step>

  <Step title="Segmenti adlandırın.">
    Segmenti `Test Users` olarak adlandırın (ad önemlidir çünkü daha sonra kullanılacaktır).
  </Step>

  <Step title="Test Users filtresini ekleyin ve Create Segment'e tıklayın.">
    <Frame caption="Test Users filtresi ile 'Test Users' segmenti oluşturma">
      <img src="https://mintcdn.com/onesignal/NCUI56Tiw7V-s0dT/images/dashboard/create-test-users-segment.png?fit=max&auto=format&n=NCUI56Tiw7V-s0dT&q=85&s=91b8a021be6e83662854e68ec3e1da04" alt="Test Users filtresi seçilmiş ve segment Test Users olarak adlandırılmış segment editörü" width="1188" height="742" data-path="images/dashboard/create-test-users-segment.png" />
    </Frame>

    <Check>Başarıyla test kullanıcıları segmenti oluşturdunuz.
    Artık bu bireysel cihaza ve test kullanıcı gruplarına mesaj göndermeyi test edebiliriz.</Check>
  </Step>
</Steps>

### API aracılığıyla test push gönderin

<Steps>
  <Step title="Uygulama API Anahtarınızı ve Uygulama ID'nizi alın.">
    OneSignal panonuzda **Ayarlar > [Anahtarlar & ID'ler](/docs/en/keys-and-ids)**'e gidin.
  </Step>

  <Step title="Sağlanan kodu güncelleyin.">
    Aşağıdaki koddaki `YOUR_APP_API_KEY` ve `YOUR_APP_ID` değerlerini gerçek anahtarlarınızla değiştirin. Bu kod, daha önce oluşturduğumuz `Test Users` segmentini kullanır.

    ```curl theme={null}
    curl -X \
    POST --url 'https://api.onesignal.com/notifications' \
     --header 'content-type: application/json; charset=utf-8' \
     --header 'authorization: Key YOUR_APP_API_KEY' \
     --data \
     '{
      "app_id": "YOUR_APP_ID",
      "target_channel": "push",
      "name": "Testing basic setup",
      "headings": {
      	"en": "👋"
      },
      "contents": {
        "en": "Hello world!"
      },
      "included_segments": [
        "Test Users"
      ],
      "chrome_web_image": "https://avatars.githubusercontent.com/u/11823027?s=200&v=4"
    }'
    ```
  </Step>

  <Step title="Kodu çalıştırın.">
    Kodu terminalinizde çalıştırın.
  </Step>

  <Step title="Görselleri ve onaylanmış teslimatı kontrol edin.">
    Tüm kurulum adımları başarıyla tamamlandıysa, test abonelikleri bir bildirim almalıdır.

    <Warning>Yalnızca Chrome görselleri destekler. Görseller daraltılmış bildirim görünümünde küçük görünecektir. Tam görseli görmek için bildirimi genişletin.</Warning>

    <Frame caption="Chrome macOS'ta görsel içeren genişletilmiş push bildirimi">
      <img src="https://mintcdn.com/onesignal/FXJz6yFfOqztaEND/images/push/web-push-image.png?fit=max&auto=format&n=FXJz6yFfOqztaEND&q=85&s=8dd90279daff9e24d3fd281e73aa1e74" alt="macOS Chrome'da özel görsel gösteren genişletilmiş push bildirimi" width="740" height="896" data-path="images/push/web-push-image.png" />
    </Frame>
  </Step>

  <Step title="Onaylanmış teslimatı kontrol edin.">
    Panonuzda **Teslimat > Gönderilen Mesajlar**'a gidin, ardından istatistikleri görüntülemek için mesaja tıklayın. Cihazın push'u aldığını gösteren **onaylandı** istatistiğini görmelisiniz.

    <Note>Safari, Onaylanmış Teslimatı desteklemez.</Note>

    <Card title="Push bildirimi mesaj raporları" icon="chart-bar" href="/docs/en/push-notification-message-reports">
      Push bildirimlerinizin teslimat, tıklama ve dönüşüm istatistiklerini görüntüleyin.
    </Card>
  </Step>
</Steps>

<Check>API aracılığıyla bir segmente başarıyla bildirim gönderdiniz.</Check>

Bildirimler ulaşmıyorsa, aşağıdaki bilgilerle `support@onesignal.com` ile iletişime geçin:

* API isteği ve yanıtını bir `.txt` dosyasına kopyalayıp yapıştırın
* Abonelik ID'niz
* OneSignal koduyla web sitesi URL'niz

***

## Kullanıcı tanımlama

Önceki bölümde web push [Abonelikleri](/docs/en/subscriptions) oluşturma ele alındı. Bu bölüm, OneSignal SDK'yı kullanarak tüm abonelikler (push, e-posta ve SMS dahil) üzerinden [Kullanıcıları](/docs/en/users) tanımlamaya genişler. Kullanıcıları platformlar arasında birleştirmenize ve etkileşime geçirmenize yardımcı olmak için Harici ID'ler, etiketler, çok kanallı abonelikler, gizlilik ve etkinlik izleme konularını kapsar.

### Harici ID ata

Arka ucunuzun kullanıcı tanımlayıcısını kullanarak kullanıcıları cihazlar, e-posta adresleri ve telefon numaraları arasında tutarlı bir şekilde tanımlamak için Harici ID kullanın. Bu, mesajlaşmanızın kanallar ve 3. taraf sistemler arasında birleşik kalmasını sağlar (özellikle [Entegrasyonlar](/docs/en/integrations) için önemlidir).

SDK'nın [`login` metodu](/docs/en/web-sdk-reference#login-external-id) ile uygulamanız her kullanıcıyı tanımladığında Harici ID'yi ayarlayın.

<Note>
  OneSignal, abonelikler (Abonelik ID) ve kullanıcılar (OneSignal ID) için benzersiz salt okunur ID'ler oluşturur.

  Kullanıcılar uygulamanızı farklı cihazlara indirdikçe, web sitenize abone oldukça ve/veya uygulamanızın dışında size e-posta adresleri ve telefon numaraları sağladıkça yeni abonelikler oluşturulacaktır.

  Nasıl oluşturulduklarına bakılmaksızın kullanıcıları tüm abonelikleri üzerinden tanımlamak için SDK aracılığıyla Harici ID'yi ayarlamak şiddetle önerilir.
</Note>

### Veri etiketleri ekleyin

[Etiketler](/docs/en/add-user-data-tags), kullanıcı özelliklerini (`username`, `role` veya tercihler gibi) ve etkinlikleri (`purchase_date`, `game_level` veya kullanıcı etkileşimleri gibi) depolamak için kullanabileceğiniz anahtar-değer çiftleri dizgisi verisidir. Etiketler, daha gelişmiş kullanım durumlarına olanak tanıyan gelişmiş [Mesaj Kişiselleştirme](/docs/en/message-personalization) ve [Segmentasyonu](/docs/en/segmentation) destekler.

Uygulamanızda etkinlikler gerçekleştikçe SDK'nın [`addTag` ve `addTags` metotları](/docs/en/web-sdk-reference#addtag-%2C-addtags) ile etiketleri ayarlayın.

Bu örnekte, kullanıcı `current_level` adlı etiket tarafından `6` değerine ayarlanarak tanımlanabilen 6. seviyeye ulaştı.

<Frame caption="OneSignal'da &#x22;current_level&#x22; adlı etiketi &#x22;6&#x22; olarak ayarlanmış bir kullanıcı profili">
  <img src="https://mintcdn.com/onesignal/4HyuQPBpu-4xjmQC/images/docs/d4674261847231079fecc176ba88065409c90943e3854b9df200457325a0aed4-Screenshot_2025-03-18_at_14.47.25.png?fit=max&auto=format&n=4HyuQPBpu-4xjmQC&q=85&s=91083bf83a4c03ea40d485b23f072259" width="1380" height="941" data-path="images/docs/d4674261847231079fecc176ba88065409c90943e3854b9df200457325a0aed4-Screenshot_2025-03-18_at_14.47.25.png" />
</Frame>

5 ile 10 arasında seviyeye sahip kullanıcılardan oluşan bir segment oluşturabilir ve bunu hedefli ve kişiselleştirilmiş mesajlar göndermek için kullanabiliriz:

<Frame caption="4'ten büyük ve 10'dan küçük current_level değerine sahip kullanıcıları hedefleyen bir segmenti gösteren segment editörü">
  <img src="https://mintcdn.com/onesignal/3zq1PvSaqvUE2bIx/images/docs/300d36b632a6f6d7017780457bbe2610b71767fd0db093c7611e59714dcbda5b-Screenshot_2025-03-18_at_14.49.56.png?fit=max&auto=format&n=3zq1PvSaqvUE2bIx&q=85&s=b84ab0d2c6eedbd6d4e7a2bf15afe103" width="1380" height="941" data-path="images/docs/300d36b632a6f6d7017780457bbe2610b71767fd0db093c7611e59714dcbda5b-Screenshot_2025-03-18_at_14.49.56.png" />
</Frame>

<br />

<Frame caption="Kişiselleştirilmiş mesajla Seviye 5-10 segmentini hedefleyen bir push bildirimini gösteren ekran görüntüsü">
  <img src="https://mintcdn.com/onesignal/tc0EvmtSSX56SX0c/images/docs/97e09b42d25c6d3f4c7cb0a6fff4dfb8893cbb4b283f7ff1f77977c33113319c-Screenshot_2025-03-18_at_14.55.47.png?fit=max&auto=format&n=tc0EvmtSSX56SX0c&q=85&s=c7839b12057d65a12a4eaddce6e2c11f" width="2764" height="2286" data-path="images/docs/97e09b42d25c6d3f4c7cb0a6fff4dfb8893cbb4b283f7ff1f77977c33113319c-Screenshot_2025-03-18_at_14.55.47.png" />
</Frame>

### E-posta ve/veya SMS abonelikleri ekleyin

OneSignal SDK, kullanıcılar kabul ettiğinde otomatik olarak web push abonelikleri oluşturur. İlgili abonelikleri oluşturarak kullanıcılara e-posta ve SMS kanalları aracılığıyla da ulaşabilirsiniz.

* E-posta abonelikleri oluşturmak için [`addEmail` metodunu](/docs/en/web-sdk-reference#addemail-%2C-removeemail) kullanın.
* SMS abonelikleri oluşturmak için [`addSms` metodunu](/docs/en/web-sdk-reference#addsms-%2C-removesms) kullanın.

E-posta adresi ve/veya telefon numarası OneSignal uygulamasında zaten mevcutsa, SDK bunu mevcut kullanıcıya ekleyecektir, kopyalar oluşturmayacaktır.

Birleştirilmiş kullanıcıları panoda **Kitle > Kullanıcılar** aracılığıyla veya [Kullanıcıyı görüntüle API'si](/reference/view-user) ile görüntüleyebilirsiniz.

<Frame caption="Harici ID tarafından birleştirilmiş push, e-posta ve SMS aboneliklerine sahip bir kullanıcı profili">
  <img src="https://mintcdn.com/onesignal/56ctKxZSV4m5VEkn/images/docs/b1cf9999d41da6e4ce333e1126612529b85eac47447bb0b434418d082f595acd-Screenshot_2025-03-18_at_14.43.46.png?fit=max&auto=format&n=56ctKxZSV4m5VEkn&q=85&s=7c3885b66e44e097fa0ed7c47f27c911" width="1506" height="848" data-path="images/docs/b1cf9999d41da6e4ce333e1126612529b85eac47447bb0b434418d082f595acd-Screenshot_2025-03-18_at_14.43.46.png" />
</Frame>

<Note>
  Çok kanallı iletişim için en iyi uygulamalar

  * E-posta veya SMS abonelikleri eklemeden önce açık onay alın.
  * Kullanıcılara her iletişim kanalının faydalarını açıklayın.
  * Kullanıcıların hangi kanalları tercih ettiklerini seçebilmeleri için kanal tercihleri sağlayın.
</Note>

***

### Gizlilik ve kullanıcı onayı

OneSignal'ın kullanıcı verilerini ne zaman topladığını kontrol etmek için SDK'nın onay kapısı metotlarını kullanın:

* [`setConsentRequired(true)`](/docs/en/web-sdk-reference#setconsentrequired): Onay verilene kadar veri toplamayı engeller.
* [`setConsentGiven(true)`](/docs/en/web-sdk-reference#setconsentgiven): Onay verildiğinde veri toplamayı etkinleştirir.

Gizlilik ve güvenlik hakkında daha fazla bilgi için:

<Columns cols={2}>
  <Card title="SDK tarafından toplanan veriler" icon="database" href="/docs/en/data-collected-by-the-onesignal-sdk">
    OneSignal SDK'nın kullanıcılardan topladığı verileri inceleyin.
  </Card>

  <Card title="Kişisel verilerin işlenmesi" icon="shield-halved" href="/docs/en/handling-personal-data">
    Gizlilik düzenlemelerine uygun olarak kullanıcı verilerini yönetin ve koruyun.
  </Card>
</Columns>

***

## Push, kullanıcı ve uygulama içi etkinlikleri dinleyin

Kullanıcı eylemlerine ve durum değişikliklerine tepki vermek için SDK dinleyicilerini kullanın.

SDK, bağlanabileceğiniz birkaç etkinlik dinleyicisi sağlar. Daha fazla ayrıntı için [SDK referans kılavuzumuza](/docs/en/web-sdk-reference) bakın.

### Push bildirimi etkinlikleri

* [Tıklama etkinliği dinleyicisi](/docs/en/web-sdk-reference#click): Bir bildirimin ne zaman dokunulduğunu tespit edin.
* [Ön plan yaşam döngüsü dinleyicisi](/docs/en/web-sdk-reference#foregroundwilldisplay): Bildirimlerin ön planda nasıl davrandığını kontrol edin.

### Kullanıcı durumu değişiklikleri

* [Kullanıcı durumu değişiklik etkinliği dinleyicisi](/docs/en/web-sdk-reference#addeventlistener-user-state): Harici ID'nin ne zaman ayarlandığını tespit edin.
* [İzin gözlemcisi](/docs/en/web-sdk-reference#permissionchange): Kullanıcının yerel push izin istemi ile belirli etkileşimini izleyin.
* [Push aboneliği değişiklik gözlemcisi](/docs/en/web-sdk-reference#addeventlistener-push-subscription-changes): Push abonelik durumunun ne zaman değiştiğini izleyin.

***

## Gelişmiş kurulum ve yetenekler

Entegrasyonunuzu geliştirmek için daha fazla yeteneği keşfedin:

<Columns cols={3}>
  <Card title="OneSignal'a Geçiş" icon="rotate" href="/docs/en/migrating-to-onesignal">
    Başka bir push sağlayıcısından OneSignal'a geçin.
  </Card>

  <Card title="Entegrasyonlar" icon="plug" href="/docs/en/integrations">
    OneSignal'ı üçüncü taraf araçlar ve platformlarla bağlayın.
  </Card>

  <Card title="Eylem düğmeleri" icon="bell" href="/docs/en/action-buttons">
    Push bildirimlerine etkileşimli düğmeler ekleyin.
  </Card>

  <Card title="Çok dilli mesajlaşma" icon="globe" href="/docs/en/multi-language-messaging">
    Kullanıcılara tercih ettikleri dilde yerelleştirilmiş mesajlar gönderin.
  </Card>

  <Card title="Kimlik Doğrulama" icon="shield-check" href="/docs/en/identity-verification">
    Sunucu tarafı Kimlik Doğrulama ile SDK entegrasyonunuzu güvenli hale getirin.
  </Card>

  <Card title="Özel Sonuçlar" icon="chart-line" href="/docs/en/custom-outcomes">
    Mesajlarınıza bağlı özel dönüşüm olaylarını izleyin.
  </Card>
</Columns>

### Web SDK kurulumu ve referansı

<Columns cols={2}>
  <Card title="Web push kurulumu" icon="gear" href="/docs/en/web-push-setup">
    Entegrasyonunuz için tüm temel web push özelliklerini etkinleştirin.
  </Card>

  <Card title="Web SDK referansı" icon="code" href="/docs/en/web-sdk-reference">
    Mevcut metotlar ve yapılandırma seçenekleri hakkında tam ayrıntılar.
  </Card>
</Columns>

<Check>Tebrikler! Web SDK kurulum kılavuzunu başarıyla tamamladınız.</Check>

***

***

## SSS

### Web push bildirimleri için HTTPS'ye ihtiyacım var mı?

Evet. Tüm modern tarayıcılar push bildirim desteği için HTTPS gerektirir. Siteniz HTTP kullanıyorsa, web push'u kurmadan önce HTTPS'ye geçmeniz gerekir.

### Bu kurulumu tek sayfalı uygulama (SPA) ile kullanabilir miyim?

Evet. Custom Code kurulumu, React, Angular veya Vue gibi framework'lerle oluşturulmuş SPA'lar için önerilen yaklaşımdır. [Angular](./angular-setup), [React](./react-js-setup) ve [Vue](./vue-js-setup) için framework'e özgü kılavuzlar [bu sayfanın üst kısmında](#) yer almaktadır.

### Bir kullanıcı tarayıcı verilerini temizlerse ne olur?

Kullanıcının push aboneliği kaldırılır. **Auto Resubscribe** etkinleştirilmişse, bir sonraki site ziyaretlerinde otomatik olarak yeniden abone olurlar.

***

## İlgili sayfalar

<Columns cols={2}>
  <Card title="İzin İstekleri" icon="bell" href="./permission-requests">
    Kullanıcıların abone olmaya ne zaman ve nasıl davet edileceğini yapılandırın.
  </Card>

  <Card title="Web SDK Referansı" icon="code" href="./web-sdk-reference">
    OneSignal Web SDK için tam API referansı.
  </Card>
</Columns>