Added data API quickstart

[TomAugspurger]

https://github.com/microsoft/PlanetaryComputerExamples/pull/207 switched that notebook to using folium, which renders widgets inside of an iframe, which (should) make its way through the doc build intact.

[github-actions[bot]]

Azure Static Web Apps: Your stage site is ready! Visit it here: https://wonderful-stone-06c70c70f-346.eastus2.azurestaticapps.net

[github-actions[bot]]

Azure Static Web Apps: Your stage site is ready! Visit it here: https://icy-meadow-0fc35e30f-346.eastus2.azurestaticapps.net

[github-actions[bot]]

Azure Static Web Apps: Your stage site is ready! Visit it here: https://icy-meadow-0fc35e30f-346.eastus2.azurestaticapps.net

[github-actions[bot]]

Azure Static Web Apps: Your stage site is ready! Visit it here: https://wonderful-stone-06c70c70f-346.eastus2.azurestaticapps.net

[TomAugspurger]

https://github.com/python-visualization/folium/issues/1277 discusses the trust issue a bit.

[TomAugspurger]

The generated HTML was actually correct. It seems that the DOMPurify.sanitize was sanitizing the iframe srcdoc and preventing it from loading. I've (temporarily?) commented disabled the sanitization to see if this works.

[github-actions[bot]]

Azure Static Web Apps: Your stage site is ready! Visit it here: https://icy-meadow-0fc35e30f-346.eastus2.azurestaticapps.net

[github-actions[bot]]

Azure Static Web Apps: Your stage site is ready! Visit it here: https://wonderful-stone-06c70c70f-346.eastus2.azurestaticapps.net

[TomAugspurger]

OK, this is working at https://icy-meadow-0fc35e30f-346.eastus2.azurestaticapps.net/docs/quickstarts/using-the-data-api/.

Will wait for @mmcfarland for thoughts on whether the change to not sanitizing all the docs is OK, or whether we should be a bit more targeted.

[mmcfarland]

That's great you got this working. I think if we add a few (slightly cumbersome) safety mechanisms, this should be a good option:

1. Add sandbox="allow-scripts" to the iframe element in the notebook. This turns off a bunch of capabilities of the iframe that isolates it from the host, while still allowing it to run javascript.
2. Add an allow-list of notebook names that are allowed to be unsanitized, to keep the surface area small
3. Remove any of the embedded CDN resources that aren't required, and add an SRI hash to the script tag for the remaining

We also should figure out a way to avoid using an OSM basemap for compliance reasons. Azure Maps can integrate with leaflet layers, but supplying the API key to the iframe would be a challenge. I'll think on this a bit and can volunteer to do # 2

[TomAugspurger]

Azure Maps can integrate with leaflet layers, but supplying the API key to the iframe would be a challenge.

Probably obvious, but I confirmed that an Azure Maps subscription key is embedded in the notebook document, even if it's passed through as an environment variable or using getpass. The subscription key is embedded in the ipyleaflet / folium object.

[mmcfarland]

It occurred to me after leaving that comment that we probably don't have much control over the iframe construction or contents (I was skimming the notebook as a text file to see the html/js, forgetting that it's probably injected by folium). If those suggestions aren't really feasible, I think just the allow list would be sufficient.

[TomAugspurger]

Yeah, the iframe is indeed created by folium. We can, with some effort, modify the notebook JSON and / or the generated HTML as part of the doc build process.

[github-actions[bot]]

Azure Static Web Apps: Your stage site is ready! Visit it here: https://wonderful-stone-06c70c70f-346.eastus2.azurestaticapps.net

[github-actions[bot]]

Azure Static Web Apps: Your stage site is ready! Visit it here: https://icy-meadow-0fc35e30f-346.eastus2.azurestaticapps.net