0

I've an Azure Function inside Azure Static Web App to fetch the Static Web App's Application Settings. While calling the Http Triggered Function URL through Code, from browser I'm getting -

"Access to fetch at 'https://agreeable-rock-0ba5f3a10.1.azurestaticapps.net/' from origin 'http://localhost:44388' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled".

My Http Triggered Function Here enter image description here

My Http Client Call to Function resides inside Azure Static Web App

enter image description here

2 Projects I have. 1) Client is a MAUI App. 2) Azure Function. I've deployed Function as /Api in AzureStaticWebApp & Trying to access Application Settings from Client. Directly calling the FunctionURL from Postman, I'm able to get the Application Settings but not from Localhost-Browser.

Thanks

Improve this question
1
  • Can you please add your code as text? Commented Jun 3, 2022 at 6:02

1 Answer 1

Reset to default
2

The Azure Function API linked to the Static Web App has CORS enabled to only allow requests originating from the Azure Static Web App domain for security purposes. As such, it would not be possible to access the Azure Functions from another domain (such as localhost:44388).

When developing locally, it is recommended that you instead call the /api (localhost:44388/api) route using the SWA CLI, as outlined in this doc: Set up local development for Azure Static Web Apps | Microsoft Docs

Just to clarify, could you let us know the purpose of the function app to retrieve the application settings? Is this for dev/test purposes or prod purposes? Please do share more details about your requirement.

Further, just to highlight, the App settings and connection strings are stored encrypted in Azure. They're decrypted only before being injected into your app's process memory when the app starts.

Checkout similar discussion thread: CORS on API portion of Azure Static Web Apps #108

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

I'm using swa command: but get this error: Access to XMLHttpRequest at 'localhost:4280/api/myFunction' from origin 'http://localhost:4280' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome-untrusted, https, edge. When I open localhost:4280, it actually loads JS application. When I open localhost:4280/api/myFunction, it actually gives me data. So I'm confused, why is it not working, since both API and Frontend on the same host.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.