Wednesday, May 6, 2015

Microsoft Dynamics AX 2012 – Calling SOAP Web Services from JavaScript

Microsoft Dynamics AX 2012 – Calling SOAP Web Services from JavaScript
 
Purpose: The purpose of this document is to illustrate how to call Microsoft Dynamics AX 2012 SOAP Web Services from Windows 8 application using JavaScript.
 
Challenge: Application Integration Framework (AIF) supports Web services for Windows Communication Foundation (WCF). In AIF, each document is represented by a service that can be exposed from an integration port. To consume services over the Internet, you must host services on Internet Information Services (IIS). AIF uses standard WCF processing to receive and process SOAP requests. Please find more info on AIF and Services here: https://technet.microsoft.com/en-us/library/gg731810.aspx. For the purposes of POC or app development you may need to consume Microsoft Dynamics AX 2012 SOAP Web Services from Windows 8 application using JavaScript
 
Solution: In this walkthrough I'm going to deploy an instance of Microsoft Dynamics AX 2012 R3 in the Cloud on Windows Azure using Microsoft Dynamics AX Lifecycle Management Services (LCS), write my own Custom WCF Web Service exposing business data and call this SOAP-based Web Service from Windows 8 application using JavaScript WinJS.xhr (XML Http Request) object. Please find more info about asynchronous programming, WinJS promises and xhr (XML Http Request) object here: https://msdn.microsoft.com/en-us/library/windows/apps/br229787.aspx
 
Walkthrough
 
First of all I'll deploy an instance of Microsoft Dynamics AX 2012 R3 using LCS. Please visit http://lcs.dynamics.com to access LCS Cloud service
After successful deployment I'll be able to access my Demo VM on Azure portal
What I'll need to do for my walkthrough is to enable HTTP/HTTPS endpoints for my Demo VM so I can reach out to my Web Service over internet
 
Endpoints
 
 
Please note that enabling HTTP/HTTPS endpoints for Demo VM is suitable for the purposes of POC, but it is not secure and not suitable for production applications accessing Microsoft Dynamics AX 2012. In order to build production application securely accessing Microsoft Dynamics AX 2012 please utilize Windows Azure Service Bus. Please find detailed guidance on how to leverage Windows Azure Service Bus to establish secure cross-domain connection to Microsoft Dynamics AX 2012 here: http://www.microsoft.com/en-us/download/details.aspx?id=38413
 
Continuing in this walkthrough I'll focus on mechanics of what's going on with Web Service request behind the scenes. But before we get there I'll do some necessary plumbing  
 
My plan is to expose custom business data based on newly created table. Please see the structure of my project below
 
Code
 
 
By using my simple WCF Custom Services Class Wizard (http://ax2012aifintegration.blogspot.com/2014/11/microsoft-dynamics-ax-2012-custom-web.html) I quickly created Data contract and Service contract classes to expose necessary business data
 
Data Contract
 
[DataContractAttribute]
public class AlexTableContract
{
    AlexName    Name;
    AlexID      ID;
}
[DataMemberAttribute]
public AlexID ID(AlexID _ID = ID)
{
         ID = _ID;
         return ID;
}
[DataMemberAttribute]
public AlexName Name(AlexName _Name = Name)
{
         Name = _Name;
         return Name;
}
 
Service Contract
 
public class AlexServiceContract
{
}
[AifCollectionTypeAttribute('return', Types::Class, classStr(AlexTableContract)), SysEntryPointAttribute(true)]
public List getList()
{
    AlexTable           alexTable;
 
    AlexTableContract   alexTableContract;
 
    List                list;
 
    list = new List(Types::Class);
 
    while select alexTable
    {
        alexTableContract = new AlexTableContract();
 
        alexTableContract.ID(alexTable.ID);
        alexTableContract.Name(alexTable.Name);
 
        list.addEnd(alexTableContract);
    }
 
    return list;
}
 
Then I will wrap up my classes with Microsoft Dynamics AX Service (AlexService) and execute right click > Add-ins > Register service command for AlexService

At this point I'll populate my table with a few records using Table Browser

Table browser
 
 
Next I'll create Inbound port for newly created Web Service using HTTP adapter
 
Inbound port
 
 
Then I will add AlexService.getList operation to the Web Service
 
Select service operations
 
 
As the next step I'll write a simple Windows Console client application to better understand how my Web Service request looks like behind the scenes when I call my Web Service. As I create new Windows Console application I will need to add Web Service Reference as shown below 
 
Add Service Reference
 
 
The code for the client looks like below
 
Code
 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using ConsoleApplication1.ServiceReference1;
 
namespace ConsoleApplication1
{
    class Program
    {
        static void Main(string[] args)
        {
 
            AlexServiceClient client = new AlexServiceClient();
 
            CallContext context = new CallContext();
            context.Company = "usmf";
 
            client.ClientCredentials.Windows.ClientCredential.UserName = "Admin";
            client.ClientCredentials.Windows.ClientCredential.Password = "pass@word1";
 
            AlexTableContract[] list = client.getList(context);
 
            foreach (AlexTableContract item in list)
            {
                Console.WriteLine(item.ID + ": " + item.Name);
            }
 
            Console.ReadLine();
        }
    }
}
 
As the result I'll output the list of values from my table
 
Result
 
 
Now the most interesting part. Before I ran my client program to fetch the data from Microsoft Dynamics AX 2012, I launches Fiddler to listen to HTTP/HTTPS traffic and see HTTP/HTTPS requests and responses taking place. You can download Fiddler from here: http://www.telerik.com/download/fiddler
 
Fiddler
 
 
In Fiddler I can clearly see how HTTP/HTTPS request and response looked like when I execute my client application and called Microsoft Dynamics AX 2012 Web Service
 
Request
 
 
Content-Type: text/xml; charset=utf-8
VsDebuggerCausalityData: uIDPo9P2U4sA1ENFu3GK474gpEsAAAAA7d1xyqrazUe5zAsDszpG8Js/kfbqE3NPrANxMKaGnFUACQAA
Accept-Encoding: gzip, deflate
Authorization: Negotiate TlRMTVNTUAADAAAAGAAYAHQAAABWAVYBjAAAAAAAAABYAAAACgAKAFgAAAASABIAYgAAABAAEADiAQAAFYKY4gYDgCUAAAAP4smxKQqDAj833urXTwSs6kEAZABtAGkAbgBBAFgAMgAwADEAMgBSADIAQQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAK1LD71uLVVMkxHvfFgRwwAQEAAAAAAABOi3kxVIjQAcS5+RmOrRhQAAAAAAIADgBDAE8ATgBUAE8AUwBPAAEAEgBBAFgAMgAwADEAMgBSADIAQQAEABYAYwBvAG4AdABvAHMAbwAuAGMAbwBtAAMAKgBBAFgAMgAwADEAMgBSADIAQQAuAGMAbwBuAHQAbwBzAG8ALgBjAG8AbQAFABYAYwBvAG4AdABvAHMAbwAuAGMAbwBtAAcACABOi3kxVIjQAQYABAACAAAACAAwADAAAAAAAAAAAQAAAAAgAADeJ7ljj7kKuEdzr8/a6bURMeu7wAp6EgJ5THCXwCzf3QoAEAAAAAAAAAAAAAAAAAAAAAAACQA0AEgAVABUAFAALwBhAHgAMgAwADEAMgByADIAYQAuAGMAbwBuAHQAbwBzAG8ALgBjAG8AbQAAAAAAAAAAAAAAAACX0gZZ9yPRi0zt4hbarMLO
Host: ax2012r2a.contoso.com
Content-Length: 595
Expect: 100-continue
 
<s:Envelope xmlns:s="http://schemas.xmlsoap.org/soap/envelope/"><s:Header><h:CallContext xmlns:h="http://schemas.microsoft.com/dynamics/2010/01/datacontracts" xmlns:i="http://www.w3.org/2001/XMLSchema-instance"><h:Company>usmf</h:Company><h:Language i:nil="true"/><h:LogonAsUser i:nil="true"/><h:MessageId i:nil="true"/><h:PartitionKey i:nil="true"/><h:PropertyBag i:nil="true" xmlns:a="http://schemas.microsoft.com/2003/10/Serialization/Arrays"/></h:CallContext></s:Header><s:Body><AlexServiceGetListRequest xmlns="http://schemas.microsoft.com/dynamics/2008/01/services"/></s:Body></s:Envelope>
 
 
Please note that POST method was used to call Web Service. Also appropriate envelope was added to the request
 
The response is returned in form of structured XML also wrapped with envelope

Response
 
 
<s:Envelope xmlns:s="http://schemas.xmlsoap.org/soap/envelope/"><s:Body><AlexServiceGetListResponse xmlns="http://schemas.microsoft.com/dynamics/2008/01/services"><response xmlns:b="http://schemas.datacontract.org/2004/07/Dynamics.Ax.Application" xmlns:i="http://www.w3.org/2001/XMLSchema-instance"><b:AlexTableContract><b:ID>1</b:ID><b:Name>Alex</b:Name> </b:AlexTableContract><b:AlexTableContract><b:ID>2</b:ID><b:Name>Test><b:Name> </b:AlexTableContract></response></AlexServiceGetListResponse></s:Body></s:Envelope>
 
At this point I have enough knowledge to call my Web Service from Windows 8 application using JavaScript WinJS.xhr object. WinJS is a Windows library for JavaScript which implements Windows look and feel for your apps as well as a lot of useful objects such as xhr (XML HTTP request). Please find more info about WinJS here: https://dev.windows.com/en-us/develop/winjs
 
In order to create my Windows 8 app I'll use JavaScript Hub App template as shown below
 
Hub App (Windows)
 
 
For my app I'll implement a simple HTML page List.html to display the list of records from Microsoft Dynamics AX 2012 after calling Web Service. Here's how related List.js file looks like which implements business logic calling Web Service using WinJS.xhr object 
 
List.js
 
(function () {
    "use strict";
 
    WinJS.UI.Pages.define("/pages/list/list.html", {
        // This function is called whenever a user navigates to this page. It
        // populates the page elements with the app's data.
        ready: function (element, options) {
        }
    });
 
    function doClickSync() {
 
        var data = '<s:Envelope xmlns:s="http://schemas.xmlsoap.org/soap/envelope/"><s:Header><h:CallContext xmlns:h="http://schemas.microsoft.com/dynamics/2010/01/datacontracts" xmlns:i="http://www.w3.org/2001/XMLSchema-instance"><h:Company>usmf</h:Company><h:Language i:nil="true"/><h:LogonAsUser i:nil="true"/><h:MessageId i:nil="true"/><h:PartitionKey i:nil="true"/><h:PropertyBag i:nil="true" xmlns:a="http://schemas.microsoft.com/2003/10/Serialization/Arrays"/></h:CallContext></s:Header><s:Body><AlexServiceGetListRequest xmlns="http://schemas.microsoft.com/dynamics/2008/01/services"/></s:Body></s:Envelope>';
        var options = {
            url: "http://ax2012r3-demo.cloudapp.net/MicrosoftDynamicsAXAif60/AlexWebServices/xppservice.svc",
            type: "post",
            headers: {
                "Content-Type": "text/xml; charset=utf-8",
                "SOAPAction": "http://schemas.microsoft.com/dynamics/2008/01/services/AlexService/getList"
            },
            user: 'Admin',
            password: 'pass@word1',
            data: data
        };
 
        WinJS.xhr(options)
            .done(
            function (request) {
                var dataItems = [];
                var xmlResponse = request.responseXML.documentElement;
 
                var fullNodeList = xmlResponse.getElementsByTagName("b:AlexTableContract");
 
                for (var i = 0; i < fullNodeList.length; i++) {
                    var dataItem = { id: fullNodeList[i].childNodes[0].textContent, name: fullNodeList[i].childNodes[1].textContent };
                    dataItems.push(dataItem);
                }
 
                var dataList = new WinJS.Binding.List(dataItems);
                var alexView = document.getElementById('alexList').winControl;
                alexView.itemDataSource = dataList.dataSource;
            },
            function (error) {
            },
            function (progress) {
            });
    }
 
})();
 
Please note that I included envelope and passed it as data into WinJS.xhr. Also I used post method to call Web Service, explicitly defined SOAP Action, provided authentication details as a part of request (please take into account security concerns when developing your apps, for the purposes of POC and simplicity I just hard-coded authentication details into the request). Finally when I receive asynchronous response I'll need to parse it out using XML DOM model and re-assign the data source for List element in HTML
 
As the result I successfully display the list of records from Microsoft Dynamics AX 2012 in my app
 
Result
 
 
Similarly you can implement not only data retrieval scenarios but also data manipulation scenarios calling Microsoft Dynamics AX 2012 Web Services. For example, creation of Sales order or creation/posting of General journal or Inventory journal
 
Summary: In this walkthrough I illustrated how to call Microsoft Dynamics AX 2012 SOAP Web Services from Windows 8 application using JavaScript and shed some light into what's happening behind the scenes when you call Web Service, how request and response look like and what you have to do to successfully call Microsoft Dynamics AX 2012 SOAP-based Web Services.
 
Tags: Microsoft Dynamics AX 2012, Custom Web Services, Data Contract, Service Contract, X++, Windows 8 App, JavaScript, WinJS, XHR, XML HTTP Request/Response, Fiddler.
 
Note: This document is intended for information purposes only, presented as it is with no warranties from the author. This document may be updated with more content to better outline the issues and describe the solutions.
 
Author: Alex Anikiev, PhD, MCP

30 comments:

  1. Dear Alex, great post, thx! I have one issue with the C# Console client application. Line with "TestTableContract[] list = client.getList(context);" gives error:

    Error 1: The best overloaded method match for 'TestTableService.AX.TestTableServiceClient.getList(TestTableService.AX.CallContext)' has some invalid arguments c:\users\adm_pfis\documents\visual studio 2013\Projects\TestTableService\TestTableService\Program.cs

    Error 2: Argument 1: cannot convert from 'TestTableService.AX.CallContext [c:\users\adm_pfis\documents\visual studio 2013\Projects\TestTableService\TestTableService\Service References\AX\Reference.cs(20)]' to 'TestTableService.AX.CallContext' c:\users\adm_pfis\documents\visual studio 2013\Projects\TestTableService\TestTableService\Program.cs

    Data Type for Service Reference is: System.Collections.Generic.List. Do you know what the problem could be?

    ReplyDelete
  2. A nice article here, i think that people who have grown up with the idea of using computers are showing more responsibility towards writing posts that are thoughtful, do not have grammar mistakes and pertinent to the post..

    Study Abroad Consultants in Chennai | Study in Germany Consultants in Chennai | Germany Education Consultants in Chennai

    ReplyDelete
  3. Such a great articles in my carrier, It's wonderful commands like easiest understand words of knowledge in information's.

    seo training in chennai

    ReplyDelete
  4. It is little bit confusing me and i looking forward more things from your blog. it is really very well done.

    Web Design Company in Chennai

    ReplyDelete
  5. There are many interesting information included and i can easily understand all given information.I post something on my blog to post something, or wait to post something worth saying. Keep update more information....
    Office Interiors in Chennai
    Home Interior Decorators in Chennai

    ReplyDelete
  6. hi,
    how to call Microsoft Dynamics AX 2012 – Calling SOAP Web Services from java.

    ReplyDelete
  7. Anyone here have an idea why I can't seem to get sharepoint 2013 BCS to consume data from dynamics AX 2012 r3 web services? (The article is fine, but it seems I can't access the methods within sharepoint design, they don't show up).

    ReplyDelete
  8. awesome post presented by you..your writing style is fabulous and keep update with your blogs thank you for sharing the postMicrostrategy Online Course Bangalore

    ReplyDelete
  9. Hi,
    Its really interesting post and much informative. Here anybody having idea about my following requirement.

    I have integrate AX item master details to e-commerce portal via .net application as middle ware. I need a clarification which method i can follow effectively.
    What I have done so far.
    I created a custom service as per alex post here to export the item details using list. Its working now. but here the question is they want to receive as xml file format from ax when the send request to get list . How can i achieve this in ax with effective solution for integration.

    Thanks in Advance.

    ReplyDelete
  10. Thanks for providing your information and keep share with us Azure Online Course Bangalore

    ReplyDelete
  11. Great Article… I love to read your articles because your writing style is too good, its is very very helpful for all of us and I never get bored while reading your article because, they are becomes a more and more interesting from the starting lines until the end.

    Java Training in Pune

    ReplyDelete
  12. Thank you so much for a well written, easy to understand article on this. It can get really confusing when trying to explain it – but you did a great job. Thank you!
    python training in tambaram | python training in annanagar | python training in jayanagar

    ReplyDelete
  13. Pleasant Tips..Thanks for Sharing….We keep up hands on approach at work and in the workplace, keeping our business pragmatic, which recommends we can help you with your tree clearing and pruning in an invaluable and fit way.
    Java training in Chennai | Java training in Bangalore

    Java online training | Java training in Pune

    ReplyDelete
  14. This comment has been removed by the author.

    ReplyDelete
  15. This comment has been removed by the author.

    ReplyDelete
  16. I enjoy what you guys are usually up too. This sort of clever work and coverage! Keep up the wonderful works guysl.Good going.
    apple service center chennai
    apple service center in chennai
    apple mobile service centre in chennai

    ReplyDelete
  17. You can also get alternative factors to get all these units so that you can not work properly and also deliver the results a reduced amount of resourcefully. These explanations may just be the result of writing a different surroundings to the regulate -panel. You said a different firmness place. Also, it is attainable the fact that treatment product demands extra salt so that you can relax this type of water. https://pressurewasherguides.com/how-to-fix-pressure-washer-soap-injector/

    ReplyDelete
  18. Natural Remedies easy to informed assessment of the utility of natural treatment in the administration of Benign Essential Tremor given that the greater part that have been distributed in Natural Remedies for Benign Essential Tremor and it is beneficial for Tremor disease. Therefore, the current examination intends to evaluate the viability of home grown medication medicines on essential tremor.

    ReplyDelete
  19. Get the Best Digital Marketing Training in Chennai from Infycle Technologies, the best software training institute, and Placement center in Chennai which is providing professional software courses such as Data Science, Artificial Intelligence, Cyber Security, Big Data, Java, Python, Digital Marketing, Hadoop, Selenium, Android, and iOS Development, DevOps, Oracle, etc with 100% hands-on practical training. Dial 7502633633 to get more info and a free demo and to grab the certification for having a peak rise in your career. No.1 Digital Marketing Course in Chennai | Infycle Technologies

    ReplyDelete
  20. Really cool blog. Thanks for sharing such impressive posts. Keep updating!colourist logo

    ReplyDelete