From f2d44c78cba05d61a1cc72346ae8391558fa4ddb Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Fri, 14 Nov 2025 16:48:08 +0000
Subject: [PATCH 1/5] Initial plan
From 571a1430cf59cbfc21977ca9f8b9b2a05d0dbce2 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Fri, 14 Nov 2025 16:50:37 +0000
Subject: [PATCH 2/5] Fix iframe navigation issue by adding proper sandbox
attributes
Co-authored-by: itshypax <33388336+itshypax@users.noreply.github.com>
---
intraTab/html/index.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/intraTab/html/index.html b/intraTab/html/index.html
index 225960a..8c2111a 100644
--- a/intraTab/html/index.html
+++ b/intraTab/html/index.html
@@ -35,7 +35,7 @@ Lade eNOTF...
-
+
From 70cef3e965f479b8a6427fd32cafb5971f5b23ea Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Fri, 14 Nov 2025 18:24:54 +0000
Subject: [PATCH 3/5] Remove restrictive sandbox attribute that prevented
iframe navigation
Co-authored-by: itshypax <33388336+itshypax@users.noreply.github.com>
---
intraTab/html/index.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/intraTab/html/index.html b/intraTab/html/index.html
index 8c2111a..dddf3d3 100644
--- a/intraTab/html/index.html
+++ b/intraTab/html/index.html
@@ -35,7 +35,7 @@ Lade eNOTF...
-
+
From b171997477903c94d69a12717f040bf86a834f81 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sat, 15 Nov 2025 06:03:40 +0000
Subject: [PATCH 4/5] Add iframe diagnostics and Cloudflare Tunnels
troubleshooting guide
Co-authored-by: itshypax <33388336+itshypax@users.noreply.github.com>
---
CLOUDFLARE_TROUBLESHOOTING.md | 124 ++++++++++++++++++++++++++++++++++
README.md | 6 ++
intraTab/html/js/script.js | 28 ++++++++
3 files changed, 158 insertions(+)
create mode 100644 CLOUDFLARE_TROUBLESHOOTING.md
diff --git a/CLOUDFLARE_TROUBLESHOOTING.md b/CLOUDFLARE_TROUBLESHOOTING.md
new file mode 100644
index 0000000..e3a026e
--- /dev/null
+++ b/CLOUDFLARE_TROUBLESHOOTING.md
@@ -0,0 +1,124 @@
+# Cloudflare Tunnels Troubleshooting Guide
+
+If you're experiencing issues where the tablet displays but clicking within the iframe doesn't navigate to new pages, this is likely due to server-side security headers that block iframe embedding.
+
+## Common Issue: iframe Content Blocked
+
+### Symptoms
+- Tablet opens successfully
+- Initial page loads
+- Clicking links inside the tablet does nothing
+- Console shows warnings about blocked content
+
+### Root Cause
+Your web server (through Cloudflare Tunnels or directly) is sending HTTP headers that prevent the content from being displayed in an iframe. This is a **server-side issue**, not a client-side intraTab issue.
+
+## Diagnostic Steps
+
+### 1. Check Browser Console (F12)
+Open the browser console in FiveM and look for messages starting with `[intraTab]`:
+- `[intraTab] iframe load event fired` - iframe attempted to load
+- `Cannot access iframe content - likely blocked by X-Frame-Options or CSP headers` - **This is the issue!**
+
+### 2. Test Your IntraRP URL
+Run this command to check your server headers:
+```bash
+curl -I https://your-intrarp-url.com/enotf/
+```
+
+Look for these problematic headers:
+```
+X-Frame-Options: DENY
+X-Frame-Options: SAMEORIGIN
+Content-Security-Policy: frame-ancestors 'none'
+Content-Security-Policy: frame-ancestors 'self'
+```
+
+## Solutions (Server-Side Configuration Required)
+
+### Solution 1: Apache (.htaccess or httpd.conf)
+
+Add or modify these lines in your IntraRP installation:
+
+```apache
+# Allow iframe embedding
+Header always unset X-Frame-Options
+Header always set Content-Security-Policy "frame-ancestors *"
+
+# Or for more security, specify FiveM NUI:
+# Header always set Content-Security-Policy "frame-ancestors nui://* file://* https://*"
+```
+
+### Solution 2: Nginx (nginx.conf)
+
+```nginx
+# Remove X-Frame-Options
+add_header X-Frame-Options "" always;
+
+# Allow iframe embedding
+add_header Content-Security-Policy "frame-ancestors *" always;
+```
+
+### Solution 3: PHP (in IntraRP's index.php or config)
+
+```php
+// Remove X-Frame-Options
+header_remove('X-Frame-Options');
+
+// Allow iframe embedding
+header("Content-Security-Policy: frame-ancestors *");
+```
+
+### Solution 4: Cloudflare Tunnel Dashboard
+
+1. Log in to Cloudflare Zero Trust Dashboard
+2. Go to **Access** > **Tunnels**
+3. Find your tunnel and click **Configure**
+4. Go to **Public Hostname** for your IntraRP domain
+5. Under **Additional application settings** > **HTTP Settings**:
+ - Look for "Remove X-Frame-Options"
+ - Or configure CSP headers to allow framing
+
+### Solution 5: Cloudflare Page Rules (if using Cloudflare DNS)
+
+1. Go to your domain in Cloudflare Dashboard
+2. Go to **Rules** > **Transform Rules** > **HTTP Response Header Modification**
+3. Create a rule to remove or modify `X-Frame-Options` header
+4. Create a rule to set `Content-Security-Policy` to allow framing
+
+## Alternative: Open in External Browser
+
+If you cannot modify server configuration, you can open IntraRP in an external browser instead of embedding it in the tablet. This would require modifying the intraTab resource to open links externally.
+
+## Testing After Changes
+
+1. Restart your web server / Cloudflare Tunnel
+2. Clear browser cache in FiveM
+3. Restart the intraTab resource in FiveM
+4. Open the tablet and test clicking links
+5. Check the browser console (F12) for diagnostic messages
+
+## Still Having Issues?
+
+If you've made these changes and it still doesn't work:
+
+1. Verify the headers were actually changed (use `curl -I` again)
+2. Check if there's a reverse proxy or firewall adding headers
+3. Check FiveM client console for detailed error messages
+4. Ensure you're using HTTPS for both the tunnel and IntraRP
+5. Check for mixed content warnings (HTTP/HTTPS conflicts)
+
+## Why This Happens
+
+Web servers add `X-Frame-Options` and `Content-Security-Policy` headers to prevent **clickjacking attacks**, where malicious websites embed your content in iframes to trick users. While this is good security for public websites, it prevents legitimate iframe embedding like intraTab.
+
+Since you control both the IntraRP server and the intraTab client, it's safe to allow iframe embedding from your FiveM server.
+
+## Summary
+
+**The issue is NOT with intraTab code** - it's a server configuration issue. You need to:
+1. ✅ Modify server headers to allow iframe embedding
+2. ✅ Configure Cloudflare Tunnels to not add restrictive headers
+3. ✅ Test with the diagnostic messages added in the latest version
+
+For more help, check your web server documentation or Cloudflare Tunnels documentation about iframe embedding and security headers.
diff --git a/README.md b/README.md
index d1a70c5..936b70a 100644
--- a/README.md
+++ b/README.md
@@ -4,6 +4,12 @@
Mit **intraTab** lässt sich intraRP ganz einfach auch in FiveM benutzen! Einfach die Ressource in das entsprechende Verzeichnis des FiveM-Servers ziehen, gewünschte Anpassungen an der `config.lua` vornehmen (wichtig: Der Link zur intraRP-Installation) und startbereit ist die Ingame-Integration. Das System befindet sich in aktuell in Entwicklung und wird stetig verändert.
+## 🔧 Probleme mit Cloudflare Tunnels?
+
+Wenn das Tablet sich öffnet, aber Klicks innerhalb der Seite nicht funktionieren, liegt dies wahrscheinlich an Server-Sicherheitsheadern. **Siehe [CLOUDFLARE_TROUBLESHOOTING.md](CLOUDFLARE_TROUBLESHOOTING.md)** für eine ausführliche Anleitung zur Behebung.
+
+**Kurzfassung:** Dein Webserver oder Cloudflare Tunnel blockiert das Einbetten in iframes. Du musst die `X-Frame-Options` und `Content-Security-Policy` Header auf dem Server anpassen.
+
## Vorschau
diff --git a/intraTab/html/js/script.js b/intraTab/html/js/script.js
index 43080a6..c8283f9 100644
--- a/intraTab/html/js/script.js
+++ b/intraTab/html/js/script.js
@@ -118,6 +118,34 @@ function loadIntraSystem(charData) {
const loadingScreen = document.getElementById("loadingScreen");
if (iframe) {
+ // Add error handler for iframe load failures
+ iframe.addEventListener('error', function(e) {
+ console.error('[intraTab] iframe failed to load:', e);
+ if (loadingText) {
+ loadingText.textContent = "Error: Failed to load IntraRP. Check server configuration.";
+ }
+ }, { once: true });
+
+ // Add load handler to detect successful/blocked loads
+ iframe.addEventListener('load', function() {
+ console.log('[intraTab] iframe load event fired for URL:', url);
+
+ // Try to detect if iframe is blocked by checking access
+ try {
+ const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
+ if (iframeDoc) {
+ console.log('[intraTab] iframe content accessible');
+ }
+ } catch (e) {
+ console.warn('[intraTab] Cannot access iframe content - likely blocked by X-Frame-Options or CSP headers');
+ console.warn('[intraTab] Error:', e.message);
+ if (loadingText) {
+ loadingText.textContent = "Warning: Content may be blocked by server security headers. Check Cloudflare/server configuration.";
+ }
+ }
+ }, { once: true });
+
+ console.log('[intraTab] Loading URL in iframe:', url);
iframe.src = url;
setTimeout(() => {
From 0e2225698cc634328f038741316c4ac06016eb4c Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sat, 15 Nov 2025 06:09:49 +0000
Subject: [PATCH 5/5] Add Cloudflare-specific iframe troubleshooting and
referrerpolicy attribute
Co-authored-by: itshypax <33388336+itshypax@users.noreply.github.com>
---
CLOUDFLARE_TROUBLESHOOTING.md | 61 +++++++++++++++++++++++++++++++++++
intraTab/html/index.html | 2 +-
intraTab/html/js/script.js | 29 +++++++++++++++--
3 files changed, 88 insertions(+), 4 deletions(-)
diff --git a/CLOUDFLARE_TROUBLESHOOTING.md b/CLOUDFLARE_TROUBLESHOOTING.md
index e3a026e..63beb2c 100644
--- a/CLOUDFLARE_TROUBLESHOOTING.md
+++ b/CLOUDFLARE_TROUBLESHOOTING.md
@@ -86,6 +86,67 @@ header("Content-Security-Policy: frame-ancestors *");
3. Create a rule to remove or modify `X-Frame-Options` header
4. Create a rule to set `Content-Security-Policy` to allow framing
+### Solution 6: Cloudflare-Specific Features That May Block iframes
+
+Some Cloudflare features can interfere with iframe functionality:
+
+#### Disable Browser Integrity Check
+1. Go to Cloudflare Dashboard
+2. Navigate to **Security** > **Settings**
+3. Scroll to **Browser Integrity Check**
+4. **Disable** this feature
+
+This check can block FiveM's embedded browser (CEF) from loading iframes properly.
+
+#### Disable or Configure Bot Fight Mode
+1. Go to Cloudflare Dashboard
+2. Navigate to **Security** > **Bots**
+3. Review **Bot Fight Mode** settings
+4. Either disable it or add FiveM's user agent to the allowlist
+
+Bot Fight Mode may incorrectly identify FiveM's requests as bot traffic.
+
+#### Disable Rocket Loader (if enabled)
+1. Go to Cloudflare Dashboard
+2. Navigate to **Speed** > **Optimization**
+3. Find **Rocket Loader**
+4. **Disable** this feature
+
+Rocket Loader can interfere with JavaScript execution in iframes.
+
+#### Configure Firewall Rules
+1. Go to Cloudflare Dashboard
+2. Navigate to **Security** > **WAF**
+3. Check for rules that might block iframe requests
+4. Consider adding a bypass rule for your FiveM server IP
+
+### Solution 7: Cookie Settings (for authenticated content)
+
+If IntraRP requires authentication, cookies must work in iframe context:
+
+**Server-side (PHP example):**
+```php
+// Set SameSite=None for cookies to work in iframes
+setcookie('session_name', $value, [
+ 'samesite' => 'None',
+ 'secure' => true, // Required when SameSite=None
+ 'httponly' => true
+]);
+```
+
+**Or via headers:**
+```
+Set-Cookie: session_name=value; SameSite=None; Secure; HttpOnly
+```
+
+### Solution 8: Meta Tag CSP (as fallback)
+
+Some configurations require CSP in both headers AND meta tags. Add this to your IntraRP's HTML ``:
+
+```html
+
+```
+
## Alternative: Open in External Browser
If you cannot modify server configuration, you can open IntraRP in an external browser instead of embedding it in the tablet. This would require modifying the intraTab resource to open links externally.
diff --git a/intraTab/html/index.html b/intraTab/html/index.html
index dddf3d3..4c4925d 100644
--- a/intraTab/html/index.html
+++ b/intraTab/html/index.html
@@ -35,7 +35,7 @@ Lade eNOTF...
-
+
diff --git a/intraTab/html/js/script.js b/intraTab/html/js/script.js
index c8283f9..810b16a 100644
--- a/intraTab/html/js/script.js
+++ b/intraTab/html/js/script.js
@@ -134,18 +134,41 @@ function loadIntraSystem(charData) {
try {
const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
if (iframeDoc) {
- console.log('[intraTab] iframe content accessible');
+ console.log('[intraTab] iframe content accessible - page loaded successfully');
+
+ // Check if the iframe actually has content
+ const iframeBody = iframeDoc.body;
+ if (!iframeBody || iframeBody.children.length === 0) {
+ console.warn('[intraTab] iframe loaded but appears empty - possible security block');
+ if (loadingText) {
+ loadingText.textContent = "Warning: Page loaded but appears empty. Check server configuration.";
+ }
+ }
}
} catch (e) {
- console.warn('[intraTab] Cannot access iframe content - likely blocked by X-Frame-Options or CSP headers');
+ console.warn('[intraTab] Cannot access iframe content - likely blocked by security headers');
console.warn('[intraTab] Error:', e.message);
+ console.warn('[intraTab] Common causes:');
+ console.warn('[intraTab] - X-Frame-Options header blocking embedding');
+ console.warn('[intraTab] - Content-Security-Policy frame-ancestors restriction');
+ console.warn('[intraTab] - Cloudflare Browser Integrity Check');
+ console.warn('[intraTab] - Cloudflare Bot Fight Mode');
+ console.warn('[intraTab] See CLOUDFLARE_TROUBLESHOOTING.md for solutions');
+
if (loadingText) {
- loadingText.textContent = "Warning: Content may be blocked by server security headers. Check Cloudflare/server configuration.";
+ loadingText.textContent = "Warning: Content blocked by security headers. See troubleshooting guide.";
}
}
}, { once: true });
console.log('[intraTab] Loading URL in iframe:', url);
+ console.log('[intraTab] If content does not load, check:');
+ console.log('[intraTab] 1. Server X-Frame-Options header');
+ console.log('[intraTab] 2. Server Content-Security-Policy header');
+ console.log('[intraTab] 3. Cloudflare Browser Integrity Check (disable)');
+ console.log('[intraTab] 4. Cloudflare Bot Fight Mode (configure)');
+ console.log('[intraTab] 5. Cloudflare Rocket Loader (disable)');
+
iframe.src = url;
setTimeout(() => {