google-address-autocomplete-attachment
Add the google address autocomplete dropdown to any text input, opensource.
Overview
Effectively, this module re-implements the dropdown created by a google api in an open source and highly modular method.
It uses the clientside-require
module to ipmort resources in a CommonJS fashion (scoped js resources). It uses the clientside-view-loader
to create the dropdown element. It uses js-resource-loader
to load the google api in a cross-domain yet scoped fashion.
Usage
npm install google-address-autocomplete-attachment --save
{ var Autocomplete = await ; // load is provided by clientside-require var autocomplete = document api_key;}
Note : this module is dependent on clientside require statements, and tested with the clientside-require
module
Restricted Domains for API Key
Google offers the ability to restrict the domains on which the api key can work. To resolve this, we can load the google api script in a frame that is sourced from a page on your server.
This module uses the js-resource-loader
module to load the google api in a private scope. The js-resource-loader
loads the google api in an iframe. By defining that that iframe should open a page on your domain before loading the script, the domain of the iframe will be your domain. This will satisfy google.
To do so, replace api_key
with an object:
key : api_key src : "https://your_domain.com/blank/page.html"
Where src
is the url of the page on your domain you wish to load the script into.
Full Example:
{ var Autocomplete = await ; // load is provided by clientside-require var autocomplete = document key : api_key src : "https://your_domain.com/blank/page.html" ; console;}