Tag Archives: API

oEmbed

Posted on by

oEmbed is a format for allowing an embedded representation of a URL on third party sites. The simple API allows a website to display embedded content (such as photos or videos) when a user posts a link to that resource, without having to parse the resource directly.

An oEmbed exchange occurs between a consumer and a provider. A consumer wishes to show an embedded representation of a third party resource on their own web site, such as a photo or an embedded video. A provider implements the oEmbed API to allow consumers to fetch that representation. The response returned by the provider can be in either JSON or XML.

The following types are defined :

  • photo
  • video
  • link
  • rich

The authors of oEmbed are Cal Henderson, Mike Malone, Leah Culver and Richard Crowley. Among the providers of oEmbed are Youtube, Flickr, Vimeo, WordPress and Slideshare.

Cross Domain Communication, Same Origin Policy and CORS

Posted on by

In computing, the same origin policy is an important security concept for a number of browser-side programming languages, such as JavaScript. The term origin is defined using the domain name, protocol, and port number of the HTML document running the script. It has always been possible for the browser to make cross origin requests by specifying a resource from a foreign domain in the IMG, SCRIPT, IFRAME tags etc. But with these requests the client-side script does not have access to the content of this resource, it can only be executed or rendered by the browser.

The same origin policy permits scripts running on pages originating from the same site to access each other’s methods and properties with no specific restrictions, but prevents access to most methods and properties across pages on different sites. The goal of the policy is to prevent cross-site scripting (XSS), a type of computer security vulnerability typically found in Web applications that enables attackers to inject client-side script into Web pages viewed by other users.

With the growing popularity of Ajax, a group of interrelated web development methods used on the client-side to create asynchronous web applications, the same origin policy became more and more a serious drawback. With Ajax, data is usually retrieved using the XMLHttpRequest object.

Various alternatives have been developed to circumvent the same origin security feature, for example :

  • Flash or Silverlight with a  crossdomain.xml policy file
  • iFrame URL Technique
  • JSONP (JSON with padding)
  • XMLHttpRequest Level 2, which has been merged into the main XMLHttpRequest specification in December 2011
  • XDomainRequest (non standard) used by IE 8
  • window.location.hash hack
  • Facebook cross domain communication channel
  • window.postMessage() : supported by Firefox 3, Safari 4, Chrome and IE 8

With HTML 5, a new web browser technology emerged which defines ways for a web server to allow its resources be accessed by a web page from a different domain. This technology is called CORS (Cross-Origin Resource Sharing), a first working draft was published by W3C.

CORS works on a per-page access-control model. Every page has to respond with a special header, the Access-Control-Allow-Origin header to be accessible by a foreign site.In the CORS model the responsibility of Access Control is in the hands of the developers and not the server administrators. One drawback of this technology is that the Access-Control-Allow-Origin header is not yet supported by Amazon AWS S3. A lot of web designers are requesting this feature on the AWS Developer Forum.

The following list gives additional useful links to websites reporting about this topic :

WordPress plugin & theme development

Posted on by

WordPress Codex provides a huge documentation for programmers who want to develop plugins or themes for the WordPress Blog program.

WordPress Plugin: A WordPress Plugin is a set of one or more functions, written in the PHP scripting language, that adds a specific set of features or services to the WordPress weblog, which can be seamlessly integrated with the weblog using access points and methods provided by the WordPress API.

Resources :

WordPress Theme : A WordPress Theme is a collection of files that work together to produce a graphical interface with an underlying unifying design for a weblog. These files are called template files. A Theme modifies the way the site is displayed, without modifying the underlying software. Themes may include customized template files, image files, style sheets, custom pages, as well as any necessary code files and scripts.

Resources :

WordPress Templates : Template files are the building blocks of your WordPress site. They fit together like the pieces of a puzzle to generate the web pages on your site. Some templates are used on all the web pages, while others are used only under specific conditions.

Resources :

Facebook Graph API and access tokens

Posted on by

The Facebook Graph API enables you to read and write objects and connections (relationships)  in The Facebook social graph.

There are 14 graph objects available :

  1. user
  2. page
  3. group
  4. application
  5. post
  6. status message
  7. note
  8. event
  9. link
  10. checkin
  11. album
  12. photo
  13. video
  14. subscription

Each object has a collection of properties. The numer of properties is ranging from 4 (min) for the “status message” object to 23 (max) for the ” user” object.

Besides the listed objects, which can be connected to other objects, the following additional connections are defined :

  1. comments
  2. feed
  3. picture
  4. tagged
  5. statuses
  6. insights
  7. maybe
  8. invited
  9. attending
  10. declined
  11. members
  12. likes
  13. source
  14. home
  15. friends
  16. activities
  17. interests
  18. music
  19. books
  20. movies
  21. television
  22. inbox
  23. outbox
  24. updates
  25. accounts

Each object has an individual ID (xxxxxxx) and can be accessed with the URL :

http://graph.facebook.com/xxxxxx

A field query parameter can be used to filter the returned data, for instance :

http://graph.facebook.com/xxxxxx?fields=id,name, picture

Alternatively, the ID can be a name, if defined. The connections, if available, are returned in the same request if the parameter “metadata=1” is added to the request (Introspection). Multiple objects can be fetched in the same request by adding the “?ids=” parameter. A special identifier  “me” refers to the current user.

To fetch a specific connection, for instance who is attending the event zzzzzz, the URL is structured as follows :

http://graph.facebook.com/zzzzzz/attending

All responses are JSON (Javascript Object Notation) objects, a lightweight data-interchange format.

If an object is private, you will receive only the public part of the data or the following error message :

{
   "error": {
      "type": "OAuthAccessTokenException",
      "message": "An access token is required to request this resource."
   }
}

To access a graph object with an active access token (yyyyyy), the following method is used :

https://graph.facebook.com/xxxxxx?access_token=yyyyyy

All calls with access tokens are required to go over HTTPS.

An access token is granted by the concerned user, by the page or by the application. Access tokens are based on OAuth 2.0, an open protocol providing specific authorization flows for web applications, desktop applications, mobile phones, and living room devices.

In an initial launch, Facebook supports three ways of getting an access token :

  • The default authorization flow is the web server flow for use by server-side developers. The whole flow works by redirecting the user to the authorization server (Facebook) and back to the developer site.  A “Connect URL” with the domain and path of the site must be preregistered.
  • The second method is the user-agent flow in a Javascript based application. Because the code actually runs on the client device, it can’t really rely on embedded secret keys for security – in JavaScript, anyone can look at the source code and trivially extract the secret. The access token is just returned directly in the redirect response instead of requiring an extra server call with specific care for handling security issues.
  • The third method, client credentials flow, is the simplest flow – just exchange your client_id and secret for an access token, no user is involved. It’s mainly supported for accessing application-only resources.

Facebook Javascript API

Posted on by

The new Facebook Javascript API handles the following methods :

Core methods

  • FB.init : Initializes the library
  • FB.login : Login/Authorize/Permissions
  • FB.logout : Logout the user in the background
  • FB.api : Make a API call to the Graph API
  • FB.ui : Method for triggering UI interaction with Facebook as iframe dialogs or popups, like publishing to the stream, sharing links
  • FB.getLoginStatus : Find out the current status from the server, and get a session if the user is connected
  • FB.getSession : Synchronous accessor for the current Session (less overhead as the asynchronous access)

Data Access Utilities

  • FB.Data.query : Performs a parameterized FQL query and returns a FB.Data.query object which can be waited on for the asynchronously fetched data
  • FB.Data.waitOn : Wait until the results of all queries are ready

Event Handling

XFBML methods

Canvas methods

Some useful tutorials about the new Facebook Javascript SDK are listed hereafter :

  • Mahmud Ahsan on Thinkdiff.net: Graph api & javascript base Facebook Connect tutorial
  • Abu Ashraf Masnun on masnun.com : Using The Facebook Graph API with js-sdk : An explanatory Tutorial
  • timware on Hyperarts : How to Add Facebook’s XFBML Like Button & Social Plugins to Your Web Pages & WordPress Posts

A very useful development tool is the Test Console made available by Facebook.

PayPal : Express Checkout or Website Payments Standard ?

Posted on by

PayPal Standard

Customers checking out with PayPal Website Payments Standard (formerly referred to as “PayPal IPN”) will complete the order in the store and once coming to the choice of the payment method, they can select PayPal . There will be a large PayPal button for them to click, they are directed to a page that allows them to log into their PayPal account or to pay by credit card without having to sign up for a PayPal account. After the payment completion, customers are returned to the store.

Website Payments Standard is the fastest way to set up online payment on a website to accept credit cards, debit cards, bank transfers, and PayPal. The integration is easy (HTML based). In the case of ZenCart, if there is any problem in PayPal’s ability to communicate to the store server,  the order will not be passed to the store.

PayPal Express

PayPal Express Checkout gives the customer two options:  They can jump over to the PayPal site to login to their account before completing checkout on the store (which allows them to select their address information there and never have to re-type their address details on the store site, thus the “express” part of the transaction) and then choosing shipping choices and discounts/coupons etc before completing the order and confirm the payment.

The other possibility is to go to the PayPal site to login to their account after making shipping/payment/coupon selections on the store site (and creating an account on the store and typing their address info on the store), much like they do with PayPal Website Payments Standard.

One important benefit is that Express Checkout does not rely entirely on the IPN communications to the store in order to release the order. Instead, it stores the order immediately when payment is completed. It doesn’t have to rely on the PayPal server to talk to the store server in order to save the order. IPN updates are still useful in case of refunds or adjustments to the order and  are reflected in the store’s order history.

The integration of PayPal Express Checkout is more complex and is based on API’s.

eBay Development : Finding API

Posted on by

These are complimentary informations to my first post about eBay Development and are focused on the new Finding API. The homepage of the eBay Developers Program is http://developer.ebay.com/.

eBay provides a set of keys (DEVID, AppID, CertID) for the sandbox and for production. These keys are registrated at the personal eBay developer account webpage. Developer centers are available for Windows, Java, PHP, Javascript and Flash. There are different API’s available for selling, buying, research and monitoring :

  • Finding
  • Shopping
  • Merchandising
  • Feedback
  • Trading
  • Large merchants
  • Client alerts
  • Platform notifications
  • Research

There are call limits per day for the different API’s. For higher call limits, applications need to complete a compatible application check process.

eBay Finding API enables applications to search for eBay items using eBay’s next generation Finding Platform. Today I replaced the eBay shopping API by the new Finding API in my applications.

The supported functions for the Finding API are :

  • getSearchKeywordsRecommendation: Get recommended keywords for search
  • findItemsByKeywords: Search items by keywords
  • findItemsByCategory: Search items in a category
  • findItemsAdvanced: Advanced search capabilities
  • findItemsByProduct: Search items by a product identifier
  • findItemsIneBayStores: Search items in stores
  • getHistograms: Get category and domain meta data

The function findItemsAdvanced enables searching for items on eBay by category (using categoryId), by keywords (using keywords), or a combination of the two. By setting the descriptionSearch field to true, the keyword queries also search the item descriptions, in addition to searching through the item title and subtitles. Another interesting finction is getHistograms which returns category and/or aspect histogram information for the eBay category ID you specify.

There are different possibilities to obtain the list of categories ID’s for a specified eBay website (php program,  special API, …). A simple solution is to access the storelist online at the eBay website with the url http://listings.ebay.xx, for instance:

Other needed informations to use the eBay API efficiently are the Global ID, a unique identifier for combinations of site, language, and territory. The list of Global ID’s is available on the eBay developer website.

The keywords field is the basis for item searches. The value specified in the keywords field can contain one or more keywords and combinations of wildcard characters. The words “and” and “or” are treated like any other word.  You can use AND or OR logic by including certain modifiers. The complete list of modifiers and wildcards for searching by keywords is available at the eBay developer website.

A search can be refined with item, aspect and domain filters. Filters provide better control over the search results by narrowing the range of items returned. Domains are a buy-side grouping of items, such as women’s dresses. A domain can span many eBay categories and some categories may be included in more than one domain. Aspects are item characteristics, such as brand, product type, size, which are shared by certain types of items. For example, for Shoes, aspects include Style, Color, and Shoe Size. For Digital Cameras, aspects include Product Type, Brand, Megapixels, and Optical Zoom.

In addition to filters, you can specify certain properties to control the way data is returned. These do not control which data is returned, but rather how it is sorted and the volume of the response. The applicable sort values are available at the eBay developer website.

Use paginationInput and its child elements to break the items matching the search criteria down into smaller subsets, or “pages” of data. The paginationInput.entriesPerPage field specifies the maximum number of items to return for any given request. The paginationInput.pageNumber field specifies which “page” of data to return in the current call. The maximum value for paginationInput.entriesPerPage is 100, this is also the default value.

To include additional informations in the search results as the default values, the outputSelector fields can be used. To earn money from eBay for driving trafic to their website, affiliate-related fields, which are included in a call request using the affiliate container, enable the tracking of user activity. Commissions are generated when users do qualifying actions, such as bid, buy, or register. The affiliate container has the following fields: networkId, trackingId, and customId.

There is no difference between uppercase or lowercase characters in the keywords. Special caracters as é, è, à, ü etc are however not recognised.

Amazon® Product Advertising API with signed requests

Posted on by

By August 15, 2009, all calls to the Amazon® Product Advertising API must be signed to authenticate the request. Ulrich Mierendorff developped a simple function in PHP that lets you make authenticated requests with only a few lines of code. He is also the author of “Antialiased filled Arcs/Ellipses” for PHP and of the rounded css boxes.

Other PHP example for Amazon signed requests have been posted by Mark on his blog “Every Good Path” and by Horacix on his blog “Inside Things“.

Amazon’s guidelines for signing requests are available on the AWS website.

The following error messages are sent:

  • the timestamp is old : Request has expired

Facebook FB.Connect.showFeedDialog

Posted on by

FB.Connect.showFeedDialog is a very powerful method which pops up a Feed form, without the need of a session, and an iframe pops up letting the user confirm publication of a story.

The required parameters are:

  • template_bundle_id  string
    The id of the feed template you want to use
  • template_data  object
    Data associated with the template (for short and full stories)
  • target_id array
    If you are publishing to other people’s Feeds, this array contains that friend’s user ID. The Feed story template must include the {*target*} token
  • body_general string
    Associated text for short and full stories
  • story_size FeedStorySize
    This parameter has been deprecated. Pass null in its place
  • require_connect RequireConnect
    Either FB.RequireConnect.doNotRequire, FB.RequireConnect.require, or FB.RequireConnect.promptConnect – The action to occur if the user has not authorized this application
  • callback Callback
    Callback to be executed after function is completed

The optional parameters are :

  • user_message_prompt string
    The label (which could be in the form of a question) that appears above the text box on the Feed form
  • user_message object
    A simple JavaScript object containing single property, value, which is set to the content that the user enters into the Feed form. When the Feed form is created, you can pass along this object to populate suggested text in the text box. The user can then edit this text. When the user publishes the Feed form, Facebook sets the value property to whatever text the user typed

Some tutorials about the FB.Connect.showFeedDialog method are shown hereafter :

Facebook Connect API

Posted on by

Facebook Connect is the next evolution of Facebook Platform which enables developers to integrate the power of Facebook Platform into their site. Facebook Connect was announced on 23 July 2008 at Facebook’s annual conference for developers and made available to users on 4 December 2008.

There are four ways to add social context to a private website : Identity, Friends, Social Distribution and Privacy.

At its core, Facebook Connect is an alternative means of logging into a website. The Facebook Connect Button is best placed near the standard login flow. Once a user is connected, it’s important to provide him with an indicator that they are logged in with Facebook (for example a Facebook profile pic with the Facebook favicon (“f”) in the corner). To avoid unexpected or conflicting states, it’s best to use the auto-login and auto-logout functions. The Facebook Developer Terms of Service states that an application can only store user data from Facebook for up to 24 hours to make sure that if a user changes their data, it is refreshed across the web. To obey this rule, one way is to do an API call to Facebook for data on every page load, another way is to use XFBML, a markup language that pushes data access to the client layer.

Whenever a user creates content on a website, the API allows to publish that back to Facebook. Publication actions include forum or blog posts, calendar items, photos or albums, events and wiki articles. A tutorial to create a blog that allows user comments, a trying-out and a demonstration (The Run Around) with Facebook Connect are available on the developer website. An easy way to set up a first Facebook Connect application is the comment-box.

How to add Facebook Connect to your website using Javascript or PHP are two very usefuls tutorials with sample codes and demos to start with a Facebook Connect application.

In 2006, Facebook added News Feeds and Mini-Feeds to their application. News Feed highlights information that includes profile changes, upcoming events, and birthdays, among other updates. News Feed also shows conversations taking place between the walls of a user’s friends. An integral part of the News Feed interface is the Mini-Feed, a news stream on the user’s profile page that shows updates about that user.

One line stories get their point across in a single line and appear only on the Wall on the user’s profile. Short stories are formatted with templates and allow a small amount of text with media – which can be an image, MP3, video, or a SWF file. Short stories appear in the stream in a user’s and the user’s friends’ News Feeds and on the user’s Wall.

The Wall is a space on each user’s profile page that allows friends to post messages for the user to see while displaying the time and date the message was written. One user’s wall is visible to anyone with the ability to see his or her full profile, and different users’ wall posts show up in an individual’s News Feed.

To integrate with the Feed system, you need to create a framework for the stories you want your application to tell. You create this framework through a set of templates that you register with Facebook. You combine templates in bundles, and each bundle contains one template for each story size. A template bundle tells facebook how to display the data that you are sending to a feed. An application can have multiple Template Bundles as well as supports ‘one line stories’, a slightly longer ‘short story’, and a more verbose ‘full story’. Links to referring descriptions are listed herafter :

There are three ways an application can publish to a user’s Feed :

This link shows a feed form example (smiley). Template bundles can be created at the Facebook feed link. The creation of a new Template bundle is not possible (message error that id is not valid) if the developer has no friend.

An xd_receiver.htm file is necessary for cross-domain, the included XdCommReceiver.debug.js library corrects some errors existing in teh XdCommReceiver.js library. I experienced a weird [“null” is null or not an object] Javascript error when using Facebook Connect applications with IE (versions 6, 7 and 8 ) which has also been reported by other developers (Anuragsharma). Ajennings proposes a workaround solution described in the Facebook Connect Forum. His test application is available at the shoptivate website.

On March 11, 2009, Facebook released a new home page for users.