Chrome Local Network Access blocking Forge app frontend fetch requests with CSP error

Issue Summary

This is reproducible on Data Center: (no)

Chrome rolled out a new feature https://developer.chrome.com/blog/local-network-access which is breaking Forge apps making frontend fetch requests with CSP error.

Steps to Reproduce

1. Create a Forge app that makes fetch calls to a local domain (i.e. example.com) in the local network
2. In the manifest allow the domain 

   permissions.external.fetch.client: example.com

1. Install the app
2. Load the app in Chrome with local-network-access feature enabled

Expected Results

Chrome should show a pop-up to allow the request. User allows the request, and the fetch request is successful.

Actual Results

Chrome isn't showing any pop-ups so the user can't allow the request. As a result, the request fails and a CORS error is displayed in the console.

Access to fetch at <local area address> from origin <atlassian addres> has been blocked by CORS policy: Permission was denied for this request to access the `unknown` address space.

Additional Information

Chrome rolled out a new feature (https://developer.chrome.com/blog/local-network-access) which is breaking Forge apps making frontend fetch requests.

A local domain in this context refers to a domain name that resolves to a local/private IP range (https://en.wikipedia.org/wiki/Private_network), such as addresses in the ranges 10.0.0.0/8, 172.16.0.0/12, or 192.168.0.0/16.

It looks like the issue can be resolved by adding allow="local-network-access" in the Forge iFrame.

Workaround

1. Use a different browser, like Firefox
2. Disable the policy 
   • chrome://flags/#local-network-access-check (if using Google Chrome)
   • edge://flags/#local-network-access-check (if using Microsoft Edge) and disabling the "Local Network Access check" flag