Skip to content

Instantly share code, notes, and snippets.

@dangerouse
Last active July 24, 2022 18:38
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dangerouse/ff9b5a5d0c070734542d to your computer and use it in GitHub Desktop.
Save dangerouse/ff9b5a5d0c070734542d to your computer and use it in GitHub Desktop.
CloudSponge HTML-only Proxy Page
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>OAuth Proxy Page</title>
<!-- Including the CloudSponge proxy script here to redirect to the CloudSponge server -->
<script>
// This auth-proxy.js can be placed on any HTML page to turn it into a
// CloudSponge Proxy URL.
// It pulls the proper OAuth parameters out and sends them to CloudSponge
// to complete the next stage in the contact import.
window.cloudspongeProxy = (function() {
var proxyHost = 'https://api.cloudsponge.com/auth';
var isOAuthPage, queryParams, oauthParams, key;
var redirecting = false;
function appendSearch() {
var search = window.location.search;
if (search && search[0] == '?') {
search = search + "&"
} else {
search = search + '?'
}
search = search + "state=_csAuth%3D1%26import_id%3Dproxy-test";
return search;
}
// serializes an object into a query-string
var serializeParams = function(params) {
var k, results = [];
for (k in params) {
results.push(k + "=" + encodeURIComponent(params[k]));
}
return results.join('&');
}
// converts the URL string into an object
var parseParams = function(url) {
var obj = {};
url.replace(/([^?=&]+)(=([^&]*))?/g, function($0, $1, $2, $3) {
return obj[$1] = decodeURIComponent($3);
});
return obj;
}
// parse the query string
var queryParams = parseParams(window.location.search);
// selects just the OAuth-related params out of the query
oauthParams = {};
for (key in queryParams) {
if (key === 'code' || key === 'state' || key === 'error' || key === 'error_code' || key === 'forward') {
oauthParams[key] = queryParams[key];
}
}
// checks to see if this page actually the necessary received OAuth params
// and then flings the state and code up to CloudSponge to do the heavy lifting work
if (oauthParams.state && (oauthParams.code || oauthParams.error || oauthParams.error_code)) {
redirecting = true;
window.location = proxyHost + '?' + serializeParams(oauthParams);
}
// add the redirect endpoint to any .cs-proxy links on the page
window.addEventListener('load', function(){
var i;
var links = document.getElementsByClassName('cs-force');
for (i = 0; i < links.length; i++) {
links[i].href = proxyHost + appendSearch();
}
}, false)
return {
redirecting: redirecting,
force: function(){
window.location = proxyHost + appendSearch();
return false;
}
};
})();
</script>
</head>
<body>
<p>Thank you for completing the OAuth flow.</p>
<p>Click <a class="cs-force">here to verify that your Proxy URL is set up correctly</a>.</p>
</body>
</html>
@hiloboi
Copy link

hiloboi commented Aug 2, 2020

KWSdYI_yqH6YFJoLvFmyVw

@dangerouse
Copy link
Author

To zoom out a bit for you, the gist does the following activities as it loads:

  • reads and decodes the query string from the current page’s URL (window.location.search)selects only the OAuth-related params from the query (code, state, error, error_code, forward)
  • if the minimum OAuth params were specified, it automatically redirects the page to https://api.cloudsponge.com/auth and includes the OAuth params. At this point, the window starts to load a new page and the script execution ends.
  • otherwise, it waits for the page to complete loading to add a click handler to test the OAuth flow
  • finally, it returns a global object (currently unused) which enables other scripts on the page force the redirection functionality.

The gist is set up so that it can be added to any page on your site and it will only redirect if the page loads at the end of the OAuth flow.

@dangerouse
Copy link
Author

To install on Wordpress, upload a copy of this file to the root folder of your Wordpress instance. Then test it out by visiting https://example.com/solo-auth-proxy.html.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment