mirror of
https://github.com/rzmk/learnhouse.git
synced 2025-12-19 04:19:25 +00:00
feat: remove domain isolation scripts and related components for cleanup
This commit is contained in:
WhiteX
rzmk
parent
98b833c8ba
commit
f46f4dd552
13 changed files with 73 additions and 837 deletions
|
|
@ -1,60 +0,0 @@
|
|||
import React from 'react'
|
||||
import Image from 'next/image'
|
||||
|
||||
interface SafeAvatarProps {
|
||||
src?: string
|
||||
alt: string
|
||||
size?: number
|
||||
className?: string
|
||||
}
|
||||
|
||||
/**
|
||||
* SafeAvatar component that ensures correct domain for avatar images
|
||||
*/
|
||||
const SafeAvatar: React.FC<SafeAvatarProps> = ({
|
||||
src,
|
||||
alt,
|
||||
size = 40,
|
||||
className
|
||||
}) => {
|
||||
// Default empty avatar path that uses relative URL (domain-safe)
|
||||
const defaultAvatarSrc = '/images/empty_avatar.png'
|
||||
|
||||
// Handle potentially cross-domain avatar URLs
|
||||
const sanitizedSrc = React.useMemo(() => {
|
||||
if (!src) return defaultAvatarSrc
|
||||
|
||||
try {
|
||||
// Check if the URL has a domain
|
||||
const url = new URL(src, window.location.origin)
|
||||
|
||||
// If the URL is from a different domain, use the default avatar
|
||||
if (url.hostname !== window.location.hostname) {
|
||||
console.warn(`[SafeAvatar] Detected cross-domain avatar: ${src}`)
|
||||
return defaultAvatarSrc
|
||||
}
|
||||
|
||||
return src
|
||||
} catch (e) {
|
||||
// If parsing fails, just use the src as is (could be a relative path)
|
||||
return src
|
||||
}
|
||||
}, [src])
|
||||
|
||||
return (
|
||||
<Image
|
||||
src={sanitizedSrc}
|
||||
alt={alt}
|
||||
width={size}
|
||||
height={size}
|
||||
className={className}
|
||||
onError={(e) => {
|
||||
// If image fails to load, fallback to default
|
||||
const target = e.target as HTMLImageElement
|
||||
target.src = defaultAvatarSrc
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export default SafeAvatar
|
||||
|
|
@ -1,72 +0,0 @@
|
|||
import { NextResponse } from 'next/server';
|
||||
|
||||
// This middleware runs on every request
|
||||
export function middleware(request) {
|
||||
// Get the current hostname from the request headers
|
||||
const currentHostname = request.headers.get('host');
|
||||
|
||||
// Always inspect for cross-domain requests regardless of referrer
|
||||
const url = request.nextUrl.clone();
|
||||
const path = url.pathname;
|
||||
|
||||
// Check for common patterns that might indicate cross-domain content
|
||||
// 1. Handle image files that might be requested from the wrong domain
|
||||
if (path.endsWith('.png') || path.endsWith('.jpg') || path.endsWith('.jpeg') ||
|
||||
path.endsWith('.gif') || path.endsWith('.webp') || path.endsWith('.svg')) {
|
||||
// Ensure image path is properly routed to current domain
|
||||
if (path.includes('empty_avatar.png')) {
|
||||
console.log(`Intercepting image request: ${path}`);
|
||||
// Rewrite all empty_avatar.png requests to use the local domain
|
||||
return NextResponse.rewrite(new URL(`/images/empty_avatar.png`, request.url));
|
||||
}
|
||||
}
|
||||
|
||||
// 2. Check if request is going to the wrong domain through API path
|
||||
if (path.includes('/api/') && request.headers.has('referer')) {
|
||||
const refererUrl = new URL(request.headers.get('referer'));
|
||||
// If referer domain doesn't match the requested API domain, redirect
|
||||
if (refererUrl.hostname !== currentHostname) {
|
||||
console.log(`Redirecting cross-domain API request: ${path}`);
|
||||
const newUrl = new URL(path, `https://${currentHostname}`);
|
||||
return NextResponse.redirect(newUrl);
|
||||
}
|
||||
}
|
||||
|
||||
// Get the referrer URL if it exists
|
||||
const referer = request.headers.get('referer');
|
||||
|
||||
// If there is a referrer, check if it's from a different domain
|
||||
if (referer) {
|
||||
try {
|
||||
const refererUrl = new URL(referer);
|
||||
const refererHostname = refererUrl.hostname;
|
||||
|
||||
// If the referrer hostname doesn't match the current hostname
|
||||
if (refererHostname !== currentHostname) {
|
||||
console.log(`Cross-domain request detected: ${refererHostname} -> ${currentHostname}`);
|
||||
|
||||
// For path segments that might include another domain
|
||||
if (path.includes('/next/static/') || path.includes('/api/')) {
|
||||
// Ensure all paths use the current hostname
|
||||
// This prevents asset URL problems when different hostnames appear in the path
|
||||
const localPath = path.replace(/https?:\/\/[^\/]+/, '');
|
||||
url.pathname = localPath;
|
||||
return NextResponse.rewrite(url);
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('Error processing referer in middleware:', e);
|
||||
}
|
||||
}
|
||||
|
||||
// Continue with the request as normal
|
||||
return NextResponse.next();
|
||||
}
|
||||
|
||||
// Configure which paths this middleware will run on
|
||||
export const config = {
|
||||
matcher: [
|
||||
// Apply to all paths
|
||||
'/:path*',
|
||||
],
|
||||
};
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
import { Html, Head, Main, NextScript } from 'next/document';
|
||||
|
||||
export default function Document() {
|
||||
return (
|
||||
<Html lang="en">
|
||||
<Head>
|
||||
{/* Load domain isolation loader first - immediate protection */}
|
||||
<script src="/domain-isolation-loader.js" strategy="beforeInteractive" />
|
||||
{/* Load runtime configuration */}
|
||||
<script src="/runtime-config.js" strategy="beforeInteractive" />
|
||||
{/* Load comprehensive API interceptor */}
|
||||
<script src="/api-interceptor.js" strategy="beforeInteractive" />
|
||||
{/* Load API response sanitizer */}
|
||||
<script src="/api-response-sanitizer.js" strategy="beforeInteractive" />
|
||||
</Head>
|
||||
<body>
|
||||
<Main />
|
||||
<NextScript />
|
||||
</body>
|
||||
</Html>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,94 +0,0 @@
|
|||
/**
|
||||
* API Response Sanitizer
|
||||
*
|
||||
* This script specifically handles API responses to ensure they don't contain
|
||||
* URLs pointing to the wrong domain.
|
||||
*/
|
||||
(function() {
|
||||
console.log('[Domain Isolation] Installing API response sanitizer...');
|
||||
|
||||
// Save reference to the original fetch
|
||||
const originalFetch = window.fetch;
|
||||
|
||||
/**
|
||||
* Recursively sanitize objects to replace URLs from wrong domains
|
||||
*/
|
||||
function sanitizeObject(obj, currentDomain) {
|
||||
if (!obj || typeof obj !== 'object') return obj;
|
||||
|
||||
// Handle arrays
|
||||
if (Array.isArray(obj)) {
|
||||
return obj.map(item => sanitizeObject(item, currentDomain));
|
||||
}
|
||||
|
||||
// Handle objects
|
||||
const result = {};
|
||||
|
||||
for (const [key, value] of Object.entries(obj)) {
|
||||
// Check if this is a URL string value
|
||||
if (typeof value === 'string' &&
|
||||
(value.startsWith('http://') || value.startsWith('https://'))) {
|
||||
try {
|
||||
const url = new URL(value);
|
||||
if (url.hostname !== currentDomain &&
|
||||
!url.hostname.includes('api-gateway.umami.dev')) {
|
||||
console.log(`[Sanitizer] Found cross-domain URL: ${value}`);
|
||||
const newValue = value.replace(url.hostname, currentDomain);
|
||||
result[key] = newValue;
|
||||
continue;
|
||||
}
|
||||
} catch (e) {
|
||||
// Not a valid URL, keep original value
|
||||
}
|
||||
}
|
||||
|
||||
// Process nested objects/arrays
|
||||
if (value && typeof value === 'object') {
|
||||
result[key] = sanitizeObject(value, currentDomain);
|
||||
} else {
|
||||
result[key] = value;
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
// Override fetch to sanitize responses
|
||||
window.fetch = async function(...args) {
|
||||
const currentDomain = window.location.hostname;
|
||||
|
||||
// Call original fetch
|
||||
const response = await originalFetch.apply(this, args);
|
||||
|
||||
// Clone the response so we can read it multiple times
|
||||
const clonedResponse = response.clone();
|
||||
|
||||
// Only process JSON responses from API endpoints
|
||||
const contentType = response.headers.get('content-type');
|
||||
if (contentType && contentType.includes('application/json') &&
|
||||
(args[0].includes('/api/') || args[0].includes('api/v1'))) {
|
||||
|
||||
try {
|
||||
// Read and parse the response
|
||||
const originalData = await clonedResponse.json();
|
||||
|
||||
// Sanitize the data
|
||||
const sanitizedData = sanitizeObject(originalData, currentDomain);
|
||||
|
||||
// Create a new response with sanitized data
|
||||
return new Response(JSON.stringify(sanitizedData), {
|
||||
status: response.status,
|
||||
statusText: response.statusText,
|
||||
headers: response.headers
|
||||
});
|
||||
} catch (e) {
|
||||
console.error('[Domain Isolation] Error sanitizing response:', e);
|
||||
return response; // Return original response on error
|
||||
}
|
||||
}
|
||||
|
||||
return response;
|
||||
};
|
||||
|
||||
console.log('[Domain Isolation] API response sanitizer installed');
|
||||
})();
|
||||
|
|
@ -1,82 +0,0 @@
|
|||
// Domain Isolation Loader
|
||||
// This script loads before any other scripts to ensure all requests stay within the current domain
|
||||
|
||||
(function() {
|
||||
console.log('[Domain Isolation] Initializing early domain isolation...');
|
||||
|
||||
// Override createElement to patch script elements before they load
|
||||
const originalCreateElement = document.createElement.bind(document);
|
||||
document.createElement = function(tagName) {
|
||||
const element = originalCreateElement(tagName);
|
||||
|
||||
if (tagName.toLowerCase() === 'script') {
|
||||
const originalSetAttribute = element.setAttribute.bind(element);
|
||||
element.setAttribute = function(name, value) {
|
||||
if (name === 'src' && typeof value === 'string') {
|
||||
try {
|
||||
const currentDomain = window.location.hostname;
|
||||
const urlObj = new URL(value, window.location.origin);
|
||||
const targetDomain = urlObj.hostname;
|
||||
|
||||
if (targetDomain !== currentDomain) {
|
||||
console.warn('[Domain Isolation] Pre-load intercepted cross-domain script:', value);
|
||||
value = value.replace(/https?:\/\/[^\/]+/, window.location.origin);
|
||||
console.log('[Domain Isolation] Changed to:', value);
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('[Domain Isolation] Error processing script URL:', e);
|
||||
}
|
||||
}
|
||||
return originalSetAttribute(name, value);
|
||||
};
|
||||
}
|
||||
|
||||
return element;
|
||||
};
|
||||
|
||||
// Store original URL manipulation methods
|
||||
window.__domainIsolationOriginals = {
|
||||
fetch: window.fetch,
|
||||
open: XMLHttpRequest.prototype.open
|
||||
};
|
||||
|
||||
// Simple early fetch override
|
||||
window.fetch = function(url, options) {
|
||||
if (typeof url === 'string') {
|
||||
try {
|
||||
const currentDomain = window.location.hostname;
|
||||
const urlObj = new URL(url, window.location.origin);
|
||||
const targetDomain = urlObj.hostname;
|
||||
|
||||
if (targetDomain !== currentDomain) {
|
||||
console.warn('[Domain Isolation] Early loader redirecting fetch:', url);
|
||||
url = url.replace(/https?:\/\/[^\/]+/, window.location.origin);
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('[Domain Isolation] Early loader error:', e);
|
||||
}
|
||||
}
|
||||
return window.__domainIsolationOriginals.fetch.apply(this, arguments);
|
||||
};
|
||||
|
||||
// Simple early XHR override
|
||||
XMLHttpRequest.prototype.open = function(method, url, ...args) {
|
||||
if (typeof url === 'string') {
|
||||
try {
|
||||
const currentDomain = window.location.hostname;
|
||||
const urlObj = new URL(url, window.location.origin);
|
||||
const targetDomain = urlObj.hostname;
|
||||
|
||||
if (targetDomain !== currentDomain) {
|
||||
console.warn('[Domain Isolation] Early loader redirecting XHR:', url);
|
||||
url = url.replace(/https?:\/\/[^\/]+/, window.location.origin);
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('[Domain Isolation] Early loader error:', e);
|
||||
}
|
||||
}
|
||||
return window.__domainIsolationOriginals.open.apply(this, [method, url, ...args]);
|
||||
};
|
||||
|
||||
console.log('[Domain Isolation] Early domain isolation initialized');
|
||||
})();
|
||||
|
|
@ -1,19 +0,0 @@
|
|||
{
|
||||
"extends": "./tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"noEmit": true,
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"noImplicitAny": false,
|
||||
"strictNullChecks": false,
|
||||
"strictPropertyInitialization": false
|
||||
},
|
||||
"include": [
|
||||
"next-env.d.ts",
|
||||
"**/*.ts",
|
||||
"**/*.tsx"
|
||||
],
|
||||
"exclude": [
|
||||
"node_modules"
|
||||
]
|
||||
}
|
||||
|
|
@ -1,59 +0,0 @@
|
|||
import { getApiUrl } from './runtimeConfig';
|
||||
|
||||
/**
|
||||
* Creates an API client that uses runtime configuration
|
||||
* @returns {Object} API client object with fetch method
|
||||
*/
|
||||
export function createApiClient() {
|
||||
return {
|
||||
/**
|
||||
* Fetch data from the API with the correct runtime URL
|
||||
* @param {string} path - API path to fetch from
|
||||
* @param {Object} options - Fetch options
|
||||
* @returns {Promise<any>} - JSON response
|
||||
*/
|
||||
fetch: async (path, options = {}) => {
|
||||
const url = getApiUrl(path);
|
||||
console.log(`[API] Fetching from: ${url}`);
|
||||
|
||||
const response = await fetch(url, options);
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`API request failed: ${response.status}`);
|
||||
}
|
||||
|
||||
return response.json();
|
||||
},
|
||||
|
||||
/**
|
||||
* Post data to the API with the correct runtime URL
|
||||
* @param {string} path - API path to post to
|
||||
* @param {Object} data - Data to post
|
||||
* @param {Object} options - Additional fetch options
|
||||
* @returns {Promise<any>} - JSON response
|
||||
*/
|
||||
post: async (path, data, options = {}) => {
|
||||
const url = getApiUrl(path);
|
||||
console.log(`[API] Posting to: ${url}`);
|
||||
|
||||
const response = await fetch(url, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
...options.headers,
|
||||
},
|
||||
body: JSON.stringify(data),
|
||||
...options,
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`API request failed: ${response.status}`);
|
||||
}
|
||||
|
||||
return response.json();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// Create a singleton instance for easier imports
|
||||
export const apiClient = createApiClient();
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
/**
|
||||
* Utility functions to access runtime configuration values
|
||||
*/
|
||||
|
||||
/**
|
||||
* Gets configuration from runtime values (window.RUNTIME_CONFIG) with fallback to environment variables
|
||||
* This ensures dynamic configuration at runtime instead of build time
|
||||
*/
|
||||
export function useRuntimeConfig() {
|
||||
// For server-side rendering, use environment variables
|
||||
if (typeof window === 'undefined') {
|
||||
return {
|
||||
apiUrl: process.env.NEXT_PUBLIC_LEARNHOUSE_API_URL,
|
||||
backendUrl: process.env.NEXT_PUBLIC_LEARNHOUSE_BACKEND_URL,
|
||||
domain: process.env.NEXT_PUBLIC_LEARNHOUSE_DOMAIN,
|
||||
defaultOrg: process.env.NEXT_PUBLIC_LEARNHOUSE_DEFAULT_ORG || 'default',
|
||||
multiOrg: process.env.NEXT_PUBLIC_LEARNHOUSE_MULTI_ORG === 'true',
|
||||
topDomain: process.env.NEXT_PUBLIC_LEARNHOUSE_TOP_DOMAIN
|
||||
};
|
||||
}
|
||||
|
||||
// For client-side, prioritize runtime config over baked-in environment variables
|
||||
const config = window.RUNTIME_CONFIG || {};
|
||||
return {
|
||||
apiUrl: config.LEARNHOUSE_API_URL || process.env.NEXT_PUBLIC_LEARNHOUSE_API_URL,
|
||||
backendUrl: config.LEARNHOUSE_BACKEND_URL || process.env.NEXT_PUBLIC_LEARNHOUSE_BACKEND_URL,
|
||||
domain: config.LEARNHOUSE_DOMAIN || process.env.NEXT_PUBLIC_LEARNHOUSE_DOMAIN,
|
||||
defaultOrg: config.LEARNHOUSE_DEFAULT_ORG || process.env.NEXT_PUBLIC_LEARNHOUSE_DEFAULT_ORG || 'default',
|
||||
multiOrg: config.LEARNHOUSE_MULTI_ORG === 'true' || process.env.NEXT_PUBLIC_LEARNHOUSE_MULTI_ORG === 'true',
|
||||
topDomain: config.LEARNHOUSE_TOP_DOMAIN || process.env.NEXT_PUBLIC_LEARNHOUSE_TOP_DOMAIN
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets the API URL with the correct domain
|
||||
* @param {string} path - The API path
|
||||
* @returns {string} - The complete API URL
|
||||
*/
|
||||
export function getApiUrl(path) {
|
||||
const config = useRuntimeConfig();
|
||||
return `${config.apiUrl || `https://${config.domain}/api/v1/`}${path}`;
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets the backend URL with the correct domain
|
||||
* @param {string} path - The backend path
|
||||
* @returns {string} - The complete backend URL
|
||||
*/
|
||||
export function getBackendUrl(path) {
|
||||
const config = useRuntimeConfig();
|
||||
return `${config.backendUrl || `https://${config.domain}/`}${path}`;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue