In the Basic, use the VN1 and gatewaySN to configure the virtual network.
In the Frontends, create a new public address.
In the Backends, create a new backend pool signalr for the SignalR Service resource. You need to use the host name of the SignalR Service resource as the Target.
In the Configuration, add a new routing rule signalrrule to route the traffic to SignalR Service. You need to create a new HTTP setting.
Protocol: HTTP (We use the HTTP frontend protocol on Application Gateway in this blog to simplify the demo and help you get started easier. But in reality, you may need to enable HTTPs and Customer Domain on it with production scenario.)
Target type: Backend pool
Add new HTTP setting
Backend protocol: HTTPs
Use well known CA certificate: Yes
Override with new host name: Yes
Host name override: Pick host name from backend target.
Review and create the AG1
Now, we already setup the Virtual Network, SignalR Service and Application Gateway. Let’s quick test whether the configuration is correct.
Go to the network access control blade of ASRS1 and set public network to allow server connection only.
Go to AG1, open health probe, change the health probe path to /api/v1/health
Go to the Overview blade of AG1, and find out the Frontend public IP address
Open http://<frontend-public-IP-address>, and it should return 403.
Open http://<frontend-public-IP-address>/api/v1/health, and it should return 200.
Go back to the network access control blade of ASRS1 and disable the server connection in public network.
Run a Chat Application Locally
Now, the traffic to Azure SignalR is already managed by the Application gateway. The customer could only use the public IP address or custom domain name to access the resource. In this blog, let’s use the chat applicationas an example, and start from running it locally.
Go to the TLS/SSL settings blade of WA1, and turn off the HTTPS Only. To Simplify the demo, we used the HTTP frontend protocol on Application Gateway. Therefore, we need to turn off this option to avoid changing the HTTP URL to HTTPs automatically.
Go to the Overview blade and get the URL of WA1.
Open the URL by replacing the https with http, and open network traces to see WebSocket connection is established through AG1
Now, you are successful to build a real-time chatroom application with Azure SignalR Service and use Application Gateway to protect your applications and setup end to end secure. If you are trying to build your own application with Azure SignalR and Application Gateway, you could also get more helpful resources from the Azure SignalR Service and Azure Application Gateway. We are looking forward your feedback and ideas to help us become better viaAzure Feedback Forum!