From 261eb642bcc250c99a1cbbe5b967897bec6f64f5 Mon Sep 17 00:00:00 2001 From: Glenn Gailey Date: Mon, 26 Aug 2024 17:25:21 -0700 Subject: [PATCH 1/5] Fixes https://github.com/Azure-Samples/functions-quickstart-javascript-azd/issues/6 --- src/functions/httpGetFunction.js | 2 +- src/functions/httpPostBodyFunction.js | 2 +- src/functions/test.http | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/functions/httpGetFunction.js b/src/functions/httpGetFunction.js index f052a8f..ddcf89c 100644 --- a/src/functions/httpGetFunction.js +++ b/src/functions/httpGetFunction.js @@ -1,6 +1,6 @@ const { app } = require('@azure/functions'); -app.http('httpGetFunction', { +app.http('httpget', { methods: ['GET'], authLevel: 'function', handler: async (request, context) => { diff --git a/src/functions/httpPostBodyFunction.js b/src/functions/httpPostBodyFunction.js index 3227e35..d38cc66 100644 --- a/src/functions/httpPostBodyFunction.js +++ b/src/functions/httpPostBodyFunction.js @@ -1,6 +1,6 @@ const { app } = require('@azure/functions'); -app.http('httpPostBodyFunction', { +app.http('httppost', { methods: ['POST'], authLevel: 'function', handler: async (request, context) => { diff --git a/src/functions/test.http b/src/functions/test.http index dc570ee..cc0183d 100644 --- a/src/functions/test.http +++ b/src/functions/test.http @@ -1,8 +1,8 @@ -GET http://localhost:7071/api/httpGetFunction HTTP/1.1 +GET http://localhost:7071/api/httpget HTTP/1.1 ### -POST http://localhost:7071/api/httpPostBodyFunction HTTP/1.1 +POST http://localhost:7071/api/httppost HTTP/1.1 content-type: application/json { From 08f5b94098e75775fb4450db657e420e4fa647fb Mon Sep 17 00:00:00 2001 From: Glenn Gailey Date: Fri, 30 Aug 2024 13:39:48 -0700 Subject: [PATCH 2/5] Readme conforming updates --- .vscode/settings.json | 9 +++ README.md | 137 +++++++++++++++++++++++++++--------------- 2 files changed, 99 insertions(+), 47 deletions(-) create mode 100644 .vscode/settings.json diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..100329f --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,9 @@ +{ + "azureFunctions.deploySubpath": ".", + "azureFunctions.postDeployTask": "npm install (functions)", + "azureFunctions.projectLanguage": "JavaScript", + "azureFunctions.projectRuntime": "~4", + "debug.internalConsoleOptions": "neverOpen", + "azureFunctions.projectLanguageModel": 4, + "azureFunctions.preDeployTask": "npm prune (functions)" +} \ No newline at end of file diff --git a/README.md b/README.md index e2937d3..7808695 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,12 @@ --- -name: "Azure Functions JavaScript HTTP Trigger using AZD" -description: This repository contains an Azure Functions HTTP trigger quickstart written in JavaScript and deployed to Azure Functions Flex Consumption using the Azure Developer CLI (AZD). This sample uses managed identity and a virtual network to insure it is secure by default. +name: Azure Functions JavaScript HTTP Trigger using Azure Developer CLI +description: This repository contains an Azure Functions HTTP trigger quickstart written in JavaScript and deployed to Azure Functions Flex Consumption using the Azure Developer CLI (azd). The sample uses managed identity and a virtual network to make sure deployment is secure by default. page_type: sample languages: +- azdeveloper +- bicep - nodejs -- JavaScript +- javascript products: - azure - azure-functions @@ -12,71 +14,88 @@ products: urlFragment: functions-quickstart-javascript-azd --- -# Azure Functions JavaScript HTTP Trigger using AZD +# Azure Functions JavaScript HTTP Trigger using Azure Developer CLI -This repository contains a Azure Functions HTTP trigger quickstart written in JavaScript and deployed to Azure using Azure Developer CLI (AZD). This sample uses managed identity and a virtual network to insure it is secure by default. +This repository contains an Azure Functions HTTP trigger quickstart written in JavaScript and deployed to Azure using Azure Developer CLI (`azd`). The sample uses managed identity and a virtual network to make sure deployment is secure by default. -## Getting Started +## Prerequisites -### Prerequisites ++ [Node.js 20](https://www.nodejs.org/) ++ [Azure Functions Core Tools](https://learn.microsoft.com/azure/azure-functions/functions-run-local?pivots=programming-language-javascript#install-the-azure-functions-core-tools) ++ [Azure Developer CLI (AZD)](https://learn.microsoft.com/azure/developer/azure-developer-cli/install-azd) ++ To use Visual Studio Code to run and debug locally: + + [Visual Studio Code](https://code.visualstudio.com/) + + [Azure Functions extension](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-azurefunctions) -1) [Node.js 20](https://www.nodejs.org/) -2) [Azure Functions Core Tools](https://learn.microsoft.com/azure/azure-functions/functions-run-local?tabs=v4%2Cmacos%2Ccsharp%2Cportal%2Cbash#install-the-azure-functions-core-tools) -3) [Azure Developer CLI (AZD)](https://learn.microsoft.com/azure/developer/azure-developer-cli/install-azd) -4) [Visual Studio Code](https://code.visualstudio.com/) - Only required if using VS Code to run locally +## Initialize the local project -### Get repo on your local machine -Run the following GIT command to clone this repository to your local machine. -```bash -git clone https://github.com/Azure-Samples/functions-quickstart-javascript-azd.git -``` +You can initialize a project from this `azd` template in one of these ways: + ++ Use this `azd init` command from an empty local (root) folder: + + ```shell + azd init --template functions-quickstart-javascript-azd + ``` + + Supply an environment name, such as `flexquickstart` when prompted. In `azd`, the environment is used to maintain a unique deployment context for your app. + ++ Clone the GitHub template repository locally using the `git clone` command: + + ```shell + git clone https://github.com/Azure-Samples/functions-quickstart-javascript-azd.git + cd functions-quickstart-javascript-azd + ``` + + You can also clone the repository from your own fork in GitHub. -## Run on your local environment +## Prepare your local environment + +Add a file named `local.settings.json` in the root of your project with the following contents: -### Prepare your local environment -1) Create a file named `local.settings.json` and add the following: ```json { - "IsEncrypted": false, - "Values": { + "IsEncrypted": false, + "Values": { "AzureWebJobsStorage": "UseDevelopmentStorage=true", "FUNCTIONS_WORKER_RUNTIME": "node" - } + } } ``` -### Using Functions CLI -1) Open this folder in a new terminal and run the following commands: +## Run your app from the terminal -```bash -npm install -func start -``` +1. Run these commands in the virtual environment: -2) Test the HTTP GET trigger using the browser to open http://localhost:7071/api/httpGetFunction + ```shell + npm install + func start + ``` -3) Test the HTTP POST trigger in a new terminal window with the following command, or use your favorite REST client, e.g. [RestClient in VS Code](https://marketplace.visualstudio.com/items?itemName=humao.rest-client), PostMan, curl. `test.http` has been provided to run this quickly. +2. From your HTTP test tool in a new terminal (or from your browser), call the HTTP GET endpoint: -```bash -curl -i -X POST http://localhost:7071/api/httppostbodyfunction -H "Content-Type: text/json" --data-binary "@src/functions/testdata.json" -``` +3. Test the HTTP POST trigger with a payload using your favorite secure HTTP test tool. This example uses the `curl` tool with payload data from the [`testdata.json`](./src/functions/testdata.json) project file: + + ```shell + curl -i http://localhost:7071/api/httppost -H "Content-Type: text/json" -d "@src/functions/testdata.json" + ``` + +## Run your app using Visual Studio Code -### Using Visual Studio Code -1) Open this folder in a new terminal -2) Open VS Code by entering `code .` in the terminal -3) Make sure the [Azure Functions extension](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-azurefunctions) is installed -4) Add required files to the `.vscode` folder by opening the command palette using `Crtl+Shift+P` (or `Cmd+Shift+P` on Mac) and selecting *"Azure Functions: Initialize project for use with VS Code"* -5) Press Run/Debug (F5) to run in the debugger (select "Debug anyway" if prompted about local emulater not running) -6) Use same approach above to test using an HTTP REST client +1. Open the root folder in a new terminal. +1. Run the `code .` code command to open the project in Visual Studio Code. +1. Press **Run/Debug (F5)** to run in the debugger. Select **Debug anyway** if prompted about local emulator not running. +1. Send GET and POST requests to the `httpget` and `httppost` endpoints respectively using your HTTP test tool (or browser for `httpget`). If you have the [RestClient](https://marketplace.visualstudio.com/items?itemName=humao.rest-client) extension installed, you can execute requests directly from the [`test.http`](./src/functions/test.http) project file. ## Source Code -The key code that makes tthese functions work is in `./src/functions/httpGetFunction.cs` and `.src/functions/httpPostBodyFunction.cs`. The function is identified as an Azure Function by use of the `@azure/functions` library. This code shows a HTTP GET triggered function. +The source code for the GET and POST functions are in the [`httpGetFunction.js`](./src/functions/httpGetFunction.js) and [`httpPostBodyFunction.js`](./src/functions/httpPostBodyFunction.js) code files, respectively. Azure Functions requires the use of the `@azure/functions` library. + +This code shows an HTTP GET triggered function: ```javascript const { app } = require('@azure/functions'); -app.http('httpGetFunction', { +app.http('httpget', { methods: ['GET'], authLevel: 'function', handler: async (request, context) => { @@ -88,12 +107,13 @@ app.http('httpGetFunction', { } }); ``` -This code shows a HTTP POST triggered function which expects `person` object with `name` and `age` values in the request. + +This code shows an HTTP POST triggered function that expects `person` object with `name` and `age` values in the request body. ```javascript const { app } = require('@azure/functions'); -app.http('httpPostBodyFunction', { +app.http('httppost', { methods: ['POST'], authLevel: 'function', handler: async (request, context) => { @@ -126,8 +146,31 @@ app.http('httpPostBodyFunction', { ## Deploy to Azure -To provision the dependent resources and deploy the Function app run the following command: -```bash +Run this command to provision the function app, with any required Azure resources, and deploy your code: + +```shell azd up ``` -You will be prompted for an environment name (this is a friendly name for storing AZD parameters), a Azure subscription, and an Aure location. + +You're prompted to supply these required deployment parameters: + +| Parameter | Description | +| ---- | ---- | +| _Environment name_ | An environment that's used to maintain a unique deployment context for your app. You won't be prompted if you created the local project using `azd init`.| +| _Azure subscription_ | Subscription in which your resources are created.| +| _Azure location_ | Azure region in which to create the resource group that contains the new Azure resources. Only regions that currently support the Flex Consumption plan are shown.| + +## Redeploy your code + +You can run the `azd up` command as many times as you need to both provision your Azure resources and deploy code updates to your function app. + +>[!NOTE] +>Deployed code files are always overwritten by the latest deployment package. + +## Clean up resources + +When you're done working with your function app and related resources, you can use this command to delete the function app and its related resources from Azure and avoid incurring any further costs: + +```shell +azd down +``` From 58c2843acbc4b92e0e4ad2f149bc5c4c155a4b63 Mon Sep 17 00:00:00 2001 From: Glenn Gailey Date: Fri, 30 Aug 2024 16:38:41 -0700 Subject: [PATCH 3/5] minor edit --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 7808695..66d6d00 100644 --- a/README.md +++ b/README.md @@ -16,7 +16,7 @@ urlFragment: functions-quickstart-javascript-azd # Azure Functions JavaScript HTTP Trigger using Azure Developer CLI -This repository contains an Azure Functions HTTP trigger quickstart written in JavaScript and deployed to Azure using Azure Developer CLI (`azd`). The sample uses managed identity and a virtual network to make sure deployment is secure by default. +This repository contains an Azure Functions HTTP trigger reference sample written in JavaScript and deployed to Azure using Azure Developer CLI (`azd`). The sample uses managed identity and a virtual network to make sure deployment is secure by default. ## Prerequisites From 5aae2b4db4c958e133318172b38531f009268436 Mon Sep 17 00:00:00 2001 From: Glenn Gailey Date: Fri, 6 Sep 2024 10:18:35 -0700 Subject: [PATCH 4/5] More readme cleanup --- README.md | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 66d6d00..393d56a 100644 --- a/README.md +++ b/README.md @@ -22,7 +22,7 @@ This repository contains an Azure Functions HTTP trigger reference sample writte + [Node.js 20](https://www.nodejs.org/) + [Azure Functions Core Tools](https://learn.microsoft.com/azure/azure-functions/functions-run-local?pivots=programming-language-javascript#install-the-azure-functions-core-tools) -+ [Azure Developer CLI (AZD)](https://learn.microsoft.com/azure/developer/azure-developer-cli/install-azd) ++ [Azure Developer CLI (`azd`)](https://learn.microsoft.com/azure/developer/azure-developer-cli/install-azd) + To use Visual Studio Code to run and debug locally: + [Visual Studio Code](https://code.visualstudio.com/) + [Azure Functions extension](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-azurefunctions) @@ -64,21 +64,23 @@ Add a file named `local.settings.json` in the root of your project with the foll ## Run your app from the terminal -1. Run these commands in the virtual environment: +1. Run these commands to start the Functions host locally: ```shell npm install func start ``` -2. From your HTTP test tool in a new terminal (or from your browser), call the HTTP GET endpoint: +1. From your HTTP test tool in a new terminal (or from your browser), call the HTTP GET endpoint: -3. Test the HTTP POST trigger with a payload using your favorite secure HTTP test tool. This example uses the `curl` tool with payload data from the [`testdata.json`](./src/functions/testdata.json) project file: +1. Test the HTTP POST trigger with a payload using your favorite secure HTTP test tool. This example uses the `curl` tool with payload data from the [`testdata.json`](./src/functions/testdata.json) project file: ```shell curl -i http://localhost:7071/api/httppost -H "Content-Type: text/json" -d "@src/functions/testdata.json" ``` +1. When you're done, press Ctrl+C in the terminal window to stop the `func.exe` host process. + ## Run your app using Visual Studio Code 1. Open the root folder in a new terminal. @@ -88,7 +90,7 @@ Add a file named `local.settings.json` in the root of your project with the foll ## Source Code -The source code for the GET and POST functions are in the [`httpGetFunction.js`](./src/functions/httpGetFunction.js) and [`httpPostBodyFunction.js`](./src/functions/httpPostBodyFunction.js) code files, respectively. Azure Functions requires the use of the `@azure/functions` library. +The source code for the GET and POST functions is in the [`httpGetFunction.js`](./src/functions/httpGetFunction.js) and [`httpPostBodyFunction.js`](./src/functions/httpPostBodyFunction.js) code files, respectively. Azure Functions requires the use of the `@azure/functions` library. This code shows an HTTP GET triggered function: From 96308ea1a84355dbd54b10b6bbc158346705d046 Mon Sep 17 00:00:00 2001 From: Glenn Gailey Date: Fri, 6 Sep 2024 11:15:31 -0700 Subject: [PATCH 5/5] links to article --- README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/README.md b/README.md index 393d56a..70848e0 100644 --- a/README.md +++ b/README.md @@ -18,6 +18,8 @@ urlFragment: functions-quickstart-javascript-azd This repository contains an Azure Functions HTTP trigger reference sample written in JavaScript and deployed to Azure using Azure Developer CLI (`azd`). The sample uses managed identity and a virtual network to make sure deployment is secure by default. +This source code supports the article [Quickstart: Create and deploy functions to Azure Functions using the Azure Developer CLI](https://learn.microsoft.com/azure/azure-functions/create-first-function-azure-developer-cli?pivots=programming-language-javascript). + ## Prerequisites + [Node.js 20](https://www.nodejs.org/) @@ -162,6 +164,8 @@ You're prompted to supply these required deployment parameters: | _Azure subscription_ | Subscription in which your resources are created.| | _Azure location_ | Azure region in which to create the resource group that contains the new Azure resources. Only regions that currently support the Flex Consumption plan are shown.| +After publish completes successfully, `azd` provides you with the URL endpoints of your new functions, but without the function key values required to access the endpoints. To learn how to obtain these same endpoints along with the required function keys, see [Invoke the function on Azure](https://learn.microsoft.com/azure/azure-functions/create-first-function-azure-developer-cli?pivots=programming-language-javascript#invoke-the-function-on-azure) in the companion article [Quickstart: Create and deploy functions to Azure Functions using the Azure Developer CLI](https://learn.microsoft.com/azure/azure-functions/create-first-function-azure-developer-cli?pivots=programming-language-javascript). + ## Redeploy your code You can run the `azd up` command as many times as you need to both provision your Azure resources and deploy code updates to your function app.