API Credentials - Getting Started

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>API Credentials - Getting Started | Zara 4</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta name="author" content="Zara 4"> <meta name="content-language" content="EN" /> <meta name="copyright" content="Copyright 2015-2025 Zara 4. All rights reserved." /> <meta property="og:title" content="API Credentials - Getting Started | Zara 4" /> <meta property="og:description" content="" /> <meta property="og:type" content="website" /> <meta property="og:url" content="https://zara4.com/docs/getting-started/api-credentials" /> <meta property="og:site_name" content="Zara 4" /> <meta property="og:image" content="/img/logo.png"/> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <link rel="apple-touch-icon" sizes="180x180" href="/img/icon/apple-touch-icon.png"> <link rel="icon" type="image/png" href="/img/icon/favicon-32x32.png" sizes="32x32"> <link rel="icon" type="image/png" href="/img/icon/favicon-16x16.png" sizes="16x16"> <link rel="manifest" href="/img/icon/manifest.json"> <link rel="mask-icon" href="/img/icon/safari-pinned-tab.svg" color="#d70017"> <meta name="theme-color" content="#ffffff"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" lazyload="1"> <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css' lazyload="1"> <link rel="stylesheet" href="/css/bootstrap-theme.min.css" lazyload="1"> <script src="https://asset.zara4.com/js/jquery-1.11.1.min.js"></script> </head> <body data-spy="scroll" data-target="#sub-navigation" role="document"> <div id="document-content"> <nav class="navbar navbar-default"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="/" title="Zara 4"> <img src="/img/logo.png" alt="Zara 4" /> </a> </div> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li><a href="https://zara4.com/account">My Account</a></li> <li><a href="https://blog.zara4.com">Blog</a></li> <li><a href="https://zara4.com/pricing">Pricing</a></li> <li><a href="https://zara4.com/docs">Docs</a></li> </ul> <ul class="nav navbar-nav navbar-right"> <li><a href="https://zara4.com/auth/login">Login</a></li> <li><a href="https://zara4.com/auth/register">Sign up</a></li> </ul> </div> </div> </nav> <div class="shadow-curve-top-15 shadow-curve-top-weak after-nav-spacer"></div> <div class="container mt-20"> <div class="panel clearfix layout1"> <div class="navigation"> <b class="light">Getting Started</b> <ul class="list-unstyled"> <li><a href="https://zara4.com/docs/getting-started/welcome">Welcome</a></li> <li class="active"><a href="https://zara4.com/docs/getting-started/api-credentials">API Credentials</a></li> <li><a href="https://zara4.com/docs/webhooks">Webhooks</a></li>  </ul> <b class="light">Image Processing</b> <ul class="list-unstyled"> <li><a href="https://zara4.com/docs/image-processing/upload-image">Upload Image</a></li> <li><a href="https://zara4.com/docs/image-processing/image-url">Image URL</a></li> <li><a href="https://zara4.com/docs/image-processing/options">Options</a></li> </ul>  <b class="light">Official SDKs</b> <ul class="list-unstyled"> <li><a href="https://zara4.com/docs/sdk/php">PHP Library</a></li> <li><a href="https://zara4.com/docs/sdk/java">Java Library</a></li> <li><a href="https://zara4.com/docs/sdk/ruby">Ruby Gem</a></li> <li><a href="https://zara4.com/docs/sdk/dot-net">.NET Library</a></li> </ul> <b class="light">Official Plugins</b> <ul class="list-unstyled"> <li><a target="_blank" href="https://wordpress.org/plugins/zara-4/"><i class="fa fa-wordpress mr-5"></i>WordPress</a></li> <li><a href="https://zara4.com/docs/plugin/joomla"><i class="fa fa-joomla mr-5"></i> Joomla</a></li>  </ul> </div> <div class="content" style="min-height: 450px"> <h1>API Credentials</h1> <p> The Zara 4 API uses OAuth authentication, using access tokens to grant limited access to your account. To gain access through the API, you need an <code>API_CLIENT_ID</code> and <code>API_CLIENT_SECRET</code> which you can obtain by viewing your account <a href="https://zara4.com/account/api-clients/live-credentials">api credentials</a>. </p> <p> You can also use the Zara 4 API in 'sandbox' mode by using your <a href="https://zara4.com/account/api-clients/test-credentials">test api credentials</a>. This works in exactly the same way but does not count towards your account quota, and cannot access your real account data. </p> <hr/> <h2 id="authenticating-using-sdk">Authenticating using SDK</h2> <p> The easiest way to authenticate with the Zara 4 API is by using one of our programming SDKs. </p> <p> Our programming SDKs provide helper classes that perform authentication and reauthentication with the Zara 4 API automatically. </p> <h4>Example authentication</h4> <ul class="nav nav-tabs" role="tablist"> <li role="presentation" class="active"><a href="#php" aria-controls="php" role="tab" data-toggle="tab">PHP</a></li> <li role="presentation"><a href="#java" aria-controls="java" role="tab" data-toggle="tab">Java</a></li> <li role="presentation"><a href="#ruby" aria-controls="ruby" role="tab" data-toggle="tab">Ruby</a></li>  <li role="presentation"><a href="#vbdotnet" aria-controls="vbdotnet" role="tab" data-toggle="tab">VB .NET</a></li> <li role="presentation"><a href="#csharpdotnet" aria-controls="csharpdotnet" role="tab" data-toggle="tab">C# .NET</a></li> </ul> <div class="tab-content">  <div role="tabpanel" class="tab-pane active" id="php"> <pre class="prettyprint lang-php"> // Import Zara 4 classes use Zara4\API\Client; // ... $apiClient = new Client('API_CLIENT_ID', 'API_CLIENT_SECRET'); </pre> </div>  <div role="tabpanel" class="tab-pane" id="java"> <pre class="prettyprint lang-java"> // Import Zara 4 classes import org.zara4.api.*; // ... Client apiClient = new Client("API_CLIENT_ID", "API_CLIENT_SECRET"); </pre> </div>  <div role="tabpanel" class="tab-pane" id="ruby"> <pre class="prettyprint lang-ruby"> # Import Zara 4 classes require 'zara4' # ... api_client = Zara4::API::Client.new({ 'client_id' => 'API_CLIENT_ID', 'client_secret' => 'API_CLIENT_SECRET' }) </pre> </div>  <div role="tabpanel" class="tab-pane" id="nodejs"> <pre class="prettyprint lang-javascript"> NODEJS CODE </pre> </div>  <div role="tabpanel" class="tab-pane" id="python"> <pre class="prettyprint lang-python"> PYTHON CODE </pre> </div>  <div role="tabpanel" class="tab-pane" id="vbdotnet"> <pre class="prettyprint lang-vb"> 'Import Zara 4 classes' Imports Zara4.API '...' Dim apiClient = new Client("API_CLIENT_ID", "API_CLIENT_SECRET") </pre> </div>  <div role="tabpanel" class="tab-pane" id="csharpdotnet"> <pre class="prettyprint lang-java"> // Import Zara 4 classes using Zara4.API; // ... Client apiClient = new Client("API_CLIENT_ID", "API_CLIENT_SECRET"); </pre> </div> </div> <hr class="dashed"/> <h2 id="manual-authentication">Manual Authentication</h2> <p> You can also authenticate with the API manually without using our SDKs. To do this you will require some knowledge of OAuth as well as how to perform RESTful http requests within your chosen programming language. </p> <p> To access the API you will require an <code class="bold">access_token</code> to authenticate your API requests. Access tokens are obtained by providing your application <code>client_id</code> and <code>client_secret</code> which can be found in your account <a target="_blank" href="https://zara4.com/account/api-clients/live-credentials">API credentials</a>. You will need to <a href="/auth/register">register</a> to obtain API credentials. </p> <p> The <b>scope</b> included in your authentication request specifies the permissions the returned access token will have over your account. In the example below, the generated access token will have permission to optimise images and read the account usage data. Each scope should be separated by a comma - see <a href="#scopes">scopes</a> for more. </p> <h4 class="mt-30">Example OAuth Authentication Request</h4> <div class="pre-wrapper"> <pre class="prettyprint lang-sh"> curl https://api.zara4.com/oauth/access_token -X POST \ -d grant_type=client_credentials \ -d client_id=API_CLIENT_ID \ -d client_secret=API_CLIENT_SECRET \ -d scope=image-processing,usage </pre> </div> <h4 class="mt-30">Example Authentication Response</h4> <div class="pre-wrapper mb-30"> <pre class="prettyprint lang-json"> { "access_token":"XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "token_type":"Bearer", "expires_in":3600 } </pre> </div> <p> The returned <code>access_token</code> can now be used for to authenticate your API requests. </p> <p> The <code>access_token</code> will expire after a time period of <code>expires_in</code> (seconds), after which you should request a new access token. </p> <h3 id="scopes">Scopes</h3> <p> Zara 4 uses scopes to allow you to specify what permissions a generated <code>access_token</code> should have. This enables you to generate API access tokens with restricted access to your account. </p> <p> For example, you wish to create an application in collaboration with a third party that will display your account usage data on a graph. You need to give the third party an access token that can read your usage data, but you don't want them to be able to process images using your account quota. </p> <div class="panel mt-30"> <table class="table table-bordered table-striped"> <thead> <tr> <th style="width: 200px">Scope</th> <th>Description</th> </tr> </thead> <tbody> <tr> <td><code class="light-and-red">image-processing</code></td> <td> <p> Allow submission of images to be optimised by Zara 4.<br/> Images submitted using the generated access_token will count towards your account quota. </p> </td> </tr> <tr> <td><code class="light-and-red">usage</code></td> <td> Give access to read account usage data.<br/> <span class="text-muted">(For example, the number of requests completed this month.)</span> </td> </tr> </tbody> </table> </div> </div> </div> </div>  <div class="footer"> <div class="container"> <div class="text-center"> <ul class="list-inline"> <li><a href="https://zara4.com/about-us">About us</a></li> <li><a href="https://zara4.com/contact-us">Contact us</a></li> <li><a href="https://blog.zara4.com">Blog</a></li> <li><a href="https://zara4.com/pricing">Pricing</a></li> <li><a href="https://zara4.com/terms-of-use">Terms of use</a></li> <li><a href="https://zara4.com/privacy-policy">Privacy Policy</a></li> <li><a href="https://zara4.com/attributions">Attributions</a></li> </ul> </div> </div> <div class="container pt-5"> <div class="text-center copyright-notice"> © 2015 - 2025 <a href="/">Zara 4</a>, All Rights Reserved </div> </div> </div> </div> <script src="https://asset.zara4.com/js/dropzone.js"></script> <script src="https://asset.zara4.com/js/bootstrap-3.3.5.min.js"></script> <script src="/js/dependencies.min.js"></script> <script> $(function () { $('[data-toggle="tooltip"]').tooltip() }); // Pretty print code highlighting !function ($) { $(function(){ window.prettyPrint && prettyPrint() }) }(window.jQuery); </script> <script type="application/ld+json"> { "@context" : "http://schema.org", "@type" : "WebSite", "name" : "Zara 4", "url" : "https://zara4.com" } </script> <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "Organization", "url": "https://zara4.com", "logo": "https://zara4.com/img/icon-256x256.png", "sameAs" : [ "https://www.facebook.com/Zara-4-645511842258305", "https://plus.google.com/101336007646004602821", "https://github.com/zara-4" ] } </script> </body> </html>

CINXE.COM

API Credentials - Getting Started | Zara 4