netlify / edge-functions-examples Goto Github PK

View Code? Open in Web Editor NEW

69.0 6.0 29.0 1.97 MB

Explore a library of reference examples for learning about Edge Functions on Netlify.

Home Page: https://edge-functions-examples.netlify.app/

JavaScript 70.92% CSS 9.67% HTML 3.01% TypeScript 16.40%

edge-functions serverless examples netlify javascript typescript

edge-functions-examples's Introduction

Netlify Edge Functions Examples

Explore these examples here: https://edge-functions-examples.netlify.app/

Responses

Rewrites and proxies

HTTP Headers

Transforming responses

Geolocation

Cookies

Streams

WebAssembly

Edge WebAssembly

Environment and debugging

Deploy this site to Netlify

Click this button to deploy this site automatically to your Netlify account.

edge-functions-examples's People

Contributors

Stargazers

Watchers

edge-functions-examples's Issues

Where should I get netlify:edge dependency for Context type?

As the title says. When I'm developing my edge function, IDE doesn't know where to get netlify:edge package to gather the Context type. Where should I import this?

Unable to set Custom Response header via edge function

Following the documentation I was able get the hello world edge function running and to verify it via the netlify cli. However when I switch out the body of the test.ts file with response edge function to:

import type { Context } from "https://edge.netlify.com";

export default async (request: Request, context: Context) => {
  const url = new URL(request.url);

  if (url.searchParams.get("method") !== "set-response-header") {
    return context.next();
  }

  context.log(`Adding a custom header to the response for ${url}`);

  const response = await context.next();
  response.headers.set("X-Your-Custom-Header", "Your custom header value");
  return response;
};

and update the netlify.tomi to

[[edge_functions]] 
path = "/*"
function = "hello"

I can see that the edge function is◈ Loaded edge function hello up via the --edgeInspect flag, but when inspected the page I do not see the reponse header. Connecting the debugger doesn't lead to much helpful information that I can see.

set headers when using context.json()

This is just a question.
When using context.json() the "content-type" is "application/json" by default.
How to set it to "application/json; charset=utf-8"?

edge function: route not found

my edge function not found route

my code :https://github.com/bobwatcherx/edgefix

thanks

[security] Activate Github Advanced Security

This is an issue generated by github-tools

Description

This repository has exceeded the development grace period, and the repo owner must decide if certain security scan tooling should be activated.
If this repository houses code that touches production in any capacity, code scanning and secret scanning must be enforced. See the SDLC - Secure Coding Guidelines for more details

What do I need to do?

You can activate code scanning and/or secret scanning by creating the labels:
activate-code-scanning: true or activate-secret-scanning: true, respectively.
To stop this issue from being recreated, meaning your project does not require these scans, you can conversely create the labels:
activate-code-scanning: false and/or activate-secret-scanning: false.
Once you have created the labels to specify your choice, you can close this issue. If you choose to have code scanning activated, a PR will be opened suggesting a Github Action worflow.
If you have issues or questions, please reach out to #internal-security-n-compliance on slack.

Allow / Blocking IP

Hi,

We register a CNAME record on DNS Cloudflare to point to netlify.app subdomain.

I would like that only the reverse proxy of Cloudflare range IP to be allowed to connect to mysite.netlify.app.

Should I implement an edge function ? possible to manage a WAF rule ?

If it is possible to have an example.

Thanks

The Localized content demo is broken

Based on the code, for Canada, I should see a generic Hello.

Instead I see

Your personalized greeting for Canada is: undefined

Running this project with netlify dev doesn't work

When you run this project with a netlify cli version higher than 12.12.0 it will only show the wasm example.

what you should see

what you actually see

I wonder if it has to do with this change netlify/cli@27bea34

Running netlify dev BEFORE that commit gives:

◈ Netlify Dev ◈
◈ Ignored general context env var: LANG (defined in process)
◈ Using simple static server because '[dev.framework]' was set to '#static'
◈ Running static server from "edge-functions-examples/public"
◈ Setting up local development server

◈ Static server listening to 3999

   ┌─────────────────────────────────────────────────┐
   │                                                 │
   │   ◈ Server now ready on http://localhost:8888   │
   │                                                 │
   └─────────────────────────────────────────────────┘

◈ Loaded edge function [page]
◈ Loaded edge function abtest
◈ Loaded edge function context-site
◈ Loaded edge function cookies
◈ Loaded edge function country-block
◈ Loaded edge function environment
◈ Loaded edge function error
◈ Loaded edge function geolocation
◈ Loaded edge function hello
◈ Loaded edge function image-external
◈ Loaded edge function image-internal
◈ Loaded edge function include
◈ Loaded edge function json
◈ Loaded edge function localized-content
◈ Loaded edge function log
◈ Loaded edge function proxy-requests
◈ Loaded edge function rewrite
◈ Loaded edge function set-request-header
◈ Loaded edge function set-response-header
◈ Loaded edge function transform
◈ Loaded edge function wasm
{
  declarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ],
  filteredDeclarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ]
}
[[page]] serve page for http://localhost:8888/ 
{
  declarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ],
  filteredDeclarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ]
}
{
  declarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ],
  filteredDeclarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ]
}
{
  declarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ],
  filteredDeclarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ]
}
{
  declarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ],
  filteredDeclarations: [
    { function: 'transform', path: '/*' },
    { function: 'set-response-header', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ]
}

Running it after the commit:

◈ Netlify Dev ◈
◈ Ignored general context env var: LANG (defined in process)
◈ Using simple static server because '[dev.framework]' was set to '#static'
◈ Running static server from "edge-functions-examples/public"
◈ Setting up local development server

◈ Static server listening to 3999

   ┌─────────────────────────────────────────────────┐
   │                                                 │
   │   ◈ Server now ready on http://localhost:8888   │
   │                                                 │
   └─────────────────────────────────────────────────┘

◈ Loaded edge function [page]
◈ Loaded edge function abtest
◈ Loaded edge function context-site
◈ Loaded edge function cookies
◈ Loaded edge function country-block
◈ Loaded edge function environment
◈ Loaded edge function error
◈ Loaded edge function geolocation
◈ Loaded edge function hello
◈ Loaded edge function image-external
◈ Loaded edge function image-internal
◈ Loaded edge function include
◈ Loaded edge function json
◈ Loaded edge function localized-content
◈ Loaded edge function log
◈ Loaded edge function proxy-requests
◈ Loaded edge function rewrite
◈ Loaded edge function set-request-header
◈ Loaded edge function set-response-header
◈ Loaded edge function transform
◈ Loaded edge function wasm
{
  declarations: [
    { function: 'wasm', path: '/*' },
    { function: '[page]', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ],
  filteredDeclarations: [
    { function: 'wasm', path: '/*' },
    { function: '[page]', path: '/*' },
    { function: 'set-request-header', path: '/*' },
    { function: 'include', path: '/*' },
    { path: '/hello', function: 'hello' },
    { path: '/geolocation', function: 'geolocation' },
    { path: '/json', function: 'json' },
    { path: '/cookies', function: 'cookies' },
    { path: '/rewrite', function: 'rewrite' },
    { path: '/abtest', function: 'abtest' },
    { path: '/image-internal', function: 'image-internal' },
    { path: '/image-external', function: 'image-external' },
    { path: '/log', function: 'log' },
    { path: '/country-block', function: 'country-block' },
    { path: '/localized-content', function: 'localized-content' },
    { path: '/fetch-joke', function: 'proxy-requests' },
    { path: '/environment', function: 'environment' },
    { path: '/error', function: 'error' },
    { path: '/context-site', function: 'context-site' },
    { path: '/wasm', function: 'wasm' },
    { path: '/example/*', function: '[page]' },
    { path: '/', function: '[page]' }
  ]
}

Install unsuccessful

Got an issue when I tried
npm install netlify-cli -g
2022-05-08T09_25_51_774Z-debug.log

[security] Enforce Branch Protections

This is an issue generated by (for-internal-use-only)github-tools

Description

This repository has exceeded the development grace period, and the repo owner must decide if branch protections should be enforced.
If this repository houses code used in production in any capacity, branch protections must be enforced. Read (for-internal-use-only)here for more details

What do I need to do?

You can control whether or not branch protections are enforced by exclusively creating either of the labels:
'enforce-branch-protections: true' or 'enforce-branch-protections: false'
If there is no branch protection control label, this issue will be recreated.
Once you have created either label, you can close this issue.
If you have issues or questions, please reach out to #internal-security-n-compliance on slack.

Image asset for readme

Recommend Projects

React

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

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

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

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
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.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

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

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.

netlify / edge-functions-examples Goto Github PK

edge-functions-examples's Introduction

Netlify Edge Functions Examples

Responses

Rewrites and proxies

HTTP Headers

Transforming responses

Geolocation

Cookies

Streams

WebAssembly

Environment and debugging

Deploy this site to Netlify

edge-functions-examples's People

Contributors

Stargazers

Watchers

Forkers

edge-functions-examples's Issues

Description

What do I need to do?

what you should see

what you actually see

Description

What do I need to do?

Recommend Projects

Recommend Topics

Recommend Org