Site Proxy

This example demonstrates how to utilize Edge Cloud Apps Function to build a reverse proxy for an entire website. By rewriting request URLs, headers, response headers, and response bodies, seamless access is achieved. It combines both streaming and non-streaming rewriting methods, making it suitable for proxying website content to another domain with flexible modifications. This is useful for scenarios such as migrating old website content to a new domain or integrating third-party website content.

In this example, the content from www.gutenberg.org is proxied to the your-domain.com/gutenberg-proxy path. Rewrites are applied to both requests and responses to ensure proper functionality of the proxied website.

The following modifications are made:

• Request URL Rewriting: The proxy URL accessed by the user is transformed into the origin URL.
• Request Header Rewriting: The Host, Referer, and Origin fields in the request headers are modified to point to the origin.
• Response Header Rewriting: The Set-Cookie and Location fields in the response headers are modified to match the proxy domain.
• Response Body Rewriting: Different rewriting operations are performed based on the response content type:
  • text/html: The HTMLRewriter is used to rewrite URLs within HTML tags.
  • text/css: Regular expressions are used to rewrite the url() functions within CSS files.
  • application/x-javascript and application/json: Regular expressions are used to rewrite URLs within JavaScript and JSON files.

Code Example

const UPSTREAM = "www.gutenberg.org"; // Origin domain
const PATH_PREFIX = "/gutenberg-proxy"; // Proxy path prefix
const RW_START = "/--rw--"; // Start identifier for the proxy domain
const RW_STOP = "--wr--"; // End identifier for the proxy domain
let g_origin_url; // Store the original request URL
let g_path_pfrefix; // Store the proxy path prefix

async function handleRequest(request) {
    g_origin_url = new URL(request.url); 

    // Handle POST requests
    if (request.method === "POST") {
        let body = await request.text();
        // Process POST body if needed
    }
    
    // Restore the URL to obtain the origin URL and proxy path prefix
    const {urlString, pathPrefix} = restoreURL(request.url); 
    g_path_pfrefix = pathPrefix;

    const url = new URL(urlString);
    console.log("request.url", request.url);
    console.log("restored url", urlString); 

    // Special handling: Delete the Accept-Encoding header to avoid ungzip errors
    if (url.pathname === "/browse/scores/top") {
        request.headers.delete("Accept-Encoding");
    }

    // Create a new request and modify the request headers
    const newRequest = new Request(urlString, request);
    const headers = newRequest.headers;
    headers.set("Host", url.host); // Set the Host header to the origin domain
    
    // Rewrite the Referer header
    const referer = headers.get("Referer");
    if (referer) {
        const {urlString, pathPrefix} = restoreURL(referer);
        headers.set("Referer", urlString); 
        if (!url.pathname.endsWith(".css")) {
            g_path_pfrefix = pathPrefix;
        }
    }

    // Rewrite the Origin header
    const origin = headers.get("Origin");
    if (origin) {
        const {urlString} = restoreURL(origin);
        headers.set("Origin", urlString);
    }

    // Send the request to the origin
    const response = await fetch(newRequest, {cdnProxy: false, redirect: "manual"}); 
    const responseHeaders = response.headers;

    // Rewrite the Set-Cookie header
    let cookie = responseHeaders.get("Set-Cookie");
    if (cookie) {
        cookie = cookie.replace(/(domain=)([^;]+);/gi, '$1'+g_origin_url.host+';');
        responseHeaders.set("Set-Cookie", cookie);
    }

    // Rewrite the Location header
    let location = responseHeaders.get("Location");
    if (location) {
        location = rewriteURL(location);
        responseHeaders.set("Location", location);
    }

    const contentType = getResponseHeader(response, "Content-Type");
    
    // Perform different rewrite operations based on the response content type
    if (contentType.includes("text/html")) {
        return new HTMLRewriter()
                    .on("a", new URLHandler(["href", "data-url", "data-verify-url"]))
                    .on("link", new URLHandler(["href"]))
                    .on("script", new URLHandler(["src"]))
                    .on("iframe", new URLHandler(["src"]))
                    .on("input", new URLHandler(["src"]))
                    .on("div", new URLHandler(["style", "data-url", "data-status-url"]))
                    .on("img", new URLHandler(["src", "data-origin"]))
                    .on("form", new URLHandler(["action"]))
                    .on("meta", new URLHandler(["content"]))
                    .on("span", new URLHandler(["data-verify-url"]))
                    .transform(response);
    } else if (contentType.includes("text/css")) {
        let text = await response.text();
        text = rewriteText(text, /url\((.*?)\)/g);
        return new Response(text, response);
    } else if (contentType.includes("application/x-javascript")) {
        let text = await response.text();
        text = text.replace(/https:\\\/\\\//g, "https://");
        text = rewriteText(text, /'(\/j\/subject\/)'/g);
        text = rewriteText(text, /"https?:(\/\/.*?)"/gi);
        text = rewriteText(text, /'https?:(\/\/.*?)'/gi);
        text = rewriteText(text, /\.get\("(.*?)\"/g);
        return new Response(text, response);
    } else if (contentType.includes("application/json")) {
        let text = await response.text();
        text = rewriteText(text, /"https?:(\/\/.*?)"/gi);
        return new Response(text, response);
    } else {
        return response;
    }
}

// Retrieve the response header
function getResponseHeader(response, headerName) {
    const value = response.headers.get(headerName);
    return value ? value.toLowerCase() : "";
}

// Rewrite URLs within the text
function rewriteText(text, reg) {
    let result = text.replace(reg,  function(match, str){
        let result = match.replace(str, rewriteURL(str));
        result = result.replace("https", "http");
        return result;
    });
    return result;
}

// Handle URLs within HTML elements
class URLHandler {
    constructor(attrs) {
        this.attrs = attrs;
    }
    text(text) {
        let result = rewriteText(text.text, /':?(\/\/.*?)'/g);
        result = rewriteText(result, /"https?:(\/\/.*?)"/gi);
        result = rewriteText(result, /'https?:(\/\/.*?)'/gi);
        if (result != text.text) {
            text.replace(result);
        }
        
    }
	element(element) {
        for (let attr of this.attrs) {
            const href1 = element.getAttribute(attr);
            if (!href1) continue;
            let href2;
            if (attr === "style") {
                href2 = rewriteText(href1,  /url\((.*?)\)/g);
            } else {
                href2 = rewriteURL(href1);
            }
            if (href1 != href2) {
                element.setAttribute(attr, href2);
            }
        }
	}
}

// Rewrite the URL, transforming the origin URL to the proxy URL
function rewriteURL(originURL) {
    if (!originURL.startsWith("/") && !originURL.startsWith("http")) {
        return originURL;
    }
    originURL = originURL.replace(///g, "/").replace(/\\\//g, "/");
    if (originURL.startsWith("https://")) {
        originURL = originURL.replace("https://", "http://");
    }
    let fullURL = originURL;
    if (originURL.startsWith("//")) {
        fullURL = "http:" + originURL;
    } else if (originURL.startsWith("/")) {
        return g_path_pfrefix + originURL;
    }
    try {
        const url = new URL(fullURL);
        let host = '';
        if (url.host != UPSTREAM) {
            host = `${RW_START}${url.host.replace(/\./g, "---")}${RW_STOP}`;
        }
        const rw = `${g_origin_url.host}${PATH_PREFIX}${host}`;
        return originURL.replace(url.host, rw); 
    } catch (e) {
        console.error("rewriter error", e, originURL);
        return originURL;
    }
}

// Restore the URL, transforming the proxy URL back to the origin URL
function restoreURL(rewritedURL) {
    if (rewritedURL.endsWith(PATH_PREFIX) || rewritedURL.endsWith(RW_STOP)) {
        rewritedURL += "/";
    }

    const url = new URL(rewritedURL);
    let pathname = url.pathname;
    let pathPrefix, host;

    if (pathname.startsWith(PATH_PREFIX)) {
        pathname = pathname.substring(PATH_PREFIX.length);
    }
    
    if (pathname.startsWith(RW_START) && pathname.includes(RW_STOP)) {
        const stop = pathname.indexOf(RW_STOP);
        pathPrefix = PATH_PREFIX + pathname.substring(0, stop + RW_STOP.length);
        host = pathname.substring(RW_START.length, stop).replace(/---/g, ".");
    } else {
        host = UPSTREAM;
        pathPrefix = PATH_PREFIX;
    }

    return {
        urlString: rewritedURL.replace(url.protocol, "https:").replace(url.host, host).replace(pathPrefix, ''), 
        pathPrefix: pathPrefix
    };
}
                    
addEventListener("fetch", event => {
    return event.respondWith(handleRequest(event.request));
});