React Native

Lightspeed - Upload an Image

See more Lightspeed Examples

Create (uploads) a new product image. React Native

import { BinData, Http, HttpResponse, JsonObject, StringBuilder } from '@chilkat/react-native'

async function chilkatExample() {
  // This example assumes the Chilkat API to have been previously unlocked.
  // See Global Unlock Sample for sample code.

  const http = new Http();

  // Implements the following CURL command:

  // curl   -u API_KEY:API_SECRET \
  //     -H "Content-Type: application/json" \
  //     -X POST \
  //     -d '{
  //   "productImage": {
  //     "attachment": "base64-encoded-contents",
  //     "filename": "the-filename-with-extension-goes-here.jpg"
  //   }
  // }' \
  // "https://api.webshopapp.com/en/products/product_id/images.json"

  // Use the following online tool to generate HTTP code from a CURL command
  // Convert a cURL Command to HTTP Source Code

  http.login = 'API_KEY';
  http.password = 'API_SECRET';

  // Use this online tool to generate code from sample JSON:
  // Generate Code to Create JSON

  // The following JSON is sent in the request body.

  // {
  //   "productImage": {
  //     "attachment": "base64-encoded-contents",
  //     "filename": "the-filename-with-extension-goes-here.jpg"
  //   }
  // }

  const bdImage = new BinData();
  try {
    bdImage.loadFile('qa_data/jpg/starfish.jpg');
  } catch {
    console.log('Failed to load image file.');
    return;
  }

  const json = new JsonObject();
  json.updateString('productImage.attachment', bdImage.getEncoded('base64'));
  json.updateString('productImage.filename', 'starfish.jpg');

  http.setRequestHeader('Content-Type', 'application/json');

  // The product ID in the URL is "112265200".
  const resp = new HttpResponse();
  try {
    await http.httpJsonAsync('POST', 'https://api.webshopapp.com/en/products/112265200/images.json', json, 'application/json', resp);
  } catch {
    console.log(http.lastErrorText);
    return;
  }

  const sbResponseBody = new StringBuilder();
  resp.getBodySb(sbResponseBody);
  const jResp = new JsonObject();
  jResp.loadSb(sbResponseBody);
  jResp.emitCompact = false;

  console.log('Response Body:');
  console.log(jResp.emit());

  const respStatusCode = resp.statusCode;
  console.log(`Response Status Code = ${respStatusCode}`);
  if (respStatusCode >= 400) {
    console.log('Response Header:');
    console.log(resp.header);
    console.log('Failed.');
    return;
  }

  // Sample JSON response:
  // (Sample code for parsing the JSON response is shown below)

  // {
  //   "productImage": {
  //     "id": 13362569,
  //     "sortOrder": 3,
  //     "createdAt": "2019-06-06T14:52:07+00:00",
  //     "updatedAt": "2019-06-06T14:52:07+00:00",
  //     "extension": "png",
  //     "size": 8016,
  //     "title": "logo",
  //     "thumb": "https://cdn.shoplightspeed.com/shops/000001/files/14271562/50x50x2/logo.png",
  //     "src": "https://cdn.shoplightspeed.com/shops/000001/files/14271562/logo.png"
  //   }
  // }

  // Sample code for parsing the JSON response...
  // Use the following online tool to generate parsing code from sample JSON:
  // Generate Parsing Code from JSON

  const productImageId = jResp.intOf('productImage.id');
  const productImageSortOrder = jResp.intOf('productImage.sortOrder');
  const productImageCreatedAt = jResp.stringOf('productImage.createdAt');
  const productImageUpdatedAt = jResp.stringOf('productImage.updatedAt');
  const productImageExtension = jResp.stringOf('productImage.extension');
  const productImageSize = jResp.intOf('productImage.size');
  const productImageTitle = jResp.stringOf('productImage.title');
  const productImageThumb = jResp.stringOf('productImage.thumb');
  const productImageSrc = jResp.stringOf('productImage.src');
}