Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Queuing package template for JavaScript based Fastly Compute projects. Park your users in a virtual queue to reduce the demand on your origins during peak times.

License

NotificationsYou must be signed in to change notification settings

fastly/compute-starter-kit-javascript-queue

Repository files navigation

Park website visitors in a virtual queue to reduce the demand on your origins during peak times.

For more details about other starter kits for Fastly Compute, see theFastly Documentation Hub

A screenshot of the queue page for a ticketing website. It reads: Sometimes we have to restrict the number of people who can access our website at the same time, so that everything works properly. There are 46 people ahead of you in the queue.

Features

  • Park visitors in a queue to limit the amount of active users on the website ⏳
  • Ship queue analytics tolog endpoints 🔎
  • Allow certain requests such as robots.txt, favicon to bypass the queue 🤖
  • No client-side scripting required ⚡️

Getting started

  1. If you haven't already,sign up for Upstash and create a Redis service.
  2. Create a new directory for your application and switch to it. Initialize a Compute project using this starter kit.
    npm create @fastly/compute@latest -- --language=javascript --starter-kit=queue
  3. Create theupstash backend, changing the default hostname to the one provided in the Upstash console.
  4. Create theprotected_content backend by accepting the default example host or setting your own.
  5. Populate theconfig config store by following the prompts to configure Upstash and set a secret for signing cookies.
  6. Runnpm run deploy to deploy your queue to your Fastly account.

Understanding the code

This starter is fully-featured, and requires some dependencies on top of the@fastly/js-compute npm package. The following is a list of the dependencies used:

  • @upstash/redis - a REST-based Redis client for storing queue state. You could easily swap this for your own storage backend.
  • jws - a library for generating and validatingJSON Web Tokens.

The starter will require a backend to be configured to send requests to once visitors have made it through the queue. For demonstration, the default is a public S3 bucket with some assets and an index page.

The template uses webpack to bundleindex.js and its imports into a single JS file,bin/index.js, which is then wrapped into a.wasm file,bin/index.wasm using thejs-compute-runtime CLI tool bundled with the@fastly/js-compute npm package, and bundled into a.tar.gz file ready for deployment to Compute.

Design

When a visitor makes a request for the first time, we generate a signed JWT containing theirposition in the queue, which is determined by fetching the current queuelength from Redis (INCR queue:length). This signed JWT is sent back to the visitor as an HTTP cookie.

On a regular basis, the current queuecursor is updated in Redis (INCR queue:cursor). This effectively lets a user in. To show a visitor how many others are in front of them in the queue, we subtract the current queuecursor from theposition saved in their JWT.

On subsequent requests, when a JWT is supplied, we verify the signature and extract theposition from the JWT. If the current queuecursor is higher than the user's signedposition, they will be allowed in.

Security issues

Please see ourSECURITY.md for guidance on reporting security-related issues.

About

Queuing package template for JavaScript based Fastly Compute projects. Park your users in a virtual queue to reduce the demand on your origins during peak times.

Topics

Resources

License

Code of conduct

Security policy

Stars

Watchers

Forks

Contributors7


[8]ページ先頭

©2009-2025 Movatter.jp