Welcome
Writing your first Web Data Connector
Brett Taylor
Staff Software Engineer
Tableau
# T C 1 8
Ashwin Sekar
Software Engineer
Tableau
Automation
Extensions
Embedded Analytics
Data Connectivity
Data Science
Tableau Platform
Inte
gra
tion
s
Enabling Integrations for Developers
Agenda
What is a Web Data Connector
How to use a Web Data Connector
Live demonstration of building a Web Data Connector
What isWeb Data Connector?
Your
HTML & JavaScript
Web Data Connector
Why use a WDC?
Data Accessibility Automation
UsingWeb Data Connectors
BuildingWeb Data Connectors
It all starts here…
WDC Phase Model
Phase 1: Interactive Phase
• The UI that a user sees
• The purpose is to collect input:• Filters
• Authentication
Phase 2: Gather Data Phase
• Runs after the interactive phase
• Used to retrieve schema & data
Functions WDCs Implement
init(initCallback)Initializes WDC and specifies
advanced options [optional]
getSchema(schemaCallback)Returns schema information
getData(table, doneCallback)Returns data for requested table
Creating a Web Data Connector
Pre-req #1: Know your Web API
API Overview
API Documentation
Response format (JSON? XML?)
API parameters
Sample requests (e.g. JSON lint)
Creating a Web Data Connector
Pre-req #2: Web Data Connector tools
Download the WDC SDKgit clone https://github.com/tableau/webdataconnector.git
Download and Install a good text editor Brackets, Atom, Sublime Text
Have a web server ready to host your WDCPython (SimpleHTTPServer), IIS, Node and npm, Tomcat, WAMP
Functions WDCs Implement
init(initCallback)Initializes WDC and specifies
advanced options [optional]
getSchema(schemaCallback)Returns schema information
getData(table, doneCallback)Returns data for requested table
Creating a Web Data Connector
Let’s party in Desktop!
Load connector in Tableau Desktop
Check for any error messages
Have fun and start visualizing in Tableau Desktop!
What Else Is Possible?
What Else Is Possible?
WDC Tips
Watch out for differences in browser behavior
• WDC uses a browser called Qt WebKit which behaves differently than Chrome and Firefox.
• This can lead to “it worked in the Simulator but not Tableau”.
WDC Tips
Watch out for differences in browser behavior
• WDC uses a browser called Qt WebKit which behaves differently than Chrome and Firefox.
• This can lead to “it worked in the Simulator but not Tableau”.
We are actively working to move
WDC to use Chromium!
WDC Tips
Don’t expect state to be preserved
• WDCs are launched multiple times and state is not preserved.
• Global variables won’t be preserved.
• Use tableau.connectionData property.
WDC Tips
Refresh WDCs on Tableau Server requires extra work
• Admins must whitelist WDCs in order to refresh on Tableau Server.
• We recommend the Sync Client with Tableau Online.
More suggestions are in our WDC FAQ.
Advanced Topics
Multiple tables
User inputs in HTML
Authentication
Publishing your WDC
Final Takeaways
Read the tutorials
Don’t start from scratch!
Find an existing WDC you can re-use.
Use the WDC Simulator
Debugging JavaScript is a lot easier from the simulator.
#DataDev Resources
TC18 Developer Track Contenthttp://tabsoft.co/tcdevtrack
Tableau Developer Programhttp://tableau.com/developer
Free environment for development
Early access to info and APIs
Tableau on GitHubhttp://github.com/tableau
http://github.com/tableau/webdataconnector
D ATA C O N N E C T I V I T Y R E L AT E D S E S S I O N S
Data and Back Again | Lessons from Shipping WDCsOct-24 | 10:15 – 11:15 Oct-24 | 12:00 – 13:00
Write Your First Web Data Connector (WDC)Oct-23 | 14:15 – 15:15 Oct-24 | 15:30 – 16:30
Leveraging the Extract API to Build Data ModelsOct-23 | 10:45 – 11:45 Oct-24 | 10:15 – 11:15
Please complete the
session survey from the
Session Details screen
in your TC18 app