No header "Access-Control-Allow-Origin"

I have an MVC application deployed to Azure that was built as part of a SharePoint (Host-Host) application for a SharePoint Online site. All tenant IDs and Secret ID are set correctly on the SharePoint site and Azure Web App.

The app is detaching from the SharePoint host, but the JSOM logic throws a No 'Access-Control-Allow-Origin' header exception when it runs this simple JS logic ...

<script type="text/javascript">
    var hostweburl;

    // Load the required SharePoint libraries.
    $(document).ready(function () {

        // Get the URI decoded URLs.
        hostweburl =
            decodeURIComponent(
                getQueryStringParameter("SPHostUrl")
        );

        // The js files are in a URL in the form:
        // web_url/_layouts/15/resource_file
        var scriptbase = hostweburl + "/_layouts/15/";

        // Load the js files and continue to
        // the execOperation function.
        $.getScript(scriptbase + "SP.Runtime.js",
            function () {
                $.getScript(scriptbase + "SP.js", execOperation);
            }
        );
    });

    // Function to execute basic operations.
    function execOperation() {

        // Continue your program flow here.
        hostweburl =
           decodeURIComponent(
               getQueryStringParameter("SPHostUrl")
       );
        retrieveWebSite(hostweburl);

    }

    // Function to retrieve a query string value.
    // For production purposes you may want to use
    // a library to handle the query string.
    function getQueryStringParameter(paramToRetrieve) {
        var params =
            document.URL.split("?")[1].split("&");
        var strParams = "";
        for (var i = 0; i < params.length; i = i + 1) {
            var singleParam = params[i].split("=");
            if (singleParam[0] == paramToRetrieve)
                return singleParam[1];
        }
    }


    function retrieveWebSite(siteUrl) {
        var clientContext = new SP.ClientContext(siteUrl);
        this.oWebsite = clientContext.get_web();

        clientContext.load(this.oWebsite);

        clientContext.executeQueryAsync(
            Function.createDelegate(this, this.onQuerySucceeded),
            Function.createDelegate(this, this.onQueryFailed)
        );
    }

    function onQuerySucceeded(sender, args) {
        alert('Title: ' + this.oWebsite.get_title() +
            ' Description: ' + this.oWebsite.get_description());
    }

    function onQueryFailed(sender, args) {
        alert('Request failed. ' + args.get_message() +
            '\n' + args.get_stackTrace());
    }

</script>
      

Run codeHide result


An exception occurs in the retrieveWebSite function when trying to retrieve the Client Context for the site ...

        var clientContext = new SP.ClientContext(siteUrl);

      

The exception is the following ...

XMLHttpRequest cannot load https://mySharePointSiteName.sharepoint.com/sites/Apps/_api/contextinfo . The requested resource does not have an "Access-Control-Allow-Origin" header. Origin ' https://myWebSiteName.azurewebsites.net ' is therefore not allowed.

I thought all the IFrames stuff would take care of this?

+3


source to share


1 answer


You need to use SP.RequestExecutor like this:



http://blogs.msdn.com/b/officeapps/archive/2012/11/29/solving-cross-domain-problems-in-apps-for-sharepoint.aspx

+2


source







All Articles