Web Proxy Unblocker - Interfaccia lato client

45 iroger7

Apri nell'Editor Pubblica il Tuo Codice

Web Proxy Unblocker - Interfaccia lato client

Consigliato

26 October 2024

Modello di sito Web per portfolio di sviluppatori HTML CSS

25 November 2024

Sito web reattivo con dati sugli studenti

24 November 2025

Caricatore di giochi Unity WebGL con supporto per annunci pubblicitari

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Simple Web Proxy Unblocker Interface</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 20px;
            background-color: #f4f4f9;
            text-align: center;
        }
        .proxy-container {
            max-width: 900px;
            margin: 0 auto;
            background: #fff;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        }
        h1 {
            color: #333;
            margin-bottom: 20px;
        }
        #urlInput {
            width: 70%;
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 4px;
            font-size: 16px;
            margin-right: 10px;
        }
        #goButton {
            padding: 10px 20px;
            background-color: #007bff;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-size: 16px;
            transition: background-color 0.3s;
        }
        #goButton:hover {
            background-color: #0056b3;
        }
        #proxyFrame {
            width: 100%;
            height: 60vh;
            border: 2px solid #ccc;
            margin-top: 20px;
            border-radius: 4px;
        }
        .warning {
            margin-top: 15px;
            color: #666;
            font-size: 0.9em;
        }
    </style>
</head>
<body>

<div class="proxy-container">
    <h1>Proxy Web Unblocker</h1>
    <p>Enter the URL you wish to access:</p>
    
    <input type="text" id="urlInput" placeholder="e.g., https://google.com">
    <button id="goButton">Go</button>
    
    <div class="warning">
        Note: This client-side interface simulates a proxy. Actual proxy functionality depends on a server-side component not included here. Cross-origin restrictions may prevent some sites from loading in the frame.
    </div>

<iframe id="proxyFrame" name="proxyFrame" srcdoc="<p style='text-align:center; padding-top: 50px;'>Content will appear here.</p>"></iframe>
</div>

function loadUrl() {
        const urlInput = document.getElementById('urlInput');
        const proxyFrame = document.getElementById('proxyFrame');
        let url = urlInput.value.trim();

if (url === "") {
            alert("Please enter a URL.");
            return;
        }

// Simple protocol check and prepend if missing
        if (!url.startsWith('http://') && !url.startsWith('https://')) {
            url = 'http://' + url;
        }

// Set the iframe source to the constructed URL
        proxyFrame.src = url;
    }
</script>

</body>
</html>

Consigliato

Modello di sito Web per portfolio di sviluppatori HTML CSS

Sito web reattivo con dati sugli studenti

Caricatore di giochi Unity WebGL con supporto per annunci pubblicitari

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS