JSONP implementation

, ,
1

I have been working on JSONP implementation on webMethods 9.5 and im not able to set and use authorization header in my AJAX call. In the browser it throws a pop up asking for the Authorization. I have developed the project on MWS as dynamic web project.

It was very tricky to implement JSONP and make it work. Here is what i did.

  1. Created a normal flow service which give JSON string.
  2. Created another flow service that pads the data with function body i.e JSON with padding equals JSONP
    Ex: callback(‘+json data from the flow service+’);
  3. Now to implement CORS i had to set the Access-Control-Allow-Origin header to the host name of MWS server which is installed another server and set the response content type as “application/javascript”.

Now the problem is if i try to connect the http service like mentioned below, I get a pop up to provide the user id and password. I have set the setRequestHeader explicitly to make sure it is used.

Code:
$.ajax({
type: ‘GET’,
beforeSend:function setHeader(xhr) {
xhr.setRequestHeader(“Authorization”, “Basic " + btoa(“kikad”+ “:” +“condra06a”));
},
url: “http://Host_name:5555/invoke/test1/getData”,
dataType: “jsonp”,
jsonpCallback:“callback”}).done(function(results){ $(‘#para’).html(”

“+results.name+”

");
});

My code works if i provide the user id and password in the pop up.

Is anybody venturing to implement JSONP in a dynamic web application on MWS ? So that we can pick our brains in trying to understand the problem.

br,
Kiran

2

Is that javascript using jquery?

I haven’t tried this, but if so, then jQuery (1.7.2+) includes a username and password attribute

For example:

$.ajax({
type: ‘GET’,
username: ‘kikad’,
password: ‘contra06a’,
url: “http://Host_name:5555/invoke/test1/getData”,
dataType: “jsonp”,
jsonpCallback:“callback”}).done(function(results){ $(‘#para’).html(“

”+results.name+“

”);
});

Or if you prefer to pre-emptively send the Authorization header, perhaps something like this:

$.ajax({
type: ‘GET’,
headers: {
“Authorization”: "Basic " + btoa(“kikad”+ “:” +“condra06a”)
},
url: “http://Host_name:5555/invoke/test1/getData”,
dataType: “jsonp”,
jsonpCallback:“callback”}).done(function(results){ $(‘#para’).html(“

”+results.name+“

”);
});

3

Hi Eric,

You are right it is JQuery in my Javascript function. Im using this in my page header

I have tried the latest JQuery code also.

The Username and password attribute is available in JQuery but here is the problem,If i use these attribute the browser prompts me to provide the user id and password.
This user id and password should be ecoded to base64 and then sent in the Authorization header to IS. It looks something like this : “Authorization”:“Basic QWRtaW5pc3RyYXRvcjptYW5hZ2U=”(Administrator:manage).

Hence i tried to set this header explicitly using the beforeSend attribute of JQuery.
$.ajax({
type: ‘GET’,
beforeSend: function (xhr) {
xhr.setRequestHeader (“Authorization”, “Basic " + btoa(“kikad”+”:“+“condra06a”));
},
url: “http://ptseelm-lx4432.ikeadt.com:5555/invoke/test1/getData”,
dataType: “jsonp”,
jsonpCallback:“callback”}).done(function(results){ $(‘#para’).html(”

“+results.name+”

");
});

I also tried the one you mentioned too. but no luck in sending the authorization header.

I tried to change the ACL of my service in IS to annonymous and then access it no matter what the user id and password i mention it will run.

I think it is something to do with the ACL i need to set the right ACL to my IS service that allows to send this Authorization header or i have to setup https that seems like the best way to do it !

br,
Kiran