Nowadays, if a developer is building an application, there are chances that the need to access a server or web service will arise in some form or another.
Either updates or just data being transmitted over the Internet might give developers the chill merely thinking about the complexity of handling connections, data parsing, and numerous controls. With NetBeans and JavaFX, many of those headaches are no longer a problem.
In this recipe, we will connect our application to Facebook and retrieve some data from the news feed and profile.
To continue with this recipe, NetBeans and the plugins set of JavaFX must be installed.
Also, a JavaFX Desktop Business Application project must be created or imported. We will use the project created in the previous recipe.
If unsure how to proceed in any of these steps, take a look at Creating a JavaFX Project and Build UI with NetBeans JavaFX Composer recipes in this chapter to find all of the information required.
From Facebook we will need to access the following links:
http://developers.facebook.com/docs/reference/rest/status.get/
http://developers.facebook.com/docs/reference/rest/stream.get/
The above links lead to the Facebook REST (Representational State Transfer) API. REST is an architectural style which is built on top of HTTP and XML, where an application will be responsible for reading and parsing data from the provided XML.
On both pages, find the Test Console and click on:
https://api.facebook.com/method/stream.get?
access_token=...
And
https://api.facebook.com/method/status.get?
access_token=...
Below is a screenshot of what you will find in Facebook's developer page and where to click:
New windows will open, displaying the URLs that are going to be used to fetch the information. Copy both the URLs somewhere and keep them for later.
Both windows will provide the user with the access tokens for the information being requested. In our example, the tokens are valid for both status and stream from Facebook.
Note that some browsers might not properly display the above URLs; instead, they ask the user to download a file. If that is the case, please use another browser to check the link properly.
With all of the settings and projects in place, let's continue.
Following are the steps on how to add an HTTP Data Source for Facebook status message.
With the JavaFXApp project open:
- Navigate to the Palette and on the Data Sources subsection, drag-and-drop an HTTP Data Source.
- Copy the
status.gettoken generated by Facebook. (We will use it shortly). - Configure the Data Source Customizer dialog as shown in the following screenshot:
- Click on Fetch Data (bear in mind that the Facebook username is the user's e-mail).
- Expand the aRecordSet, then expand aRecord, select message, and click the Add button.
- The input dialog pops up asking for Filter Expression. Leave the default and press OK.
- Back on the Data Source Customizer, click OK.
Now we add an HTTP Data Source for Facebook News Stream:
- Navigate to the Palette and drag-and-drop another HTTP Data Source.
- This time, copy the
stream.gettoken. - Expand the aRecordSet, then expand aRecord, select the posts node, and click the Add button.
- The input dialog pops up asking for Filter Expression. Leave the default and press OK.
- Back on the Data Source Customizer, click OK.
To bind a HTTP Source to the correct List Views Profile:
- In the Navigator window, expand Design File, then expand scene, and select listView.
- Then in the Properties window, click on the Items button.
- On the top-right corner of the new pop-up, click on Bind.
- Under Components, select httpDataSource["message"].
- Under Properties, select All Records.
- After following these steps, the List View Binding dialog will look like this:
- Back in the Properties window, we need to add a Cell Factory.
- Click on the green plus sign related to the Cell Factory.
- In the Properties window, click on the Text button and clear the text under Bind.
- Then, under Components, select listCell.
- Under Properties, select item.
- Under Converters, select Record.
- Append to the following code to the end of the bind text:
.getString("message") - Click close.
We will then bind the HTTP Source to the correct List Views Status:
- In the Navigator window, expand the Design File, then expand scene, and select listView2.
- Then, on the Properties window, click on the items button.
- On the top-right corner of the new pop-up, click on Bind.
- Under Components, select httpDataSource2["posts"].
- Under Properties, select All Records.
- Under Converters, select Record[] | String [].
- Append the following code to the end of the bind text:
for(record in httpdataSource2.getDataSource("posts/message").getRecordSet().all()) record.getString("name") - Click on Close.
Save the file and click on Run the Main Project.
Facebook allows developers to access information through their RESTful API. To access that information, we will need to implement the HTTP Data Source, configured to parse a JSON feed.
After configuring the Data Source Customizer, it is very useful to click on Fetch Data. This way we know that the connection between the Data Source and Facebook is working.
NetBeans makes it very easy to bind JavaFX components by simply clicking a few buttons. Through the Binder, it is possible to attach our HTTP Data Sources to the list views, and choose which kind of format we will be displaying the information in.