Conditionally make requests to Google services based on client country detected by IP geolocation

[jwalgran]

Overview

Modifies the code that makes requests to Google services to pass the detected country code as an argument when appropriate and to switch to China-based hosts when required.

Connects #537
Connects #539

Demo

US

IP Geolocation

Translation

Static Map

Dynamic Map

CN

IP Geolocation

Translation

Static Map

Dynamic Map

Testing Instructions

The screencast in the Demo section shows the app working both on a US network and connected to a China-hosted VPN endpoint.

The IP location screenshots were taken while this branch was deployed to staging, showing the ipgeolocation.io service working correctly.

• Load a facility detail page (http://localhost:6543/facilities/CN2019149Q3T5KQ) and verify that translation, static maps, and dynamic maps work normally on a US network.
• Mock requests from China by editing clientInfo.js.

diff --git a/src/app/src/actions/clientInfo.js b/src/app/src/actions/clientInfo.js
index 10082a6..059a763 100644
--- a/src/app/src/actions/clientInfo.js
+++ b/src/app/src/actions/clientInfo.js
@@ -1,9 +1,9 @@
 import { createAction } from 'redux-act';
 
-import axios from 'axios';
+// import axios from 'axios';
 
 import {
-    makeGetClientInfoURL,
+    // makeGetClientInfoURL,
     logErrorAndDispatchFailure,
 } from '../util/util';
 
@@ -11,19 +11,20 @@ export const startFetchClientInfo = createAction('START_FETCH_CLIENT_INFO');
 export const failFetchClientInfo = createAction('FAIL_FETCH_CLIENT_INFO');
 export const completeFetchClientInfo = createAction('COMPLETE_FETCH_CLIENT_INFO');
 
-const request = axios.create({
-    // Allow for a slow connection but ensure that Google components attempt to
-    // load with default client details if the client info API request hangs
-    // indefinitely.
-    timeout: 10000,
-});
+// const request = axios.create({
+//     // Allow for a slow connection but ensure that Google components attempt to
+//     // load with default client details if the client info API request hangs
+//     // indefinitely.
+//     timeout: 10000,
+// });
 
 export function fetchClientInfo() {
     return (dispatch) => {
         dispatch(startFetchClientInfo());
 
-        return request
-            .get(makeGetClientInfoURL())
+        // return request
+        //     .get(makeGetClientInfoURL())
+        return Promise.resolve({ data: { country_code2: 'CN' } })
             .then(({ data }) => dispatch(completeFetchClientInfo(data)))
             .catch(err => dispatch(logErrorAndDispatchFailure(
                 err,

• Refresh the facility detail page and verify that that all resources load correctly and that requests to Google resources are made to .cn domains.
• Optionally test that IP geolocation works in development by looking up the ipgeolocation.io API key in shared credential storage, adding

REACT_APP_IPGEOLOCATION_API_KEY=abcd-KEY-HERE

to .env.backend and rerunning ./scripts/server

Checklist

• fixup! commits have been squashed
• CI passes after rebase
• CHANGELOG.md updated with summary of features or fixes, following Keep a Changelog guidelines

[rajadain]

Hmm. Even after making the recommended changes, I'm still seeing the main Google APIs being used:

[jwalgran]

That's because of the timeout that appears in the console. If it takes longer that 10s to do the IP geolocation, it just assumes a default location.

[jwalgran]

I am seeing gateway timeouts from the free service.

We may need to go with a paid service.

[rajadain]

Taking another look at this.

[rajadain]

Hmm actually, can't review this because of merge conflicts. Will wait until they are resolved before checking this out.

[jwalgran]

I fixed the merge conflict but you will need an API key to merge this properly. I'll update the testing instruction and let everyone know when this is ready.

[jwalgran]

@open-apparel-registry/operations I originally began the implementation of detecting the brower's country using the free http://userinfo.io/ service. There was some significant downtime of that service last Thursday that prompted me to find a paid alternative.

I evaluated https://ipinfo.io/, https://ipdata.co/, and https://ipgeolocation.io

This PR has now has a successful integration of the https://ipgeolocation.io service.

I chose https://ipgeolocation.io for the following reasons:

• Low cost: Their $15 monthly plan covers 150,000 requests. 2 orders of magnitude more than our current page view count. Additional blocks of 50,000 requests are $5.
• A dashboard with impressive uptime statistics.
• Support for using request origin rather than an API key, allowing us to make requests from the client without worrying about exposing a key or taking on the burden of writing our own server-side proxy. We are allowed one origin on the lowest subscription tier, but that includes subdomains so it will cover both staging and production. This PR has support for conditionally using an API key in development, but we don't really need IP geolocation so it will be optional in development.

I tested this PR with a free personal account but would like to sign up for a paid account under a company address and credit card to complete the implementation.

Next Steps:

1. Are there any objections to going ahead with using https://ipgeolocation.io?
2. If not I would need some help setting up the paid account. Once credentials for the account are available I can set up the request origin and finish testing the implementation on staging.

[rbreslow]

Are there any objections to going ahead with using https://ipgeolocation.io?

I think this looks good. The support for using request origin sounds elegant. 👍

It's worth surfacing that MaxMind seems to be an informal standard for GeoIP. For example, BIND defaults to MaxMind: https://kb.isc.org/docs/aa-01149. I also believe their GeoIP file format is baked into a couple programming languages, including PHP.

I did a brief search, and it looks like MaxMind also charges $15 per 150,000 requests ($0.0001 * 150,000), although on an credit rather than monthly basis.

See: https://www.maxmind.com/en/geoip2-precision-country-service

If not I would need some help setting up the paid account. Once credentials for the account are available I can set up the request origin and finish testing the implementation on staging.

I can wire this up and ping you on Slack.

[jwalgran]

This is now ready for another look. I updated the description with new demo screenshots and revised instructions.

Thanks, Rocky, for jumping on this and setting up an ipgeolocation.io account.

[rajadain]

Tested with the mock clientInfo.js stuff, it's working correctly. Will test with the ipgeolocation credentials in the morning, but this is looking good!

[rajadain]

+1 tested, works nicely. Took a while to get the credentials in Last Pass, but this works well overall. Glad we're able to support these users.

[jwalgran]

Thanks for taking the time to exercise this.