HCI Kit

HCI Kit

  • Quickstart
  • API
  • GitHub

›Cookbook

Getting Started

  • Introduction
  • Quickstart
  • Configuration
  • Tasks
  • Logging
  • Deploying

Cookbook

  • Electron
  • Uploading to S3

Uploading to S3

Uploading to S3 requires some configuration and dependencies. You need to install

Setup

In order to create a bucket to host the experiment and to store logfiles you can use create-hci-experiment. Create HCI Experiment will create a Cognito ID Pool, S3 bucket to store logs, an S3 bucket to deploy the website to, along with a script to deploy your experiment to that bucket.

First make sure your experiment package has a unique name, it must be unique across all of S3. A good example might prefix it with exii- like exii-keymap. Put this in package.json as a name field:

{
  "name" : "exii-keymap"
  ...
}

You also need to ensure you have a set of AWS credentials to create the buckets etc. You configure these by putting them in ~/.aws/credentials. The easiest way to do this is by installing aws-cli and then running aws config.

Then run npx @hcikit/hci-scripts s3 to generate everything you need for IDs etc.

Creating an Uploader Task

You need to install aws-sdk using yarn or npm to create an uploader task.

In s3Uploader.js:

import AWS from "aws-sdk";

export function createS3Uploader(
  AWS_REGION,
  AWS_COGNITO_IDENTITY_POOL_ID,
  AWS_S3_BUCKET
) {
  AWS.config.region = AWS_REGION;
  AWS.config.credentials = new AWS.CognitoIdentityCredentials({
    IdentityPoolId: AWS_COGNITO_IDENTITY_POOL_ID
  });

  let s3 = new AWS.S3({
    apiVersion: "2006-03-01",
    params: { Bucket: AWS_S3_BUCKET }
  });
  // https://blog.mturk.com/tutorial-how-to-create-hits-that-ask-workers-to-upload-files-using-amazon-cognito-and-amazon-s3-38acb1108633
  return function(fileName, data) {
    return s3
      .upload({
        Key: fileName,
        Body: JSON.stringify(data),
        ContentType: "json",
        ACL: "bucket-owner-full-control"
      })
      .promise();
  };
}

In App.js or wherever you register and create components:

import { createS3Uploader } from "./s3Uploader";

let uploadComponent = createUpload(
  createS3Uploader(
    "<AWS Region>",
    "<COGNITO POOL ID>",
    "<S3 UPLOAD BUCKET>" /* eg. exii-keymap-uploads */
  )
);

registerTask("S3Upload", uploadComponent);

Finding your cognito pool id is a bit tricky, you can find it by navigating to

https://console.aws.amazon.com/cognito/federated/

You might however need to select your region, navigate to https://console.aws.amazon.com/cognito click manage identity pools.

Or, you can try this link if your region is us-east-2 https://us-east-2.console.aws.amazon.com/cognito/home?region=us-east-2

Now click on the name for your experiment like exii_keymap_uploads.

In the topright click edit identity pool, and copy all of Identity Pool ID.

Configuring

Now all you need to do is add the task to your configuration.

{
 task: "S3Upload",
 filename: "blaine_log",
 experimenter: "hello@world.com"
}

If you don't care if the upload is successful add fireAndForget : true The upload task does need some information to upload and make sure there's a safe fallback for failed uploads. You can add your email as an experimenter property, and you also need a filename. Typically we use the participant ID and maybe a timestamp.

To learn more about the upload task you created check out https://hcikit.github.io/api/#upload

Deploying

Finally to deploy your experiment run npm run deploy which creates a website at:

http://.s3-website.us-east-2.amazonaws.com

← Electron
HCI Kit
Docs
Getting StartedAPI Reference
More
GitHub
Copyright © 2019 Blaine Lewis