| title | description | author | ms.service | ms.devlang | ms.topic | ms.date | ms.author |
|---|---|---|---|---|---|---|---|
Use JavaScript to create a chat room with Azure Functions and SignalR Service |
A quickstart for using Azure SignalR Service and Azure Functions to create a chat room. |
sffamily |
signalr |
javascript |
quickstart |
12/14/2019 |
zhshang |
Azure SignalR Service lets you easily add real-time functionality to your application and Azure Functions is a serverless platform that lets you run your code without managing any infrastructure. In this quickstart, you use JavaScript to build a serverless, real-time chat application using SignalR Service and Functions.
-
A code editor, such as Visual Studio Code
-
An Azure account with an active subscription. Create an account for free.
-
Azure Functions Core Tools, version 2 or above. Used to run Azure Function apps locally.
-
Node.js, version 10.x
[!NOTE] The examples should work with other versions of Node.js, see Azure Functions runtime versions documentation for more information.
Note
This quickstart can be run on macOS, Windows, or Linux.
Sign in to the Azure portal at https://portal.azure.com/ with your Azure account.
[!INCLUDE Create instance]
[!INCLUDE Clone application]
-
In the browser where the Azure portal is opened, confirm the SignalR Service instance you deployed earlier was successfully created by searching for its name in the search box at the top of the portal. Select the instance to open it.
-
Select Keys to view the connection strings for the SignalR Service instance.
-
Select and copy the primary connection string.
-
In your code editor, open the src/chat/javascript folder in the cloned repository.
-
Rename local.settings.sample.json to local.settings.json.
-
In local.settings.json, paste the connection string into the value of the AzureSignalRConnectionString setting. Save the file.
-
JavaScript functions are organized into folders. In each folder are two files: function.json defines the bindings that are used in the function, and index.js is the body of the function. There are two HTTP triggered functions in this function app:
- negotiate - Uses the SignalRConnectionInfo input binding to generate and return valid connection information.
- messages - Receives a chat message in the request body and uses the SignalR output binding to broadcast the message to all connected client applications.
-
In the terminal, ensure that you are in the src/chat/javascript folder. Run the function app.
func start
[!INCLUDE Run web application]
[!INCLUDE Cleanup]
In this quickstart, you built and ran a real-time serverless application in VS Code. Next, learn more about how to deploy Azure Functions from VS Code.
[!div class="nextstepaction"] Deploy Azure Functions with VS Code