This example demonstrates how to visualize your Particle Photon, P1, and Electron locator results using Node.js in a Google App Engine Flexible Environment and the Google Maps Javascript API. This sample also uses the Express web framework, Websockets, and the Particle Javascript API.
You will need to supply a Google Maps Javascript API key in order for the example to work properly. Follow the instructions at Maps Javascript API: Get API Key. Be sure to review and understand the terms of service.
Set the key in config.json
using the map_api_key
variable. The code will inject the API key into the web page so the Maps JS library loads properly. This key is not secured so be sure to add referrer restrictions to your key. Consult Best practices for securely using API keys for more information.
Heads up! This app will ask for permision to your location. It is attempting to center the map on your location.
-
Install the Google Cloud SDK.
-
Setup the gcloud tool. This provides authentication to Google Cloud APIs and services. Learn more from our Quickstart guides.
gcloud init
-
Acquire local credentials for autheticating with Google Cloud Platform APIs:
gcloud beta auth application-default login
-
Clone this repo:
git clone https://github.com/kwnevarez/particle-device-locator
-
Install depedencies using
npm
:npm install
-
Run the sample with
npm
:npm start
-
Visit the application at http://localhost:8080.
Note: Secure WebSockets are currently not supported by App Engine Flexible Environment. WebSockets will only work if you load your page over HTTP (not HTTPS).
To use Secure WebSockets now, you can launch a VM on Google Compute Engine using a custom image where you have added SSL support for WebSockets.
Before you can run or deploy the sample, you will need to create a new firewall rule to allow traffic on port 50051. This port will be used for websocket connections. You can do this with the Google Cloud SDK with the following command:
gcloud compute firewall-rules create default-allow-websockets \
--allow tcp:50051 \
--target-tags websocket \
--description "Allow websocket traffic on port 50051"
-
Use the Google Developers Console to create a project/app id. (App id and project id are identical.)
-
Setup the gcloud tool, if you haven't already.
gcloud init
-
Use gcloud to deploy your app.
gcloud app deploy
-
Awesome! Your application is now live at
http://YOUR_PROJECT_ID.appspot.com
. <-- Do not use HTTPS, as noted above, websockets will not work.
This is a demo, not an official Google product.