Connection FlowsDiscover how to build the API integration with shopping carts

and provide the best user and integration experience

Contents

2

Contents1. API Integration Strategy 3

Introduction 4

Authentication 6

2. Connection Flows 7

Hosted and Open-Source carts with plugin 8

Hosted carts without plugin 13

Basic Authentication 13

OAuth Authentication 16

Open-Source cars without plugin 19

Connection with FTP credentials 19

Connection without FTP credentials 22

3. Blank Plugins 25

4. Tips and Usability Hygiene 27

Improve your UX design 28

Best authentication practices 29

5. About API2Cart 30

Contents

1. API Integration StrategyMake integration simple

3

ContentsIntroductionBefore you start, let’s use the mock up below as an example of an order and shipping management application. The admin panel

of this application includes common tabs such as Dashboard, Settings, Billing, etc. We will use this example within the pdf to show

how a UI/UX may differentiate depending on a shopping cart and a way you want to integrate with them.

MEASUREMENT

While this paper can showcase

the setup of new integrations, it

can also be used for optimizing

existing integrations.

4

Contents Determine the best UI options within your application.

Determine the types of authentication that your app will use.

Check the possibility of creating plugins for connecting web stores with your application.

We suggest that you consider these steps below when planning on integrating with shopping carts:

Here we added a new tab, “Integration”. It is

meant to tell the user your application can

integrate with other 3rd party systems.Note: When they click “Integration” tab, they

can see the list of all supported platforms.

5

ContentsAuthenticationAfter you have designed the best place for integrations within your application, you should decide what shopping carts you are

planning to integrate with. Since shopping carts use different authentication mechanisms, they require different connection

workflows between your app and shopping carts.

There are 2 authentication mechanisms you can use to connect an online store to your application:

authentication mechanisms

Basic access authentication — A widely used protocol for simple username/password authentication. This type of mechanism provides no confidentiality protection for the transmitted credentials

OAuth — An open standard for authorization, commonly used as a way for users to authorize websites or applications to access their information on other websites but without giving them the passwords.

6

Contents

2. Connection flowsAdopt your integrations

7

ContentsConnection FlowsHow you connect a store to API2Cart depends on the type of shopping cart it is based on, hosted (e.g. Shopify, Bigcommerce)

or open-source (e.g. WooCommerce, Magento). You can see what you need to add stores here.

You can connect a shopping cart to your application using these 3 ways, each working for different types of platforms:

Hosted (e.g. Bigcommerce) and Open-source (e.g. Magento) via plugins.

Hosted (e.g. Bigcommerce) without plugin (oAuth or Basic authorization).

Open-source (e.g. Magento) without plugin.

Next you’ll find three sections dedicated to the types of connection flows. We’re going to follow this structure:

The steps your client will have to take to connect their store to your application.

How we suggest this should look like in terms of UI/UX.

The scheme of communication between your system and API2Cart: how adding a store and sending API requests work.

How To cHooSE THE RIgHT wAy?The best means to choose one of these 3 connection flows for

your integration is to answer the following questions:

#1. What shopping cart am I planning to integrate with?

#2. Will I use a plugin for this shopping cart?

8

ContentsHosted and Open-Source Carts with PluginPlugins are applications that can be easily installed and used as part of a webstore. You can leverage them to extend the

functionality of a web store or use for API integration and establishing the connection between the web store and your application.

Here’s how a plugin-based connection between a shopping cart and your application will work from the perspective of your end-

clients (web store owners):

1. Your customer logs in to the backoffice of their store.

2. They install your plugin from a marketplace or as a zip-file you provide them.

3. During the installation process, they enter the credentials they use to log in to your application. (That is how you link web

stores with your application.)

4. They click the Connect button.

5. The connection between the web store and your system is established.

9

Contents

10

When web store owners press Install plugin,

it redirects them to the shopping cart

marketplace page.

In case you provide the possibility to download

a plugin as a zip-file, they can install the plugin

in their shopping cart admin panel themselves.

ContentsTIP

Instead of using basic credentials

of your application, you can

generate API keys that store

owners could copy-paste.

11

They enter the credentials they use to log in

to your application.

The plugin is installed. You can interact with a

shopping cart.

Contents

That’s how the connection and request mechanisms work when you use API2Cart. When a web store owner installs the plugin,

it uploads a bridge file into the server root folder and returns a unique store key. Then, you send us the store key and the web

store URL using the cart.create method. After that, our API establishes a connection with this web store and informs your system

about the result. Finally, you can send your requests.

12

ContentsHosted Carts without Plugin. Basic Authentication

Let’s see how the connection with the Basic Authentication method will work:

1. A web store owner logs in to your application account.

2. They go to Integration page and choose Volusion.

3. They fill required fields like API path and API key (please note that fields depending on the shopping cart).

4. They click the Connect button.

5. The connection between the web store and your system is established.

13

Basic Authentication method

OAuth Authentication method

There are 2 options how you can connect a hosted web store to your application without using plugins:

Contents

14

They simply fill the form

and press connect. You can

interact with a shopping cart.

Contents

Considering integration with hosted shopping carts, you should collect the web store URL and all

necessary API parameters (API key and API password) and send them to API2Cart using the cart.

create method. After that, API2Cart verifies these parameters, returns a store key, and informs

your system about the result. Finally, you can send your requests.

NoTE

API parameters may vary for

different hosted shopping carts

(thus, fields on your UI may vary

as well)

15

ContentsHosted Carts without Plugin. OAuth AuthenticationOpen Authentication (OAuth) is an authentication protocol that allows application actions to perform certain operations on

your behalf without sharing your password.

It was introduced to help avoid the security risks that using basic authorization could lead to, as it simply asked for username

and password that were then forwarded to the API. All the private information held by and accessible to the software utilizing

your API could be used maliciously once it is hacked. OAuth is token-based which means that it prevents the user information

from being exposed to the API client.

That’s how the connection steps for hosted shopping carts via OAuth will look for your users:

1. A web store owner logs into your application.

2. They go to the Integration page and choose Shopify.

3. They insert their Shopify store URL into a 1-line form.

4. They click the Connect button.

5. They install an app by pressing the Install App button right from their store back office.

6. The connection between the web store and your system is established.

16

Contents

17

They insert their Shopify store

URL into a 1-line form.

They press install app and you can

interact with a shopping cart.

Contents

create a mechanism for handling access tokens between your application with shopping cart API directly;

after you receive an access token, use the cart.create method to send this parameter and a web store URL to API2Cart;

our API establishes a connection to this web store and informs your system about the result;

finally, you can send your requests.

API2Cart receives access tokens and can work with OAuth-based shopping carts like Bigcommerce and Shopify. Here’s what you

need to do to make it work for your system:

18

ContentsOpen-source Carts without Plugin (with FTP Credentials)As to Open-source platforms, API2Cart connects to such type of solutions through connection bridge. connection Bridge file is

being used to retrieve information from your shopping cart via API and should be installed into the server root folder.

19

Here is how the process will look for your end-clients :

1. A web store owner logs in to your system.

2. They go to the Integration page and choose Magento.

3. They complete a form with various fields, including Store URL and FTP credentials.

4. They click the connect button.

5. Your system automatically downloads a bridge file to the store server.

6. The connection between the web store and your system is established.

Contents

20

When your clients fill the

form, they simply press

connect and you can interact

with a shopping cart.

Contents

Connecting a web store to API2Cart in this way, you must send us all FTP credentials so that we can upload a bridge file to the

server root folder. When it is done, we generate a store key, return it to your system, and inform your system about the result.

Finally, you can send your requests.

21

ContentsOpen-source Carts without Plugin (without FTP Credentials)

You can improve the last option by letting your clients avoid the inconvenience of sharing their FTP credentials. It is more safe,

but requires some additional steps for your clients.

That’s how the connection with the Open-source shopping carts will work:

1. A web store owner logs in to your system.

2. They go to the Integration page and choose Magento.

3. They enter their Store URL.

4. They download a bridge file and manually upload it to their store server.

5. They return back and let your system know that they have already uploaded the bridge file.

6. The connection between the web store and your system is established.

22

Contents

As you can see, there is no need to enter clients’ FTP credentials, since they install the bridge file manually. When they upload

a file to the server, they return back to your application and press Connect (this is when you know you can start sending API

requests). You can interact with a shopping cart.

NoTE

When using this method, it is

recommended to provide step-

by-step guides for your clients, as

it could be confusing to install the

bridge file.

23

ContentsWhen using this authentication method, you will

have to deal with some peculiarities, as you need

to send some additional API calls to establish

the connection between your application and a

web store. This is our recommendation on how

it should work:

1. When a web store owner presses “Download a

bridge”, you execute the cart.bridge method,

and it generates a store key. Then, API2Cart

returns it to your system.

2. After your system receives the store key, you

call the bridge.download method to get a

unique bridge file.

3. We return the bridge file to your system and

then there appears a window that asks a

web store owner to download a file.

4. They upload a file into the server root folder

and return back to their account.

5. They press Connect and you call the cart.

create method with the store URL and store

key included.

6. After that our API establishes a connection

to this web store and informs your system

about it. Finally, you can send your requests.

24

Contents

3. Blank pluginsSpeed up the integration process

25

ContentsBlank PluginsAPI2Cart free plugins are intended to make it easier to add stores based on open-source shopping carts like Magento,

WooCommerce, PrestaShop, and CS-Cart. They automatically install a connection bridge to the root folder of the store thus

excluding the inconveniences that the process usually entails.

The plugins are organized blank and white label, which means you can modify them with your logos and additional specified

functionality to present as native code module. You can also list and promote them on relevant directories and marketplaces.

From a technical point of view those plugins are wrappers around the bridge file that automatically establish a connection

between the web store and your application. They can be used to speed up the integration process and are perfect for the first

connection flow we have discussed before.

If you need more information about how the plugins work, read here or contact our team.

26

Contents

4. Tips and Usability HygieneMake it easier and clear

27

ContentsTips and Usability Hygiene

1. Use the newest authentication methods if possible.

2. Add a short description of what the integration with a shopping cart does, so that users could understand what this connection can do for them. For example, “auto import tracking numbers and order info from Shopify store every 4 hours”, etc.

3. Add a short tutorial on how to connect a web store with your application. For example, a “How to setup video” or “Step-by-step guide” could be a great option.

4 Think about “How to...” FAQs or knowledge base pages. For instance, “How to install the Magento plugin”, “How to connect my Shopify store”, etc.

5. Link to some relevant articles to cover the most important questions.

6. When they enter incorrect access credentials, make sure that they receive a warning message or a pop-up window that tells them about an error.

This section focuses on usability hygiene and the basics, which help to make the process of connecting the web store with your

application more clear.

28

ContentsThe Best Authentication PracticesTo optimize your integration experience and conduce a flawless UX for your customers, we recommend that you should do the

following:

1. Connect hosted platforms (Shopify, Bigcommerce) using OAuth apps.

2. Connect all other hosted platforms using the Basic Authentication method.

3. Connect the most popular open-source platforms (Magento, Woocommerce, Prestashop) using either your native or our ready-

to-use blank plugins.

4. Connect all other (or less important for you) open-source platforms asking your clients to download and install a bridge file

themselves.

Following these recommendations, you will surely provide the best user and integration experience for your clients. If you have

more questions about the best integration practices, feel free to contact us.

Try IT For Free

29

ContentsAbout API2CartAPI2Cart provides a unified API to integrate with multiple shopping carts. It allows to connect with stores based on any of the

supported platforms and retrieve all the necessary store data for further processing. Integration via the unified shopping cart

data interface helps to optimize business logic, save time and resources that separate integrations would take, and invest them

in other business issues.

API2Cart offers 65+ API methods to let you operate and manipulate shopping cart store data as you need it for business. It

ensures secure data transfer with help to SSL certificate and 32-symbol API key. To make your integration progress easier, the

service provides a detailed documentation with code samples and interactive examples. Plus, full tech support will help you

solve any issues.

SUPPorTed PlATFormSdoCUmenTATIon

30

We belive in your bussiness and its success.

Start making more sellers happier with

www.api2cart.com