CODEWITHSUNDEEP
azureazure-functionsazure-static-web-app
Nick Kalfas
Nick Kalfas

Reputation: 65

Securing a connection between an Azure static web app and a Azure Function

I have set up an Azure Static web app and an Azure function backend. I was under the impression from the docs (https://learn.microsoft.com/en-us/azure/static-web-apps/functions-bring-your-own) that if I linked the two and the azure function app didn't have any pre-existing security settings then the Static app would have exclusive access to the function app. This isn't the case and all linking the apps does is provide a URL overwrite so I can access the function with the front-end's URL.

What is the recommended method of only allowing requests to an Azure Function App from an Azure Static Web App? I need to use the bring your own function option as I need the function app to have a set of whitelisted IP addresses that can be given to a 3rd party API.

Upvotes: 1

Views: 1074

Answers (2)

Matt Frear
Matt Frear

Reputation: 54861

I think you are incorrect, or, maybe things have changed since you asked this question 2.5 years ago. Linking the SWA to a function does restrict access to the SWA. If I try to anonymously access my function after linking, I get a 400 returned (not sure why it's not a 401).

But that leads to a security hole, which is that anyone can access the API via your Static Web App.

i.e.

The fix is to add the built-in "authenticated" role to your api routes in the staticwebapp.config.json.

{
  "routes": [
    {
      "route": "api/*",
      "allowedRoles": [ "authenticated" ]
    }
  ],
  "responseOverrides": {
    "401": {
      "statusCode": 302,
      "redirect": "/.auth/login/aad"
    }
  }
}

Source: my blog

Upvotes: 0

maxspan
maxspan

Reputation: 14177

You can try proxy.json for dns url of your choice in azure function. You can use api management for securing your functions and white listing IPs.

{
    "$schema": "http://json.schemastore.org/proxies",
    "proxies": {
        "proxy1": {
            "matchCondition": {
                "methods": [ "GET" ],
                "route": "/api/{test}"
            },
            "backendUri": "https://<AnotherApp>.azurewebsites.net/api/<FunctionName>"
        }
    }
}

https://learn.microsoft.com/en-us/azure/azure-functions/functions-proxies

Upvotes: 0

Related Questions