2

This is my code

function getListItem(url, listname, id, complete, failure) {
    // Getting our list items
    $.ajax({
        url: url + "/_api/lists/getbytitle('"+ listname +"')/items",
        method: "GET",
        headers: { "Accept": "application/json; odata=verbose" },
        success: function (data) {
            // Returning the results
            complete(data);
        },
        error: function (data) {
            failure(data);
        }
    });
};

The url is coming correctly, also on checkng the full url parameter in ajax call, it is returning data when i open that in new tab

But since this ajax call is made inside a sharepoint app that is in a different domain, its throwing an error - No 'Access-Control-Allow-Origin' header is present on the requested resource

What change should i make in my site to make that list available for cross domain call.

Info: the site url is http://www.vignesh.cloudappsportal.com/ The app url is xxxx.apps.cloudappsportal.net/CloudAppsTrial/Pages/Default.aspx

3

Cross domain calls are blocked by modern web browsers due to security concerns. To get round this you can use the SP.RequestExecutor.js script to relay messages to SharePoint from within the same domain.

Example

function getListItem(hostUrl,appWebUrl, listTitle,itemId,success,error) 
{
    var url = appWebUrl + "/_api/SP.AppContextSite(@target)/web/lists/getbytitle('" + listTitle + "')/items(" + itemId + ")?@target='" + hostUrl + "'";
    var executor = new SP.RequestExecutor(appWebUrl);
    executor.executeAsync(
        {
           url: url,
           method: "GET",
           headers: { "Accept": "application/json; odata=verbose" },
           success: function (data) {
                var results = eval(JSON.parse(data.body));
                success(results);
           },
           error: error
       });
}

Usage

var appWebUrl,hostUrl;
var params = document.URL.split("?")[1].split("&");
for (var i = 0; i < params.length; i = i + 1) {
     var param = params[i].split("=");
     switch (param[0]) {
        case"SPAppWebUrl":
          appWebUrl = decodeURIComponent(param[1]);
            break;
        case"SPHostUrl":
          hostUrl = decodeURIComponent(param[1]);
           break;
     }
}

$.getScript(hostUrl + "/_Layouts/15/SP.RequestExecutor.js", function (data) {

   getListItem(hostUrl,appWebUrl, 'Tasks',1,function(data){
       console.log(data); 
   },
   function(error){
      //error handling goes here.. 
   });

});
1

This looks like a typical Same-Origin-Policy issue that may be solved configuring CORS on the remote server, and may be worked around proxying the communication between your server and the remote server: put some piece of software in your server that performs the real requests to the remote server. This way, all the calls from your browser will be to the local server, who performs the target call.
Unfortunately these are not very straigthforward solutions.
In the first case you need to modify server configuration, which is not always possible.
In the second case you could have some problems with authentication forwarding.
Please search for CORS or Same-Origin-Policy as this is a quite common issue. HTH

1

A sharepoint app essentially exists in a domain. So you need to either use SP.RequestExecutor.js or use SP.AppContextSite

This is the structure of the URL if using SP.AppContextSite

var url = appwebUrl + "/_api/SP.AppContextSite(@target)/web/lists/getbytitle('"+listName+"')/items?$select=Title,ID&@target='" + hostUrl + "'";

This is the general structure of the call if Uisng SP.RequestExecutor.js

var scriptbase = hostUrl + "/_layouts/15/";
        $.getScript(scriptbase + "SP.RequestExecutor.js", function () {

            var url =  appwebUrl +
                      "/_api/SP.AppContextSite(@target)/web/lists/getbytitle('" + listName + "')/items?$select=Title,ID&@target='" + hostUrl + "'";


            var executor = new SP.RequestExecutor(appwebUrl);
            executor.executeAsync(
            {
                url:     url,
                method:  "POST",
                headers: { "Accept": "application/json; odata=verbose", "content-type": "application/json; odata=verbose"},
                success: function () {alert('success')},
                error:   function(){alert("error");
            }

You need to get hostUrl and webUrl from the querystring using string operations.

Source : MSDN Rest Reference

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.