Include Javascript in UI Header in Realm Options

  • 0
  • 1
  • Question
  • Updated 2 years ago
  • Answered
How does someone go about adding JS into the head using the Realm Admin UI settings.  Keep in mind that QB automatically removes script and iframe tags.
Photo of B

B

  • 20 Points

Posted 3 years ago

  • 0
  • 1
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 30,044 Points 20k badge 2x thumb
My answer is probably going to stun a few people at QuickBase but let me explain by generalizing the question a bit.



What are the various way to inject user defined script into QuickBase pages (without user action such as click)?

There are essentially four different ways two of which have not been publicly disclosed (ie two techniques are being used in the wild or are "in development" so to speak);

1) The image onload technique (IOL) allows you to inject a user defined page containing script into {new, edit, view, report and grid edit pages). It is extensively used and documented here:

https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=294


The IOL technique does not work on other pages such as {chart, summary, map, calendar, timeline} or administrative pages because you cannot directly include the image onload field (typically named [-]) on these pages.

2) The branding onload technique (BOL) has been developed by another QuickBase developer and variants and improvements are being used in the wild. The BOL technique is set up and applies to all pages within an application. This technique has not been published publicly and probably will not ever be disclosed publicly (there is a better solution). Both the IOL and BOL techniques are safe and secure to use because they can only be implemented by an administrator.

3) If you have the platform version of QuickBase my understanding is that you can either put custom HTML within the branding header including injecting <script> or inject JavaScript through event attributes such as the onload attribute. I have actually never got my hands on the platform version of QuickBase so I am just summarizing what clients and other users have told me. Only an administrator can use this technique and you also have to subscribe to the platform version of QuickBase.

4) The fourth way is to use a new web technology called Service Workers which is supported by Chrome, FireFox, Opera and is being developed for Edge (my guess is that it will land in the Fall). 

Can I User Service Worker
http://caniuse.com/#feat=serviceworkers

Fetch (or the undeniable limitations of XHR) (Read the part: The road to Service Worker )
https://blogs.windows.com/msedgedev/2016/05/24/fetch-and-xhr-limitations/

Is Service Worker Ready
https://jakearchibald.github.io/isserviceworkerready/

I have developed this new technique since attending Empower 2016 and it works extremely well. Once a service worker is installed all pages in your entire account can be proxied through the service worker and only an administrator can set up the registration process. This technique relies on a new web standard called Service Worker and has the potential to revolutionize what you can do with QuickBase:

  • Custom Branding
  • Patch QuickBase
  • Set Form Defaults on Administrative Pages
  • Create Arbitrary Webhooks to Respond to Any Client Side Event
  • Custom Workflows
  • Custom Analytics, Audit Trails, Logging
  • Custom Permissions, Roles and Behavior
  • Control Any Feature, Add New Features
  • Custom Response to Any Mutation Observer
  • Cron Job
  • Add or Remove Features to Product
  • Custom API Calls
Did I miss anything? Basically this is God Mode for QuickBase. This technique is so powerful and ridiculously simple to implement. The challenge is to come up with the conventions and best practices to use it.

If you want more information about using Service Workers with QuickBase feel free to contact me offline. I have a couple of demos I am giving privately this Friday and more information will be forthcoming later in the month.
Photo of B

B

  • 20 Points
Outstanding and thorough reply as always Dan. Kudos.

 I came across another technique for Chrome that could possibly be used for this and it is html imports using link rel="import".  Haven't tried it yet but it looks promising.

I would love to see some service worker stuff. Sign me up for these private-eye viewings.
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 30,044 Points 20k badge 2x thumb
>Sign me up for these private-eye viewings.

Email me.

> html imports

That is part of Web Components. The problem here is that Mozilla isn't going to implement HTML Imports.

http://caniuse.com/#feat=imports

Service Workers is the answer and it is going to stun a lot of people what it can do. Most of the buzz over Service Workers is about offline caching and push notifications. But Service Workers implements a full Network Proxy so you can intercept and modify all network traffic before the resources are even dispatched to the browser tab that will render the page. Like I said Service Workers is going to be like God Mode for QuickBase.
Photo of eduardo

eduardo

  • 40 Points
Sign me up for these private-eye viewings also
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 30,044 Points 20k badge 2x thumb
I am writing up the abstracts for my six Empower presentations and one of them will be on Service Workers. Prepare to be disappointed as QuickBase never approve my presentations as they are too advanced. Just saying.
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 30,044 Points 20k badge 2x thumb