Introducing Edgio Applications v7. Find out what's new.
Edgio
Edgio

Common Routing Patterns

Upgrading from Edgio Applications version 6 or earlier may require significant changes to your CDN-as-code configuration as certain core legacy components have limited support. View our upgrading guide.
This guide gives examples of common routing patterns using Edgio.

Proxying an Origin

Same Path

To forward a request to the same path on one of the origins listed in edgio.config.js, use the origin feature:
JavaScript
1router.get('/some-path', {
2  origin: {
3    set_origin: 'origin',
4  },
5});
The value of set_origin corresponds to the name property of an origin in edgio.config.js. For example:
JavaScript
1module.exports = {
2  // ... other configurations
3

4  origins: [
5    {
6      name: 'origin',
7      hosts: [
8        {
9          // The domain name or IP address of the origin server
10          location: 'www.my-site.com',
11        },
12      ],
13    },
14  ],
15}

Different Path

To forward the request to a different path, use the url.url_rewrite feature:
JavaScript
1router.get('/products/:productId', {
2  origin: {
3    set_origin: 'origin',
4  },
5  url: {
6    url_rewrite: [
7      {
8        source: '/products/:productId',
9        syntax: 'path-to-regexp',
10        destination: '/p/:productId',
11      },
12    ],
13  },
14});

Adding Caching

To cache proxied requests at the edge, use the caching feature:
JavaScript
1router.get('/products/:productId', {
2  caching: {
3    max_age: '1d',
4    stale_while_revalidate: '1h',
5  },
6  origin: {
7    set_origin: 'origin',
8  },
9});

Altering the Request

You can alter request headers when forwarding a request to a backend:
JavaScript
1router.get('/products/:productId', {
2  headers: {
3    set_request_headers: {
4      'header-name': 'some-value',
5    },
6  },
7  origin: {
8    set_origin: 'origin',
9  },
10});
The above example makes use of the headers.set_request_headers feature.

Altering the Response

You can also alter the response before and after the cache:
JavaScript
1router.get('/products/:productId', {
2  origin: {
3    set_origin: 'origin',
4  },
5  headers: {
6    // remove `header-name` from the origin response
7    remove_origin_response_headers: ['header-name'],
8

9    // add `header-name` to the response, appending the value to the
10    // header if it already exists
11    add_response_headers: {
12      'header-name': 'some-value',
13    },
14

15    // set/overwrite `header-name` to `some-value` in the response
16    set_response_headers: {
17      'header-name': 'some-value',
18    },
19

20    // append `another-value` to `header-name` in the response,
21    // becoming `some-value,another-value`
22    set_response_headers: {
23      '+header-name': ',another-value',
24    },
25

26    // remove `header-name` from the response by name
27    remove_response_headers: ['header-name'],
28

29    // or set with an empty value to remove `header-name` from the response
30    set_response_headers: {
31      'header-name': '',
32    },
33  },
34});
Additional information on the headers feature can be found in the Features guide.

Altering All Responses

You can also write catch-all routes that will alter all responses. One example where this is useful is injecting Content Security Policy headers.
Another example is adding response headers for debugging, which is often useful if Edgio is behind another CDN or if you are troubleshooting your router rules. For example, you could respond with the value of request x-forwarded-for into x-debug-xff to see the value that Edgio is receiving from the CDN:
JavaScript
1router.match(
2  {
3    path: '/:path*',
4    query: {
5      my_site_debug: 'true',
6    },
7  },
8  {
9    headers: {
10      set_response_headers: {
11        'x-debug-xff': '%{http_x_forwarded_for}',
12      },
13    },
14  }
15);
The rules for interpolating the values of request and response objects can be found in the routing guide. Note that catch-all routes that alter headers, cookies, or caching can be placed at the start of your router while allowing subsequent routes to run because they alter the request or the response without actually sending a response. See route execution for more information on route execution order and sending responses.

Manipulating Cookies

You can manipulate cookies before they are sent to the browser using headers.set_response_headers:
JavaScript
1router.get('/products/:productId', {
2  origin: {
3    set_origin: 'origin',
4  },
5  headers: {
6    // add cookie `foo=bar` to the response
7    add_response_headers: {
8      'set-cookie': 'foo=bar;',
9    },
10  },
11});

Adding Options to Cookies

In addition to the name and value of the cookie, you can also add attributes to each cookie. For information on possible cookie attributes, please refer to https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie
JavaScript
1import {serializeCookie} from '@edgio/core/utils/cookieUtils';
2

3router.get('/products/:productId', {
4  origin: {
5    set_origin: 'origin',
6  },
7  headers: {
8    // set cookie with options
9    add_response_headers: {
10      'set-cookie': 'foo=bar; Secure; HttpOnly;',
11    },
12

13    // set cookie with options using the serializeCookie helper
14    add_response_headers: {
15      'set-cookie': serializeCookie('foo', 'bar', {
16        Secure: true,
17        HttpOnly: true,
18      }),
19    },
20  },
21});

Proxying to Different Backends Based on Different Host Names

To proxy to different backends by matching the host header (e.g. different backends for different international sites):
JavaScript
1router
2  .match(
3    {
4      path: '/:path*',
5      headers: {
6        host: 'yoursite.c1',
7      },
8    },
9    {
10      origin: {
11        set_origin: 'country1-backend',
12      },
13    }
14  )
15  .match(
16    {
17      path: '/:path*',
18      headers: {
19        host: 'yoursite.c2',
20      },
21    },
22    {
23      origin: {
24        set_origin: 'country2-backend',
25      },
26    }
27  )
28  .match(
29    {
30      path: '/:path*',
31    },
32    {
33      origin: {
34        set_origin: 'everybody-else-backend',
35      },
36    }
37  );

Serving a Static File

To serve a specific file use the origin.set_origin feature with the edgio_static value:
JavaScript
1router.get('/favicon.ico', {
2  caching: {
3    max_age: '1d',
4    client_max_age: '1h',
5  },
6  origin: {
7    set_origin: 'edgio_static',
8  },
9  url: {
10    url_rewrite: [
11      {
12        source: '/favicon.ico',
13        syntax: 'path-to-regexp',
14        destination: '/assets/favicon.ico',
15      },
16    ],
17  },
18});

Serving Static Files From a Directory

Here’s an example that serves all requests by sending the corresponding file in the public directory
JavaScript
1router.get('/:path*', {
2  caching: {
3    max_age: '1d',
4    bypass_client_cache: true,
5  },
6  origin: {
7    set_origin: 'edgio_static',
8  },
9  url: {
10    url_rewrite: [
11      {
12        source: '/:path*',
13        syntax: 'path-to-regexp',
14        destination: '/public/:path*',
15      },
16    ],
17  },
18});

Routing to Serverless

If your request needs to be run on the serverless tier, you can use the SERVERLESS_ORIGIN_NAME origin to render your result using your application. Use this method to respond with an SSR or API result from your application:
JavaScript
1import {SERVERLESS_ORIGIN_NAME} from '@edgio/core/origins';
2

3router.get('/some/:path*', {
4  caching: {
5    max_age: '1d',
6    bypass_client_cache: true,
7  },
8  origin: {
9    set_origin: SERVERLESS_ORIGIN_NAME,
10  },
11});

Redirecting

To redirect the browser to a different URL, use the url.url_redirect feature, optionally specifying the HTTP status code:
JavaScript
1router.get('/p/:productId', {
2  url: {
3    url_redirect: {
4      code: 301,
5      source: '/p/:productId',
6      syntax: 'path-to-regexp',
7      destination: '/products/:productId',
8    },
9  },
10});

Redirecting All Traffic to a Different Domain

JavaScript
1// Redirect all traffic except those with host header starting with www. to www.mydomain.com
2router.match(
3  {headers: {host: /^(?!www\.).*$/}},
4  {
5    url: {
6      url_redirect: {
7        code: 302,
8        destination: 'https://www.mydomain.com%{request_uri}',
9      },
10    },
11  }
12);
13

14// Redirect all traffic from www.domain.com to domain.com
15router.match(
16  {headers: {host: /^(www\.).*$/}},
17  {
18    url: {
19      url_redirect: {
20        code: 302,
21        destination: 'https://domain.com%{request_uri}',
22      },
23    },
24  }
25);

Blocking Unwanted Traffic

Blocking traffic from specific countries

If you need to block all traffic from a specific country or set of countries, you can do so by matching requests by the country code using the location.country match condition:
JavaScript
1router.conditional({
2  if: [
3    {
4      or: [
5        {
6          '===': [
7            {
8              location: 'country',
9            },
10            'XX',
11          ],
12        },
13        {
14          or: [
15            {
16              '===': [
17                {
18                  location: 'country',
19                },
20                'XY',
21              ],
22            },
23            {
24              '===': [
25                {
26                  location: 'country',
27                },
28                'XZ',
29              ],
30            },
31          ],
32        },
33      ],
34    },
35    {
36      access: {
37        deny_access: true,
38      },
39    },
40  ],
41});
You can find more about geolocation headers here.

Blocking Search Engine Crawlers

If you need to block all search engine bot traffic to specific environments (such as your default or staging environment), the easiest way is to include the x-robots-tag header with the same directives you would otherwise set in a meta tag.
Additionally, you can customize this to block traffic to development or staging websites based on the host header of the request:
JavaScript
1router.get(
2  {
3    headers: {
4      // Regex to catch multiple hostnames
5      host: /dev.example.com|staging.example.com/,
6    },
7  },
8  {
9    headers: {
10      set_response_headers: {
11        'x-robots-tag': 'noindex, nofollow',
12      },
13    },
14  }
15);
For other available directives, see Google Developer Central and Bing Webmaster Tools for lists of supported options.