andi/tracking-proxy-helper
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 2 Wiki Activity

Compare commits

base: andi:main
Branches Tags
andi:main
andi:dev
andi:v1.1
andi:v1
..
compare: andi:dev
Branches Tags
andi:main
andi:dev
andi:v1.1
andi:v1

No commits in common. "main" and "dev" have entirely different histories.
main ... dev

11 changed files with 45 additions and 140 deletions
Show Stats Expand all files Collapse all files

3
README.md
View File

@ -43,9 +43,6 @@ This project is licensed under the MIT License.
## Changelog
- v1.1 31.07.2024
- added TP Session ID to Popup
- added Channels to Popup
- v1 05.07.2024*
- Initial Release

5
content.js
View File

@ -1,7 +1,7 @@
/***** Content JS for Chrome Extension: Tracking Proxy Helper *****/
/*** Initialisation ***/
let tpdm = { activeTabId: null, activeWindowId: null, extInit: false, tpl: { tpId: '', sessId: '', eventCount: 0 } };
let tpdm = { activeTabId: null, activeWindowId: null, extInit: false, tpl: { tpId: '', eventCount: 0 } };
tpdm.data = tpdm.data || JSON.parse(JSON.stringify(tpdm.tpl));
//console.log('content.js loaded');
@ -25,8 +25,7 @@ window.addEventListener('message', function(event) {
//console.log('Message received from injected script:', event);
if (event.data.type === 'CHECK_TPT_RESULT') {
//console.log('Message received from injected script:', event);
if (event.data.chaChanged) { chrome.runtime.sendMessage({ type: 'CHECK_TPT', chaChanged:true, tpobj:event.data.tpobj }); }
else { chrome.runtime.sendMessage({ type: 'CHECK_TPT', hasTPT: event.data.hasTPT, hasSessID: event.data.hasSessID, tpobj:event.data.tpobj }); }
chrome.runtime.sendMessage({ type: 'CHECK_TPT', hasTPT: event.data.hasTPT, tpobj:event.data.tpobj });
}
if (event.data.type === 'TRACKING_PROXY_RESPONSE') {
//console.log('Message received from injected TP script:', event);

28
inject-listener.js
View File

@ -20,19 +20,9 @@ function getTPDetails() {
}
// Überprüfung des __tpt Objekts und Versendung des Ergebnisses
function checkTPT(obj) {
if (typeof obj!='string') return;
if (window.__tpt && typeof window.__tpt.cha_str!='string') { window.__tpt.cha_str = ''; }
function checkTPT() {
const tpDetails = getTPDetails();
if (tpDetails.cha) {
if (JSON.stringify(tpDetails.cha)!=tpDetails.cha_str) {
sendTPmsg({ type: 'CHECK_TPT_RESULT', chaChanged:true, tpobj: tpDetails });
window.__tpt.cha_str = JSON.stringify(tpDetails.cha);
}
}
if (obj=='cid' || obj=='fip') {
sendTPmsg({ type: 'CHECK_TPT_RESULT', hasTPT: !!tpDetails.cid, hasSessID: !!tpDetails.fip, tpobj: tpDetails });
}
sendTPmsg({ type: 'CHECK_TPT_RESULT', hasTPT: !!tpDetails.cid, tpobj: tpDetails });
}
// Proxy Handler zur Überwachung von Änderungen
@ -40,7 +30,9 @@ const handler = {
set(target, property, value) {
target[property] = value;
debugLog(`Property ${property} changed to`, value);
checkTPT(property);
if (property === 'cid') {
checkTPT();
}
return true;
},
get(target, property) {
@ -58,7 +50,7 @@ if (window.__tpt) {
value = new Proxy(value, handler);
}
Object.defineProperty(this, '__tpt', { value, writable: true, configurable: true, enumerable: true });
checkTPT('__tpt');
checkTPT();
},
configurable: true,
enumerable: true
@ -72,7 +64,7 @@ window.addEventListener('message', function(event) {
//console.log('TRACKING_PROXY_REQUEST message 2', event);
const eventData = event.data.details.eventData;
const metaData = event.data.details.metaData;
if (eventData.cid && eventData.fip && window.__tpt && eventData.cid === window.__tpt.cid) {
if (eventData.cid && window.__tpt && eventData.cid === window.__tpt.cid) {
//console.log('Tracking Proxy Event detected:', event);
window.postMessage({ type: 'TRACKING_PROXY_RESPONSE', details: { eventData:eventData, metaData:metaData } }, '*');
} else {
@ -94,7 +86,7 @@ setTimeout(() => {
(function() {
let tpid = '';
//console.log("inject.js loaded");
function checkTPT('1') {
function checkTPT() {
if (!window.__tpt) return;
let tpobj = JSON.parse(JSON.stringify(window.__tpt));
console.log('checkTPT result:', tpobj);
@ -102,12 +94,12 @@ setTimeout(() => {
window.postMessage({ type: 'CHECK_TPT_RESULT', tpobj:tpobj }, '*');
}
// Überprüfe sofort
checkTPT('2');
checkTPT();
// Wiederhole die Überprüfung nach einer kurzen Verzögerung, um sicherzustellen, dass das Objekt geladen ist
const observer = new MutationObserver((mutations, observer) => {
if (window.__tpt && window.__tpt.cid) {
//console.log('TP is now available');
checkTPT('3');
checkTPT();
observer.disconnect();
}
});

2
manifest.json
View File

@ -9,7 +9,7 @@
"manifest_version": 3,
"name": "Tracking Proxy Helper",
"author": "andi@tracking-garden.com",
"version": "1.1",
"version": "1",
"description": "This extension gives some information and options using the Tracking Proxy.",
"icons": {
//"16": "/img/get_started16.png",

23
options.css
View File

@ -99,27 +99,4 @@ button#add-url-field {
color: #382d3d; /* Farbe für URL Match Labels */
}
.toggle-header {
cursor: pointer;
color: #fe6845;
background-color: #382d3d;
padding: 5px 10px;
border-radius: 5px;
display: inline-block;
margin-bottom: 5px;
}
#dev-core .section {
display: none;
}
#dev-core .section {
background-color: #ccc7aa;
}
#httpheader {
padding: 20px;
background-color: white;
}
/* EOF */

49
options.html
View File

@ -6,11 +6,29 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tracking Proxy Helper - Extension Options</title>
<link rel="stylesheet" href="options.css">
<script src="options.js"></script>
</head>
<body>
<h1>Tracking Proxy Helper Settings</h1>
<form id="options-form">
<div class="section" id="httpheader">
<h2>HTTP Header for Dev.Environment</h2>
<p class="url-match-label">Notice: The HTTP Header Name is: <strong>Tp-Dev</strong></p>
<div class="form-group">
<label for="header-value">HTTP Header Value:</label>
<input type="text" id="header-value" name="header-value">
</div>
<strong class="url-match-label">URLs to match:</strong>
<div id="url-fields-container">
<div class="url-field">
<input type="text" class="url-input" name="url[]">
<label>
<input type="checkbox" class="regex-checkbox"> Is Regex
</label>
<button type="button" class="remove-url-field">Remove</button>
</div>
</div>
<button type="button" id="add-url-field">Add URL Field</button>
</div>
<div class="section" id="blocking">
<h2>JavaScript Injection and Blocking</h2>
<div class="form-group">
@ -55,35 +73,6 @@
</div>
</div>
</div>
<span onclick="toggleSection('dev-core')" class="toggle-header">+ Dev.Core</span>
<div class="section" id="dev-core">
<div id="httpheader" style="display:none;">
<div class="form-group">
<label>HTTP Header Key:</label>
<input type="text" id="header-key" name="header-key" value="Tp-Dev">
</div>
<div class="form-group">
<label>HTTP Header Value:</label>
<input type="text" id="header-value" name="header-value">
</div>
<div class="form-group">
<label>
<input type="checkbox" id="header-global"> Add HTTP Header to all Requests (Notice: This will need more Resources)
</label>
</div>
</div>
<strong class="url-match-label">URLs to match:</strong>
<div id="url-fields-container">
<div class="url-field">
<input type="text" class="url-input" name="url[]">
<label>
<input type="checkbox" class="regex-checkbox"> Is Regex
</label>
<button type="button" class="remove-url-field">Remove</button>
</div>
</div>
<button type="button" id="add-url-field">Add URL Field</button>
</div>
<button type="submit">Save</button>
</form>
<h3>Saved Values</h3>

26
options.js
View File

@ -2,8 +2,6 @@
document.addEventListener('DOMContentLoaded', function () {
const form = document.getElementById('options-form');
//const form = document.getElementById('options-form');
const addUrlButton = document.getElementById('add-url-field');
const urlFieldsContainer = document.getElementById('url-fields-container');
const savedValuesContainer = document.getElementById('saved-values');
@ -51,9 +49,7 @@ function createUrlField() {
* Save options to chrome.storage.sync
*/
function saveOptions() {
const headerKey = document.getElementById('header-key').value;
const headerValue = document.getElementById('header-value').value;
const headerGlobal = document.getElementById('header-global').checked;
const urlFields = document.querySelectorAll('#httpheader .url-field'); // Only URL fields
const urls = Array.from(urlFields).map(urlField => {
const urlInput = urlField.querySelector('.url-input');
@ -61,7 +57,7 @@ function saveOptions() {
// Ensure that the inputs exist
if (!urlInput || !regexCheckbox) {
//console.error('Invalid URL field:', urlField);
console.error('Invalid URL field:', urlField);
return null;
}
@ -82,9 +78,7 @@ function saveOptions() {
const blockTrackingProxy = document.getElementById('block-tracking-proxy').checked;
chrome.storage.sync.set({
headerKey,
headerValue,
headerGlobal,
urls,
scriptContent,
scriptUrl,
@ -96,7 +90,7 @@ function saveOptions() {
trackingProxyUrlIsRegex,
blockTrackingProxy
}, function () {
//alert('Options saved!');
alert('Options saved!');
displaySavedValues(); // Update displayed saved values
});
}
@ -106,9 +100,7 @@ function saveOptions() {
*/
function loadOptions() {
chrome.storage.sync.get([
'headerKey',
'headerValue',
'headerGlobal',
'urls',
'scriptContent',
'scriptUrl',
@ -120,9 +112,7 @@ function loadOptions() {
'trackingProxyUrlIsRegex',
'blockTrackingProxy'
], function (data) {
document.getElementById('header-key').value = data.headerKey || 'Tp-Dev';
document.getElementById('header-value').value = data.headerValue || '';
document.getElementById('header-global').checked = data.headerGlobal || false;
const urlFieldsContainer = document.getElementById('url-fields-container');
urlFieldsContainer.innerHTML = '';
@ -158,16 +148,4 @@ function displaySavedValues() {
});
}
function toggleSection(sectionId) {
const section = document.getElementById(sectionId);
const toggleHeader = document.querySelector('.toggle-header');
if (section.style.display === 'none') {
section.style.display = '';
toggleHeader.textContent = '- Dev.Core';
} else {
section.style.display = 'none';
toggleHeader.textContent = '+ Dev.Core';
}
}
// EOF

12
popup.css
View File

@ -61,24 +61,24 @@ pre {
color: #ffffff;
}
.events, .channels {
.events {
margin-top: 10px;
}
.event-details, .channel-details {
.event-details {
color: #382d3d;
padding: 10px;
border-radius: 4px;
margin-bottom: 10px;
}
.event-details summary, .channel-details summary {
.event-details summary {
cursor: pointer;
font-weight: bold;
color: #382d3d; /* Dunkelviolett für Event-Namen */
}
.event-details pre, .channel-details pre {
.event-details pre {
background: #fff;
color: #382d3d;
padding: 10px;
@ -88,11 +88,11 @@ pre {
font-family: monospace; /* Schriftart für bessere Lesbarkeit von JSON */
}
.event-details pre .key, .channel-details pre .key {
.event-details pre .key {
color: #fe6845; /* Orange für JSON-Schlüssel/Eigenschaftsnamen */
}
.event-details pre .string, .event-details pre .number, .channel-details pre .string, .channel-details pre .number {
.event-details pre .string, .event-details pre .number {
color: #382d3d; /* Dunkelviolett für Werte im JSON */
}

4
popup.html
View File

@ -11,10 +11,6 @@
<a href="#" id="options-link">Settings</a>
<div class="container">
<p><span class="label">Account ID:</span> <span id="tp-id" class="value">No Tracking Proxy detected</span></p>
<p><span class="label">TP Session:</span> <span id="tp-sess-id" class="value">No Tracking Proxy detected</span></p>
<p>
<div id="channels" class="channels"></div>
</p>
<p>
<span class="label">Events:</span>
<div id="events" class="events"></div>

15
popup.js
View File

@ -26,28 +26,13 @@ function syntaxHighlight(json) {
// Initialize popup with Tracking Proxy Events
document.addEventListener('DOMContentLoaded', function() {
const tpIdElement = document.getElementById('tp-id');
const sessIdElement = document.getElementById('tp-sess-id');
const channelsElement = document.getElementById('channels');
const eventsElement = document.getElementById('events');
chrome.runtime.sendMessage({ type: 'REQUEST_POPUP_DATA' }, function(response) {
//test(response);
if (typeof response=='object') {
// TP Account ID
const tpId = response.tpId || 'Not Available';
tpIdElement.textContent = tpId;
// TP Session ID
const sessId = response.sessId || 'Not Available';
sessIdElement.textContent = sessId;
// Channels
const channels = response.channels || [];
channelsElement.innerHTML = `
<details class="channel-details">
<summary>Channels</summary>
<pre>${syntaxHighlight(JSON.stringify(channels, null, 2))}</pre>
</details>
`;
// Events
const events = response.events || [];
eventsElement.innerHTML = events.map((event, index) => `
<details class="event-details">

18
worker.js
View File

@ -1,7 +1,7 @@
/***** Service Worker JS for Chrome Extension: Tracking Proxy Helper *****/
/*** Initialisation ***/
let tpdm = { activeTabId: null, activeWindowId: null, extInit: false, tpl: { tpId:'', sessId:'', channels:[], eventCount:0, events:[] } };
let tpdm = { activeTabId: null, activeWindowId: null, extInit: false, tpl: { tpId:'', eventCount:0, events:[] } };
//tpdm.data = tpdm.data || JSON.parse(JSON.stringify(tpdm.tpl));
tpdm.data = tpdm.data || {};
//console.log('Worker loaded');
@ -205,17 +205,11 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
getCurrentTabId((tabId) => {
tpdm.activeTabId = tabId;
//console.log('CHECK_TPT (Tab: '+tabId+'):', message);
if (message.chaChanged) {
tpdm.data[tabId].channels = message.tpobj.cha;
} else if (message.hasSessID) {
tpdm.data[tabId].sessId = message.tpobj.fip;
} else if (message.hasTPT) {
if (message.hasTPT) {
tpdm.data.eventCount = 0;
resetBadge(tabId);
if (typeof tpdm.data[tabId]!='object') tpdm.data[tabId] = JSON.parse(JSON.stringify(tpdm.tpl));
tpdm.data[tabId].tpId = message.tpobj.cid;
tpdm.data[tabId].sessId = message.tpobj.fip;
tpdm.data[tabId].channels = message.tpobj.cha;
} else {
clearBadge(tabId);
}
@ -232,12 +226,10 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
if (typeof tpdm.data[tpdm.activeTabId]!='object') tpdm.data[tpdm.activeTabId] = JSON.parse(JSON.stringify(tpdm.tpl));
let obj = {
tpId: tpdm.data[tpdm.activeTabId].tpId,
sessId: tpdm.data[tpdm.activeTabId].sessId,
tabId: tpdm.activeTabId,
channels: tpdm.data[tpdm.activeTabId].channels,
events: tpdm.data[tpdm.activeTabId].events
};
//console.log('TP Received message:'+tpdm.data[tpdm.activeTabId].sessId, JSON.parse(JSON.stringify(tpdm.data[tpdm.activeTabId])));
//console.log('TP Received message:'+tpdm.data[tpdm.activeTabId].tpId, obj);
sendResponse(obj);
//});
} else {
@ -304,8 +296,8 @@ chrome.webRequest.onBeforeRequest.addListener(
return;
}
}
if (!eventData || !eventData.fip) {
//console.log('Payload has no fip:', details);
if (!eventData || !eventData.cid) {
//console.log('Payload has no cid:', details);
return;
}
let metaData = { documentId:details.documentId, frameId:details.frameId, initiator:details.initiator, requestId:details.requestId, tabId:details.tabId, timeStamp:details.timeStamp, url:details.url };