Is there a simpler way to embed a Google Earth Engine (javascript) application into a web page without following the tortured route presented by the Google EE demo apps?

The Earth Engine Code environment makes it quick and fast to develop the core GEE app. However, it's going to take me 10x the time to embed the GEE app into a web page than it took to do the GEE app.

All the demo apps seem to require (a) using Google App Engine, (b) recoding the GEE app in Python, (c) using jinja2 templating engine to link the python code to the web page, and (d) still some lingering javascript.

For example, in the Trendy Lights demo, the server-side scripter server.py App Engine kicks things off and it gets plicated quickly. (Even the simpler demos go this route.)

When the user first loads the application in their browser, their request is routed to the get() function in the MainHandler class by the framework we're using, webapp2.

The get() function sends back the main web page (from index.html) along with information the browser needs to render an Earth Engine map and the IDs of the polygons to show on the map. This information is injected into the index.html template through a templating engine called Jinja2, which puts information from the Python context into the HTML for the user's browser to receive.

Is there a simpler way to embed a Google Earth Engine (javascript) application into a web page without following the tortured route presented by the Google EE demo apps?

The Earth Engine Code environment makes it quick and fast to develop the core GEE app. However, it's going to take me 10x the time to embed the GEE app into a web page than it took to do the GEE app.

All the demo apps seem to require (a) using Google App Engine, (b) recoding the GEE app in Python, (c) using jinja2 templating engine to link the python code to the web page, and (d) still some lingering javascript.

For example, in the Trendy Lights demo, the server-side scripter server.py App Engine kicks things off and it gets plicated quickly. (Even the simpler demos go this route.)

When the user first loads the application in their browser, their request is routed to the get() function in the MainHandler class by the framework we're using, webapp2.

The get() function sends back the main web page (from index.html) along with information the browser needs to render an Earth Engine map and the IDs of the polygons to show on the map. This information is injected into the index.html template through a templating engine called Jinja2, which puts information from the Python context into the HTML for the user's browser to receive.

• javascript
• google-earth-engine

• 1 Just menting to see if you had found a solution to this? – NateH06 Commented Jul 5, 2017 at 8:10
• 2 Has anyone successfully launched their real-world Earth Engine app with Apps Engine yet? How much effort is it really? Maybe someone has an example link? – Joooeey Commented Apr 28, 2018 at 0:35
• As of when I posted it, there were a number of demos running on the App Engine you can look at, such as the Trendy Lights demo hyperlinked in the original posting. – Biofloat Commented Apr 29, 2018 at 16:11

1 Answer 1

The reason it's plicated is due to authorization. The Earth Engine calls have to be authorized against someone's Earth Engine account. That has to be either the end user (See: https://github./google/earthengine-api/tree/master/demos/client-auth, but that only works if the end user has an Earth Engine account), or the application's credentials. If the application's credentials were just stuck in the javascript, then anyone can steal those credentials and use them to do anything they wanted. So we remend using the appengine server-auth route (https://github./google/earthengine-api/tree/master/demos/server-auth-nodejs) to keep your credentials safe.