Simple Embedded Looker Application

This repository contains all of the elements needed to run a simple web application containing an embedded Looker dashboard.

Pre-requisites

• Homebrew
  • Not strictly required, but an easy and convenient way to install many of the packages below
  • /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
    • Please watch the terminal output carefully and follow the additional instructions there to add homebrew to your path and install essential dependencies
• Node
  • Linux
    • sudo apt install nodejs && sudo apt install npm
  • OSX
• Yarn
  • sudo npm install --global yarn
• Python 3.x
  • I recommend doing this through homebrew
  • brew install python@3.10 (or whatever 3.x version you prefer)
• pipenv
  • brew install pipenv or pip3 install --user pipenv
• Looker instance with Admin API3 credentials
  • Ensure you add http://localhost:3000 to the Embedded Domain Allowlist and turn on 'Embed Authentication'

Installation

• Copy .env.example to .env and update the Looker hostname value appropriately
• Do the same for api/looker.ini.example -> copy it to api/looker.ini and add Looker admin credentials here
• Edit the api/user.json file to populate some user data that will be used for the embedding
  • Instructions can be found here
• Install the react dependencies
  • yarn install
• Install the python dependencies in the api folder using a pipenv virtual environment
  • cd api
  • pipenv shell to initialise a python virtual environment
  • pipenv install to install the dependencies
  • CTRL + D to exit the virtual environment
• Update the value of DASHBOARD_ID in src/App.js on line 6

Usage

• Make sure you are in the root directory, not the api/ directory
• Run yarn develop
• Navigate to https://localhost:3000/ in your browser
  • Note - it's recommended to open the app in incognito mode or in a separate browser session to your normal Looker user account, as the SSO Authentication mechanism will interfere with any other Looker logins in the same session.

Troubleshooting

• If you see an authentication error such as a 401 or 403 the most likely cause is because the api/user.json object contains invalid values - i.e. it cannot access the dashboard you are trying to embed
  • The best way to test this is to log in to Looker and sudo as your Embedded User and see if you have access when using the Looker UI. If not check access settings such as folder permissions, model sets and permission sets
• If this is not the issue, make sure your browser does not have restrictive Cookie settings. Looker requires third-party cookies to be enabled for the embedded application to work. These are blocked in Safari and in Chrome's incognito mode by default.
  • More information on changing this here
• More troubleshooting tools can be found here

Further reference

• React.js
• Flask
• Looker Embed SDK
• Looker components