Getting Started

An overview of how to setup the OneSchema Embeddable FileFeeds

OneSchema's Embeddable FileFeeds empowers your non-technical users to build CSV integrations with your platform just by recording transformations on a spreadsheet (demo video (5 min.)).

Example JS Embedding Code Snippet

<div>
  <script src="https://d3ah8o189k1llu.cloudfront.net/oneschema-filefeeds-0.1.latest.min.js"></script>
  <style>
  .oneschema-iframe {
    width: 100vw;
    height: 100vh;
    border: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1000;
  }
  </style>
  <script type="text/javascript">
/*
 * If you would like to use this sample in a JavaScript file as part of your
 * build you can install the npm package '@oneschema/filefeeds', copy this
 * sample into a new file, and add this import statement:
 * import oneschemaFileFeeds from '@oneschema/filefeeds'
 */
    const userJwt = "<USER_JWT>" // See "Authorization (using JWT)" page
    
    const importer = oneschemaFileFeeds({
      userJwt: userJwt,
      devMode: false,
    })

    function launchOneSchema() {
      importer.launch()

/**
 * This event is triggered after the iframe page is launched and is
 * ready to use.
 *
 * The `data` argument contains the file_feed_id and session_id values,
 * which can be used to identify the FileFeeds or Session for future
 * references.
 */
      importer.on("launch", (data) => {
        // TODO: handle launch
        console.log(data)
      })

/**
 * This event is triggered when the user hits the [ Save transforms ]
 * button.
 * 
 * The embedding page is expected to hide the iframe at this point.
 *
 * This event ends the current session. See "Authorization (using JWT)"
 * page on how to authorize creation of new sessions.
 *
 * The `data` argument contains details of the "Sample Files" uploaded
 * by the user, and their status (number of errors) in respect to the
 * transforms defined in the FileFeeds.
 */
      importer.on("save", (data) => {
        // TODO: handle save
        console.log(data)
      })

/**
 * This event is triggered when the user hits the [ Cancel ] button.
 *
 * The embedding page is expected to hide the iframe at this point.
 *
 * This event does NOT end the current session. However, if a new session
 * was created, then a new `userJwt` string will be needed to authorize
 * access to continue this session.
 */
      importer.on("cancel", () => {
        // TODO: handle cancel
      })

 /**
  * This event is triggered when the embedding faces unresolvable errors
  * and a new launch might be necessary to recover.
  */
      importer.on("error", (message) => {
        // TODO: handle errors
        console.log(message)
      })
    }
  </script>

  <button onclick="launchOneSchema()">Launch embed</button>
</div>

Embedded FileFeeds Guide

Setting up and embedding OneSchema FileFeeds takes just 30 minutes and has 4 main steps.

  1. Define your the schema of your system and validation template
  2. Embed FileFeeds using our Javascript SDK
  3. Customize the look and feel of FileFeeds
  4. Configure the FileFeed data source and destination

Step 1: Define your template and validation rules

  • There are two ways to start defining a template in OneSchema
  1. Upload a CSV of clean data (OneSchema will interpret your validation rules)
  2. Manually specify your column format and data types
  • Creation of a template is fast using our 50+ out of the box data types for numbers, picklists, dates, etc.
  • See the full guide for building a template (here)

Step 2: Embed your FileFeed builder

  • Generate a code snippet using the Admin dashboard by providing your template_key.
  • OneSchema supports Javascript, React, Angular, Vue SDKs
  • If relevant, install the appropriate package using npm or yarn
  • For authenticating your users, you will need to generate a OneSchema JWT token that is signed by a OneSchema client_secret. The Admin dashboard will give you a signed OneSchema JWT in your code snippet, but in production, you will have to generate these on your backend.
  • For receiving events from your FileFeed runs when files have errors or files are successful, you will need to create an event webhook and attach the event_webhook_key.
  • Paste the code snippet into your application and click the "Launch" button to launch the OneSchema Embedded FileFeed Builder.

Step 3: Customize your FileFeed builder

  • Head to the Customizations tab of your Admin dashboard and use OneSchema's Branding Suite to change the fonts, colors, and any other UI customizations of your FileFeed builder to match your brand and product experience.

Step 4: Configure your FileFeed creation

  • Upon receiving the "save"event when your users have finished building their transforms, a OneSchema filefeed_id will be returned in the payload.
  • This filefeed_id can be used to configure either a "pull" or a "push" based integration.

Push-based integration

Pull-based integration

  • A pull-based integration will leverage OneSchema's out of the box source / destination configurations as well as an import frequency (e.g every 24 hours).
  • Today, OneSchema supports SFTP sources + destinations and these can be updated on a FileFeed via a PATCH request to the FileFeed update API.
    https://docs.oneschema.co/reference/update-file-feed

🚧

Roadmap Info:

It is still on the roadmap to support AWS S3 / Azure blob storage / GCS blob storage and Email / IMAP servers as sources and destinations for pull-based FileFeeds. For customers who need these sources and destinations, it is recommended to use the API push-based integration with lambda / serverless functions in the meantime.