Pseudo Browser with Google Spreadsheet

GasTips
Google Apps Script / spreadsheet

Gist

Overview

This is a sample script for creating the pseudo browser using Google Spreadsheet.

Description

I unexpectedly noticed this. I think that this is for off-line browsing using HTML data. So there are many limitations. At first, please confirm them.

  • Limitations
    • It cannot move from opened site to other outside site. If the outer site is opened as a new wind, your own browser is opened and move there.
    • For URL, it can move directories which is one low. But it cannot move directories more than two deeper.
      • Because it retrieves the HTML data from the inputted URL using UrlFetchApp. It cannot move to the out side of data retrieved by UrlFetchApp.
    • The access to the site opened by inputting URL is run at Google side.
    • Javascript on the opened site is run at your local PC side.
    • User-Agent cannot be changed from Mozilla/5.0 (compatible; Google-Apps-Script).

What I thought the interesting is that the appearance of the site has been maintained at this pseudo browser. And, by using this, the sites which are slow speed at your environment might be able to be opened smoothly.

Demo

Script

Please copy and paste following respective HTML and GAS to your script editor. Please launch the script editor on container-bound script for spreadsheet.

1. HTML

Filename is index.html.

<!DOCTYPE html>
<html>
  <head>
    <style>
      input.in1 {
        width: 90%;
      }
    </style>
  </head>
  <body>
    <form>
      <input type="text" name="url" class="in1">
      <input type="button" value="Run" class="in2"
        onclick="
        google.script.run
        .withSuccessHandler(google.script.host.close)
        .launchbrowser(this.parentNode)
      ">
    </form>
  </body>
</html>

2. GAS

Filename is code.gs.

function inputurl() {
  var html = HtmlService.createHtmlOutputFromFile('index')
    .setSandboxMode(HtmlService.SandboxMode.IFRAME)
    .setWidth(600)
    .setHeight(80);
  SpreadsheetApp.getUi().showModalDialog(html, 'URL?');
}

function launchbrowser(p) {
  var html = UrlFetchApp.fetch(p.url);
  var blob = HtmlService.createHtmlOutput(html)
    .setWidth(800)
    .setHeight(500)
    .setTitle("Sample Browser");
  SpreadsheetApp.getActiveSpreadsheet().show(blob);
}

 Share!