Tencent Cloud

Recent Pages

Getting Started

Last updated: 2024-01-02 10:34:59

This document describes how to create a simple edge function and use the function to redirect a request to another URL and return the custom response header.
Overview
The site example.com is currently connected to EdgeOne service. Under this site, a custom HTML activity page needs to be provided to the users through the custom domain name www.example.com. This page can be deployed to the edge nodes of EdgeOne's global AZs through the edge function for users to access nearby.
Note:
1. How to connect to the site, please refer to Quick Start.
2. How to add an acceleration domain, please refer to Adding a Domain Name for Acceleration.
Directions
Step 1: Creating and Deploying a Function
1. Log in to the EdgeOne Console and click Site List in the left sidebar. In the site list, click the Site to be configured.
2. On the site details page, click Edge Function > Function Management.
3. On the edge function management page, click Create function and select to create a function using a template. At this step, you can use a template to create a function according to actual business needs. Taking the current scenario as an example, you can select the "Create Hello World" template to create a new one. After selecting the template, click Next.
4. On the new Edge Functions page, configure the relevant parameters. The explanations for these parameters are as follows:
Function: Required, it can only contain letters, numbers, hyphens. It should start with a letter and end with a number or letter, 2-30 characters; and it cannot be modified after creation. For example: test-edgefunctions.
Description: Optional, it supports up to 60 characters. For Example: Custom HTML page and response header.
Code: The edge function code that needs to respond. In the current scenario, you may copy the following function code, paste it into the code editor of the console, and replace the default code in the editor.
const html = `
  <!DOCTYPE html>
  <body>
 <h1>Hello World</h1>
 <p>This markup was generated by TencentCloud Edge Functions.</p>
 <a href="https://cloud.tencent.com/product/teo">TencentCloud EdgeOne</a>
  </body>
`;
﻿
async function handleRequest(request) {
  return new Response(html, {
 headers: {
   'content-type': 'text/html; charset=UTF-8',
   'x-edgefunctions-test': 'Welcome to use Edge Functions.',
 },
  });
}
﻿
addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request));
});
Note
The preceding code creates a custom HTML and adds the following custom response header: x-edgefunctions-test: Welcome to use Edge Functions.
5. Click Create and deploy. If you see the following pop-up dialog box, the deployment is successful.
﻿
﻿
Step 2. Configuring a Triggering Rule
If you want to trigger function execution by setting HOST, URL Path, or file extensions of the matching sites, you could proceed in the following two steps:
1. After the function is deployed successfully, click Add triggering rule.
2. On the add triggering rule page, configure the matching conditions. Taking the current scenario as an example, you can select the Matching type as "HOST", the Operator as "Is", and the value as the added subdomain www.example.com. Click OK to create the trigger rule.
﻿
Step 3: Verifying the Edge Function
To check whether the function is working as expected, you can initiate a request in a browser or by using Curl.
Browser Verification
Curl Verification
Enter the URL in the browser, for instance:https://www.example.com/test-edgefunctions. This URL can match the set trigger conditions to trigger the execution of the function and view the response page information.
﻿
Run the curl request command within the MAC/Linux terminal to verify. For example:curl https://www.example.com/test-edgefunctions. The response can be viewed as follows:
﻿
﻿
﻿