Share via

Static Web App unable to connect with Bring-Your-Own Function backend due to 401 Unauthorized response

sanguid 20 Reputation points
2024-07-12T12:01:31.2633333+00:00

I have attached a separate Function to the SWA resource as the backend and it has set up the authentication provider on the function. However, when attempting to connect with the backend, the SWA frontend receives a 401 Unauthorized response. The frontend includes the StaticWebAppsAuthCookie cookie in its request, which should authenticate and authorize it to the backend. Despite this, the function has never been run, seemingly because the requests are blocked at the function app level. What could be causing this issue?

Azure Static Web Apps
Azure Static Web Apps
An Azure service that provides streamlined full-stack web app development.
850 questions
Accepted answer
  1. Deepanshukatara-6769 7,980 Reputation points
    2024-07-17T06:40:32.1033333+00:00

    Hi Sanguid, Thanks for your response , please find the below solution which worked for you

    Issue: Static Web App unable to connect Function backend due to 401 Unauthorized response

    Solution: The function's authorization level defaulted to AuthLevel.FUNCTION because it was not explicitly set to AuthLevel.ANONYMOUS, which is needed for the simple auth flow. This oversight likely occurred due to a revert that undid too many changes, including the correct auth level setting.

    Hence it was an authorization issue

    Kindly accept

    Thanks

    Deepanshu

    0 comments

2 additional answers

Sort by: Most helpful
Most helpful Newest Oldest
  1. Deepanshukatara-6769 7,980 Reputation points
    2024-07-12T12:30:38.8466667+00:00

    Hello, Welcome to MS Q&A

    The issue you are facing with the Static Web Apps (SWA) frontend receiving a 401 Unauthorized response when trying to connect to the backend Function App. Let's troubleshoot this:

    • Ensure that the account making the requests has the necessary Static Web App role matching what's specified in the staticwebapp.database.config.json file. The user must have the correct role to perform operations on the endpoint.
    • Check if the request includes a header with a key of X-MS-API-ROLE and a value that matches a role name specified in your entity configuration rules. Role name matching is case-sensitive.
    • Verify that the StaticWebAppsAuthCookie is being properly handled and authenticated in the backend Function App. This cookie should authorize the frontend to access the backend. If the above steps do not resolve the issue, you may need to further investigate the configuration and permissions set up between the SWA frontend and the backend Function App. It's important to ensure that the authentication provider on the Function App is correctly configured to accept requests from the SWA frontend.

    If you continue to face issues with the requests being blocked at the function app level, you can post an issue or question on the DAB GitHub forum for further assistance. I hope this helps address your concerns regarding the 401 Unauthorized response and the Function App not being run. If you need additional support, feel free to reach out for further guidance.

    For more detailed instructions, you can view solution:

    Please let me know if any questions

    Kindly accept answer if it helps

    Thanks

    Deepanshu

  2. sanguid 20 Reputation points
    2024-07-15T09:44:26.07+00:00

    I found the reason it wasn't working. The auth level of the function was not set explicitly and it defaulted to AuthLevel.FUNCTION, even though AuthLevel.ANONYMOUS is required in the simple auth flow. Such a simple mistake. I should've checked everything, but it's easy to assume that it was set correctly. It's likely a revert undid a bit too many changes, including setting the authlevel.

    Could you edit this solution into your answer? I'll then accept it.