Skip to content

Commit

Permalink
cors.md: Add current CORS configuration and other improvements.
Browse files Browse the repository at this point in the history
  • Loading branch information
Konrad Jamrozik committed Dec 26, 2023
1 parent 92feb79 commit 5050ee6
Show file tree
Hide file tree
Showing 2 changed files with 30 additions and 12 deletions.
36 changes: 27 additions & 9 deletions docs/cors.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,14 @@
# Table of contents

- [Table of contents](#table-of-contents)
- [CORS](#cors)
- [Configure CORS](#configure-cors)
- [Configure CORS via backend code](#configure-cors-via-backend-code)
- [Configure CORS via Azure portal](#configure-cors-via-azure-portal)
- [Configure CORS](#configure-cors)
- [Configure CORS via backend code](#configure-cors-via-backend-code)
- [Configure CORS via Azure portal](#configure-cors-via-azure-portal)
- [Current CORS configuration](#current-cors-configuration)
- [Appendix](#appendix)
- [CORS reference](#cors-reference)

# CORS

## Configure CORS
# Configure CORS

The API backend at [`./src/api`] must have appropriately configured [CORS], so that web app frontend can call it,
be it from Azure, or localhost deployment.
Expand All @@ -19,15 +17,15 @@ be it from Azure, or localhost deployment.
> If you deploy the API backend on localhost, expose it to public internet, and allow in CORS access from localhost
> URLs, you will expose your personal computer to malicious attacks from all across the web.
### Configure CORS via backend code
## Configure CORS via backend code

Per [Enable Cross-Origin Requests (CORS) in ASP.NET Core],
specifically [Test CORS][Enable Cross-Origin Requests (CORS) in ASP.NET Core / Test CORS],
and [Add CORS functionality to REST API], you can add CORS policy via code.

For a confirmed example of this code setup working, see [commit c1b096f: add API CORS policy in code].

### Configure CORS via Azure portal
## Configure CORS via Azure portal

You can configure CORS on Azure portal, e.g. at [`game-api1` CORS page]. See [SO: CORS in Azure app service].

Expand All @@ -46,6 +44,18 @@ The Azure portal configuration takes precedence over code. From [SO: CORS in Azu
> Configuring CORS via Azure portal is especially useful for quick one-off tests, e.g. by calling the API from localhost
> vite preview.
# Current CORS configuration

As of 12/15/2023:

The Azure API backend [`game-api1`] has in [its CORS page][`game-api1` CORS page] configured two values:

- `https://witty-grass-034c9c41e.4.azurestaticapps.net` to allow the web app frontend to call it
- `http://localhost:4173`, to allow the localhost vite preview to call it.

In addition, the [commit e7c81ea: configure localhost CORS] configures in code the API backend app to allow
`http://localhost:5173` to call the API when the API is also deployed on localhost.

# Appendix

## CORS reference
Expand All @@ -71,10 +81,18 @@ Example config for [`game-api1` CORS page]:

![game-api1 CORS page](game_api1_cors_page.png)

<!--
--------------------------------------------------------------------------------
references
--------------------------------------------------------------------------------
-->

[`./src/api`]: ../src/api
[`game-api1`]: https://portal.azure.com/#@spawarottijamro.onmicrosoft.com/resource/subscriptions/8695c84c-09a4-4b50-994f-a2fa7f36cc92/resourcegroups/game-rg/providers/Microsoft.Web/sites/game-api1/appServices
[`game-api1` CORS page]: https://portal.azure.com/#@spawarottijamro.onmicrosoft.com/resource/subscriptions/8695c84c-09a4-4b50-994f-a2fa7f36cc92/resourcegroups/game-rg/providers/Microsoft.Web/sites/game-api1/apiCors
[Add CORS functionality to REST API]: https://learn.microsoft.com/en-us/azure/app-service/app-service-web-tutorial-rest-api#add-cors-functionality
[commit c1b096f: add API CORS policy in code]: https://github.com/konrad-jamrozik/game/commit/c1b096f69a96718eff6041ccf616ca9923777eed
[commit e7c81ea: configure localhost CORS]: https://github.com/konrad-jamrozik/game/commit/e7c81ea32bfed773509eea33bcff6b0c710a2b54
[CORS]: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
[Enable Cross-Origin Requests (CORS) in ASP.NET Core]: https://learn.microsoft.com/en-us/aspnet/core/security/cors?view=aspnetcore-8.0
[Enable Cross-Origin Requests (CORS) in ASP.NET Core / Test CORS]: https://learn.microsoft.com/en-us/aspnet/core/security/cors?view=aspnetcore-8.0#test-cors
Expand Down
6 changes: 3 additions & 3 deletions docs/deployment.md
Original file line number Diff line number Diff line change
Expand Up @@ -66,9 +66,9 @@ dotnet run --project api --launch-profile https
The SolidJS web frontend sources are at [`./web`].

> [!IMPORTANT]
> As the web frontend uses the API backend, you must ensure appropriate API backend is deployed first
> and its [CORS] is configured properly.
> See [`cors.md`](./cors.md).
> As the web frontend uses the API backend, it relies on appropriate API backend being deployed first
> and its [CORS] being configured properly.
> See also: [Current CORS configuration in `cors.md`](./cors.md#current-cors-configuration).
The deployment options described in this document have been setup as explained in [`web_frontend_setup.md`].

Expand Down

0 comments on commit 5050ee6

Please sign in to comment.