webhook.user.js

// ==UserScript==
// @name         Webhook Stream Request - Top Frame
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  GM_xmlhttpRequest ile stream response
// @author       You
// @match        *://*/*
// @grant        GM_xmlhttpRequest
// @connect      webhook.site
// @connect      *
// @run-at       document-start
// ==/UserScript==

(function() {
  'use strict';

  // Body'ye log container ekle
  const logContainer = document.createElement('div');
  logContainer.id = 'webhook-log-container';
  logContainer.style.cssText = `
    position: fixed;
    top: 10px;
    right: 10px;
    width: 450px;
    max-height: 700px;
    background: #ffffff;
    color: #000000;
    border: 2px solid #333333;
    border-radius: 8px;
    padding: 15px;
    font-family: 'Courier New', monospace;
    font-size: 12px;
    overflow-y: auto;
    z-index: 999999;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  `;
  document.documentElement.appendChild(logContainer);

  // Log fonksiyonu
  function addLog(message, type = 'info') {
    const logEntry = document.createElement('div');
    const timestamp = new Date().toLocaleTimeString();

    let color = '#000000';
    let prefix = '📝';

    if (type === 'error') {
      color = '#ff0000';
      prefix = '❌';
    } else if (type === 'success') {
      color = '#00aa00';
      prefix = '✅';
    } else if (type === 'progress') {
      color = '#ff8800';
      prefix = '📊';
    } else if (type === 'start') {
      color = '#0066cc';
      prefix = '🚀';
    } else if (type === 'header') {
      color = '#9900cc';
      prefix = '📋';
    }

    logEntry.style.cssText = `
      color: ${color};
      margin: 8px 0;
      padding: 5px;
      border-left: 3px solid ${color};
      padding-left: 10px;
      word-break: break-all;
    `;

    logEntry.textContent = `[${timestamp}] ${prefix} ${message}`;
    logContainer.appendChild(logEntry);
    logContainer.scrollTop = logContainer.scrollHeight;
  }

  // ReadyState açıklaması
  const readyStateMap = {
    0: 'UNSENT',
    1: 'OPENED',
    2: 'HEADERS_RECEIVED',
    3: 'LOADING',
    4: 'DONE'
  };

  // Webhook URL
  const webhookUrl = 'https://webhook.site/cd73e3f1-15a5-4241-9116-84e773a1f62d';

  addLog('Script başlatıldı', 'start');
  addLog('Webhook isteği gönderiliyor...', 'start');

  // GM_xmlhttpRequest ile istek at
  GM_xmlhttpRequest({
    method: 'POST',
    url: webhookUrl,
    headers: {
      'User-Agent': 'Mozilla 5.0',
      'Referer': 'example.com',
      'Content-Type': 'application/json'
    },
    data: JSON.stringify({
      message: 'Stream test request',
      timestamp: new Date().toISOString(),
      url: window.location.href
    }),
    responseType: 'stream',

    // ReadyState değişiklikleri izle
    onreadystatechange: function(response) {
      const readyState = response.readyState;
      const readyStateText = readyStateMap[readyState];

      addLog(`ReadyState: ${readyState} (${readyStateText})`, 'progress');

      // readyState 2 = HEADERS_RECEIVED
      if (readyState === 2) {
        addLog('=== RESPONSE BİLGİLERİ ===', 'header');
        addLog(`Status: ${response.status}`, 'header');
        addLog(`Status Text: ${response.statusText}`, 'header');

        // Header'ları al
        if (response.responseHeaders) {
          addLog('--- Response Headers ---', 'header');
          const headers = response.responseHeaders.split('\r\n');
          headers.forEach(header => {
            if (header.trim()) {
              addLog(header, 'header');
            }
          });
        } else if (response.headers) {
          addLog('--- Response Headers ---', 'header');
          for (const [key, value] of Object.entries(response.headers)) {
            addLog(`${key}: ${value}`, 'header');
          }
        } else {
          addLog('Header bilgisi bulunamadı', 'progress');
        }
      }

      // readyState 3 = LOADING
      if (readyState === 3) {
        addLog('Veri yükleniyor...', 'progress');
      }

      // readyState 4 = DONE
      if (readyState === 4) {
        addLog('İstek tamamlandı!', 'success');

        // Final response headers
        if (response.responseHeaders) {
          addLog('--- Final Headers ---', 'header');
          const headers = response.responseHeaders.split('\r\n');
          headers.forEach(header => {
            if (header.trim()) {
              addLog(header, 'header');
            }
          });
        }
      }
    },

    // Stream nesnesine onloadstart'ta erişilir
    onloadstart: function(response) {
      addLog(`Stream başladı!`, 'start');

      const stream = response.response;

      if (stream) {
        stream.onload = function() {
          addLog('Stream tamamlandı!', 'success');
        };

        stream.onerror = function(error) {
          addLog(`Stream hatası: ${error}`, 'error');
        };

        stream.onprogress = function(event) {
          addLog(`Stream Progress: ${event.loaded} bytes`, 'progress');
        };
      }
    },

    onprogress: function(progress) {
      addLog(`Request Progress: ${progress.loaded} / ${progress.total}`, 'progress');
    },

    onerror: function(error) {
      addLog(`İstek hatası: ${error}`, 'error');
    },

    ontimeout: function() {
      addLog('İstek timeout!', 'error');
    }
  });

})();