NAV

Public application config

Storage API allows to save public app config and easily access it in a storefront. You can use this API if your app changes the look, appearance or logic of storefronts using the Customize Storefront API.

Let’s say that you plan to build an app, that customizes a storefront, by displaying custom text created by store owner on a cart page.

Get public application config data in storefront example

Ecwid.getAppPublicConfig('my-cool-app')
// "enabled"

See also: App utilizing the app public config source code example

Or you can create a fully customizable widget, where merchant can input custom text, change its size, color, background and do other customizations.

To do all of the above, your app will need to request all these fields from a merchant and then apply them in storefront pages.

User preferences or unique data can be carried over to merchant’s storefront using public app config. To do that, save necessary merchant settings in public configuration of your app and access them in storefront using Ecwid JS API.

App public config represents a value of the public key in application storage and it is always a string type. Application storage can be accessed from both Ecwid Javascript SDK and REST API.

This provides equal access to storage for native apps and external applications, which operate outside of Ecwid control panel. To get the public config in storefront, use a simple Ecwid Javascript API function.

See sections below for more details on how to work with app public config.

Save public data

Client-side native app example:

var categoryId = '12345';

EcwidApp.setAppPublicConfig(categoryId, function(){
  console.log('Public config saved!');
});

Server-side or external app example:

POST /api/v3/1003/storage/public?token=4884asd HTTP/1.1
Host: app.ecwid.com
Content-Type: application/json;charset=utf-8
Cache-Control: no-cache

'12345'

There are two ways to save user’s data to app public config:

  1. For native client-side applications, created in Javascript, use setAppPublicConfig function of Ecwid Javascript SDK

  2. For external or server-side applications, use REST API for saving user data to ‘public’ key of application storage

Important:

  • App public config can accept any string with the size less than 64Kb. Please make sure to store the required data only.

  • App public config can be accessed by any 3rd party in storefront, if they know your appId.

If any other 3rd party obtains your appId, they will have access to public user data of your application in storefront. Please make sure not to store any user sensitive data in app public config.

Check out example on how to save data to app public config on the right. To find out more details on how to access app storage via REST API, please see this page.

Get public data

Initialize app on a specific category page

Ecwid.OnPageLoaded.add(function(page){
  var category_id = Ecwid.getAppPublicConfig('my-cool-app'); // 'my-cool-app' is your appId value

  category_id = parseInt(category_id);

  if (page.categoryId == category_id) {
    // initialize your app
  } else {
    return;
  }
})

If your app customizes Ecwid storefront, you can get public config of your app using Ecwid JS API.

In your Javascript file, which is executed when a storefront is loaded, you should get config using this API call: Ecwid.getAppPublicConfig('appId'). It will return a string value that you saved previously.

To get the value, specify your appId (app client_id) as its parameter and store the result of this function in a variable. If you are not sure on what your appId is, please contact us.

App public config is available to your app as soon as storefront starts to load.

Examples

Access a single public value

Check whether widget needs to be shown

// Save data to app public config in native client-side app

var widget_enabled = 'true';

EcwidApp.setAppPublicConfig(widget_enabled, function(){
  console.log('Public app config saved!');
});

// Get data from app public config in storefront example

Ecwid.OnPageLoaded.add(function(page){
  var widget_enabled = Ecwid.getAppPublicConfig('ecwid-example-app');

  if (widget_enabled == 'true') {
    // initialize your app
  } else {
    return;
  }
})

Using EcwidApp.setAppPublicConfig you can save a simple string to use in storefront. For example, you can store the status of your widget (enabled / disabled) based on user preferences in native applications and then access it in storefront using Ecwid.getAppPublicConfig.

Access multiple public user data

Add custom text to category page and change its color

//
// Save multiple public user data in native client-side app using JavaScript SDK
//

var data = '{ "color" : "red", "page_id" : "123456", "text" : "Get 10% off on checkout with this code: ABCDEFG" }';

EcwidApp.setAppPublicConfig(data, function(){
  console.log('Public app config saved!');
});
//
// Get multiple public user data in storefront and display user text on specific category page using JavaScript API
// 

Ecwid.OnPageLoaded.add(function(page){
  var data = Ecwid.getAppPublicConfig('my-cool-app');
  data = JSON.parse(data);

  var color = data.color;
  var page_id = data.page_id;
  var text = data.text;
  var added;

  page_id = parseInt(page_id);

  if (page.categoryId == page_id && added !== true) {
    div = document.getElementsByClassName("ecwid-productBrowser")[0];
    div.innerHTML = text + div.innerHTML;

    // customize text style using color 
    // ...

    added = true;
  }
  else {
    return;
  }
})

Sometimes applications require more user information in storefront and it’s possible to access it as well as a simple value.

To save more than one value and utilize it as a key : value storage within app public config, you can save your data in a JSON format in a single string using EcwidApp.setAppPublicConfig.

After that, you can access this data in storefront using Ecwid.getAppPublicConfig and then parse it via standard Javascript function JSON.parse, which will present your data in a JavaScript object. Check out example on the right to find out how it works.