Karsten Reuter

How to Integrate an Online Form Service with Studio Hub

October 2, 2018 / Karsten Reuter / TechTalk

Because many of our customers use forms on their websites, and there are different approaches to producing these using CoreMedia, I want to explore on how to integrate an online form service with CoreMedia Studio Hub in this post.

Use cases for this integration are:

  • browsing existing forms in the service
  • creating a reference to a form within the CoreMedia repository
  • integrating the form into a website
  • retrieving form submissions

The first thing to do is to select a form service. For my purposes, I used two criteria: First, the service had to provide an adequate API. And second, they had to have a free option.

There are lots of options out there and also most marketing automation tools also provide form capabilities. I selected Typeform, set up an account, chose a form template from the library, set up an access token, and was ready to go.

Now that I had an account, an API, and an access token, I was able to start implementing a Typeform connector.

The first thing I needed was a REST client that interacted with the API and retrieved the relevant information for Studio Hub. I started with Postman, which is great for testing a REST API and to experience how authentication works, how to post requests, and to analyze the format of the responses.

Along with the associated API documentation, I was able to implement the required POJOs, a client class, and a unit test to make sure the requests work. With just four classes, I was able to retrieve the following forms from the service:

  • Form.java
  • Forms.java
  • TypeformConnectorClient.java
  • TypeformConnectorClientTest.java

The test class was created to verify that I could retrieve a list of all my forms – as well as a specific form.

Spring REST templates make it easy to post a request and to assign the result to a POJO, like so:

public Form getForm(String id) {
  ResponseEntity<Form> formResponseEntity = 
     restTemplate.exchange("https://api.typeform.com/forms/" + id, HttpMethod.GET, createAuthEntity(), Form.class);
  if (!formResponseEntity.getStatusCode().equals(HttpStatus.OK)) {
    return null;
  }
  return formResponseEntity.getBody();
}

The next step was to implement the necessary classes for a Studio Hub Connector, which are composed of just three classes:

  • TypeformConnectorService.java – The entry point for the integration, which pulls everything together
  • TypeformCategory.java – With this integration, we just need a root category as all forms can be listed there
  • TypeformItem.java – Represents a specific form within Typeform

Once the classes are implemented, you need to configure the connector in Spring and in Studio. After that, you can see your forms right in the Studio Hub.

To create a reference for a form in the content repository, you need a WriteInterceptor that extracts the relevant information from the form and assigns it to content properties. This is done in the TypeformItemWriteInterceptor.

Unfortunately, Typeform does not provide the HTML embed code via the API, so I got it via the web interface and converted it to a template that could be added to the connector configuration. With the WriteInterceptor in place, you can now right-click on a form and create a HTML content object within the CoreMedia content repository.

Within the preview, the embedded form is immediately rendered and can now be tested.

As a final step, I added the capability to download the form submission in the Studio Hub. You can right-click on a form and select “Download.” This will retrieve all submissions from the API and put them into CSV file, which than is downloaded to your local hard drive.

The code still needs some cleanup and additional documentation, but with the CoreMedia Studio Hub I was able to implement this integration in less than three hours. It shows how easy it is to integrate powerful forms services quickly and easily!

If you’re interested in this integration, please feel free to reach out to me: karsten.reuter@coremedia.com. I look forward to hearing from you.


Karsten Reuter

Karsten Reuter

Senior Vice President Product Management

Karsten Reuter is leading the Product Management Team of CoreMedia. Karsten joined CoreMedia in 2001 and managed a variety of projects for customers such as Deutsche Telekom, Vodafone and ARD, among others. After establishing the U.S. Professional Services organization in San Francisco, he formed the e-Commerce Practice at CoreMedia and was responsible for implementing CoreMedia LiveContext for customers including JD Group, Mondou and Petedge. Prior to that, he worked for the Ponton European Media Art Lab on research projects related to Interactive TV, Virtual Reality and SmartHome. In 1996, Karsten Reuter earned a degree in Computer Science from the University of Karlsruhe.

More posts

Introducing CoreMedia Content Cloud. Part III: Strategic Business Value for Brands

The third post in the series "Introducing CoreMedia Content Cloud" analyzes the strategic business benefits of sophisticated content and experience management for brands. Because when combined, these have a major impact on a brand’s ability to compete effectively.

Read More

Recommended Read #2: Small is the New Big

The increasing presence of "microservices" is having a major impact on online retail, including the ability to influence engagement, loyalty, and sales. But what exactly are microservices and why do they matter? We share two must-read posts that explain.

Read More

Beating the Odds: Our Week at IBM Think

For CoreMedia, March means Vegas. Specifically the two major trade shows that take place there: Shoptalk and IBM Think. For our impressions of Shoptalk, see the post here. For impressions of IBM Think, read on! IBM Think, which took place March 19-22 in the Mandalay Bay Convention Center and MGM Grand Hotel in Las Vegas,...

Read More

Post a comment

SIGN UP

Add your name and email address to sign up for our CoreMedia Blog and Industry Newsletter and we will keep you posted about upcoming events, product enhancements and news about CoreMedia.

We promise to keep your data safe and you can opt out at any time.