Developer : Example Client

Manage applications

The following code demonstrates how to connect an application with Goodsie using the client-side authorization flow. It is a completely self-contained HTML/JS application. To get it working, register an application on Goodsie and replace YOUR_APP_KEY with your application's actual key. Then load the page in a browser.

Note: Goodsie currently only accepts absolute redirect URLs that use the HTTP protocol for the redirect_uri parameter. If you attempt to load the example client on your local filesystem, most browsers prepend the window location with something like file://, which Goodsie won't accept. If that's the case, you need to configure a web server on your machine to serve the file at an URL similar to:

http://127.0.0.1/example_client.html
<html> 
   <head> 
     <title>Client-Side Authorization Example</title> 
   </head> 
   <body> 
   <script> 
     function displayStoreMetadata(metadata) {
       var name = document.getElementById('name');
       var desc = document.getElementById('description');
       var nameText = document.createTextNode(metadata.name);
       var descText = 
            document.createTextNode(metadata.description);
       name.appendChild(nameText);
       desc.appendChild(descText);
     }

     var appID = "YOUR_APP_KEY";
     if (window.location.search.indexOf("error") != -1) {
         alert("Error! Inspect URL for details.");
     } else if (window.location.hash.length == 0) {
       // Not authorized yet. Get an access token
       var path = 'https://goodsie.com/oauth2/authorize?';
       var queryParams = ['client_id=' + appID,
        'redirect_uri=' + window.location,
        'scope=storefront',
        'response_type=token'];
       var query = queryParams.join('&');
       var url = path + query;
       window.location = url;
     } else {
       // We have an access token. Prepare the API call
       var hash = window.location.hash.substring(1);
       var token = hash.substr(hash.indexOf('access_token='))
                    .split('&')[0]
                    .split('=')[1];
       var path = "https://goodsie.com/api/v1/metadata?";
       var queryParams = ['bearer_token='+token, 
            'callback=displayStoreMetadata'];
       var query = queryParams.join('&');
       var url = path + query;

       // Call the Goodsie API. JSONP callback
       // will display results
       var script = document.createElement('script');
       script.src = url;
       document.body.appendChild(script);        
     }
   </script> 
   <h1 id="store_name"></h1> 
   <p id="store_description"></p> 
   </body> 
</html>