icon-arrow icon-check icon-mail icon-phone icon-facebook icon-linkedin icon-youtube icon-twitter icon-cheveron icon-download icon-instagram play close close icon-arrow-uturn icon-calendar icon-clock icon-search icon-chevron-process icon-skills icon-knowledge icon-kite icon-education icon-languages icon-tools icon-experience icon-coffee-cup
Werken bij Integration & Application Talents
Blog 22/03/2016

Storing photos in the database through REST service from an Oracle JET 2.0 hybrid mobile app

Car crash

In my previous post I made a mobile hybrid application with Google Maps integration. Now let’s go a step further.

An insurance company want’s that their customers can submit a damage immediately in case of an accident. A customer can download an app and install it on their device. When the customer is involved in an accident, he or she can open the app, enter some data and take pictures of the accident. Then the customer can send the data to the insurance company.
The app is created in Oracle JET 2.0. The app sends the data to an OSB-process that is exposed as REST. The OSB sends the data to a SOA Suite process that inserts the data in a database.

I created a mobile hybrid application with Oracle JET 2.0. A screenshot is shown below:

Mobile Hybrid 1

The customer can enter their licenseplate in the app. The date and time of the accident can be filled. The latitude and longitude is determined of the location where the customer enters the data. Then the customer can enter a damage description and take a picture of the damaged car. When everything is filled in correctly, the customer can send the data to the insurance company.

How to add the location I described in a previous post. To add the camera functionality, add the cordova camera plugin to your JET 2.0 project.

cordova plugin add cordova-plugin-camera

Then add the implementation of the plugin:

navigator.camera.cleanup(onSuccessClean, onFailClean);
            navigator.camera.getPicture(onSuccessCamera, onFailCamera, {
                quality: 100,
                destinationType: Camera.DestinationType.DATA_URL,
                correctOrientation: true

First the images will be cleaned that are stored in the tempory storage location.
Then getPicture opens the devices camera and the user can take a picture.

When there is no error the function onSuccessCamera is called:

var onSuccessCamera = function (imageData) {
                            var image = document.getElementById('picture');
                            image.src = 'data:image/jpeg;base64,' + imageData;
                            image.style.margin = "10px";
                            image.style.display = "block";
                            self.image = imageData;

The variable imageData is of type base64binary.

So when the user pushes the “Send” Button a JSON string is generated:

var inputdata = {
                'LicensePlate': self.licenseplateValue,
                'DateTime': self.dateTimeValue,
                'Latitude': self.latitudeValue,
                'Longitude': self.longitudeValue,
                'DamageDescripition': self.descriptionValue,
                'Picture': self.image

This JSON string is sent to the exposed REST service of the OSB-process.

To connect the JET application to the OSB Middleware I created a simple service. The exposed service is of type REST. This is the design view of the OSB-process:

Mobile Hybrid 2

This is the designview of the SOA Suite process. In the BPEL-process there is an Assign with the mapping to the database adapter.

Database adapter

So when a customer submit’s a car damage, then the data is sent from the device via the REST service to the OSB.
In the Enterprise Manager you can see the request and response of the instance:

Enterprise Manager

And when you open the Enterprise Manager for soa-infra, you see the flow instance:


When opening the instance you see the flow details:

flow details

And the final step is to query the database, and you see the submitted damage:

database queue

Geen reacties

Geef jouw mening

Reactie plaatsen

Reactie toevoegen

Jouw e-mailadres wordt niet openbaar gemaakt.


  • Geen HTML toegestaan.
  • Regels en alinea's worden automatisch gesplitst.
  • Web- en e-mailadressen worden automatisch naar links omgezet.

Wil je deel uitmaken van een groep gedreven en ambitieuze experts? Stuur ons jouw cv!