Find the Visitor's Browser and OS with Google Apps Script

April 22, 2017

The HTML Service of Google Apps Script lets you create HTML and JavaScript based applications that can be served as standalone web apps or they can be used for building user interfaces (like a form) contained inside Google Sheets and Google Docs.

HTML service executes JavaScripts on the client side and communicates with server side Google Apps Script functions using google.script.run, an asynchronous client-side JavaScript API.

The File Upload Forms for Google Drive are built entirely with HTML service. The user visits an online web form, uploads a file to Google Drive and the form response is saved to Google Sheet. In addition to capturing user-entered data, we can also use Html Service to capture information about the visitor’s browser, their OS (Mac, Windows, etc) and their device (whether they are accessing the page from a tablet, mobile or a TV).

Here’s a sample snippet that shows how to parse the User Agent string using the ua-parser-js library. This method, however, cannot be used to find the I.P. Address of the visitor.

The server side Google Script.

function doGet() {
  return HtmlService.createTemplateFromFile('index').evaluate().setTitle('User Agent - Google Apps Script');
}

And the index.html file served via HTML service.

<!DOCTYPE html>
<html>
  <head>
    <base target="_top" />
  </head>
  <body>
    <div id="browser"></div>
    <div id="os"></div>
    <script src="https://cdn.jsdelivr.net/npm/ua-parser-js@0/dist/ua-parser.min.js"></script>
    <script>
      var parser = new UAParser();
      parser.setUA('<?= HtmlService.getUserAgent(); ?>');
      var result = parser.getResult();
      document.getElementById('browser').textContent = result.browser.name + ' v' + result.browser.major;
      document.getElementById('os').textContent = result.os.name + ' v' + result.os.version;
    </script>
  </body>
</html>

Google Apps Script

ShareWhatsAppTwitterFacebook

Amit Agarwal

Google Developer Expert, Google Cloud Champion

Amit Agarwal is a Google Developer Expert in Google Workspace and Google Apps Script. He holds an engineering degree in Computer Science (I.I.T.) and is the first professional blogger in India.

Amit has developed several popular Google add-ons including Mail Merge for Gmail and Document Studio. Read more on Lifehacker and YourStory