Code Monkey home page Code Monkey logo

proxyflare-for-pages's Introduction

Proxyflare for Cloudflare Pages

Visit our website for the full documentation.

Overview

Proxyflare is a reverse proxy that makes it easy to move HTTP traffic around your domain and across the internet.

This package provides Proxyflare as a Cloudflare Pages plugin. Any website deployed on Cloudflare Pages may use Proxyflare.

Proxyflare is a middleware layer that matches incoming requests to Routes in your Configuration.

Refer to the Cloudflare documentation for more information about Pages Middleware, Pages Functions and other awesome community Plugins that can enhance your website.

Use cases

Proxy traffic to another service

Proxy traffic from a part of your domain to another service on the same domain or elsewhere on the internet

Examples

  1. Move traffic from https://yoursite.com/api/* to https://your-hosted-api.com
  2. Host a service on https://torrents.yoursite.com/* that points to http://yoursite.com:41321

Notes

  • Proxyflare works over http(s): and ws(s): (websockets)
  • A proxied service must be available on the public internet
  • Both standard and custom ports are supported (e.g. 80, 443, 8787, etc.)

Learn more

Mount a hosted website on your domain

Examples

  1. Mount your React-powered documentation hosted at https://hosted-docs.com on https://yoursite.com/docs/*
  2. Mount a WordPress site hosted at https://some-wordpress-blog.com on https://yoursite.com/blog/*

Notes

  • Mounted websites should configure the base url to match its mounted pathname
  • Static resources such as stylesheets must be carefully added to Route["to.website.resources"]

Learn more

Redirect traffic from one place to another

  1. Version an API (e.g. redirect /v2/api)
  2. Redirect stale content URLs

Notes

  • Redirects are wildcard-compatible
  • Any 300-level status code is supported

Learn more

Serve static content through Proxyflare

  1. Publish unique robots.txt and other website metadata files around your domain

Notes

  • Custom response headers are supported to set Content-Type for text, JSON, or others
  • Text files should be no larger than 16KB

Learn more

Install

Install @flaregun-net/proxyflare-for-pages and @cloudflare/workers-types using your preferred Node.js package manager

npm install @flaregun-net/proxyflare-for-pages
npm install -D @cloudflare/workers-types

Plug in

Scaffold

In your Cloudflare Pages project, create a functions/_middleware.ts file. The name of this file must be exactly as written because Cloudflare Pages uses the file name internally for routing. If your project already has a functions/_middleware.ts that exports a single onRequest object, convert it to a list of middleware for convenience. Middleware is called in the order listed.

The onRequest middlewares should include the following configuration. Notice that we wrap Proxyflare in a PagesFunction in order to use environment variables with Proxyflare. Learn more about environment variables and secrets.

import proxyflare from "@flaregun-net/proxyflare-for-pages"

const routes: Route[] = []

// `PagesFunction` is from @cloudflare/workers-types
export const onRequest: PagesFunction[] = [
  (context) =>
    proxyflare({
      config: {
        global: { debug: true },
        routes,
      },
    })(context),
  // other Pages plugins and middleware
]

This is a barebones Proxyflare configuration with debug enabled that will help with set up and configuration. Learn more about debugging Proxyflare.

Configure

Next, you'll need to write your first Route. Check out the use cases section to find Route ideas. If you don't have one yet, try this example:

const routes: Route[] = [
  {
    from: {
      pattern: "yourdomain.com/proxyflare-example",
      alsoMatchWWWSubdomain: true,
    },
    to: { url: "https://example.com" },
  },
]

Replace yoursite.com with your domain name.

Deploy

Once you have a Route set up, deploy a new version of your Cloudflare Pages website, and keep an eye on the deployment. Once the deployment is successful, navigate to your domain.

For the example Route above, you should see https://example.com rendered at yourdomain.com/proxyflare-example. If you don't see it, refer to the debugging Proxyflare section or reach out for help in Discord.

Next steps

Now that you're up and running, check out the Tutorials to learn more about what you can do with Proxyflare.

proxyflare-for-pages's People

Contributors

stevefrench39 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.