SharePoint Online Add-in SharePoint-Host with Rest API

SharePoint Online Add-in SharePoint-Host with Rest API

App.JS

'use strict';

$(document).ready(function () {

    var hostweburl;

    var appweburl;

    var listTitle = "MyTestList";

    //The SharePoint site where an App is installed

    hostweburl = decodeURIComponent(getQueryStringParameter('SPHostUrl'));

    //The location within the site where an App will be deployed

    appweburl = decodeURIComponent(getQueryStringParameter('SPAppWebUrl'));

    // resource URLs in the form: web_url/_layouts/15/resource

    var scriptbase = hostweburl + "/_layouts/15/";

    $.getScript(scriptbase + "SP.RequestExecutor.js", execCrossDomainRequest);

    // Use cross-domain library to interact with more than one domain

    //Your remote add-in page through a proxy

    function execCrossDomainRequest() {

        var executor = new SP.RequestExecutor(appweburl);

    }

    $("#btnGet").click(function () {

        var executor = new SP.RequestExecutor(appweburl);

        // Url: appweburl + "/_api/SP.AppContextSite(@target)/web/lists/getbytitle('" + listTitle + "')/Items?@target='"+hostweburl + "'"

        //      appweburl: ...rkco-b00770cf5fd946.sharepoint.com/sites/dev/REST/      

       

        executor.executeAsync(

            {

                url: appweburl + "/_api/SP.AppContextSite(@target)/web/lists/getbytitle('" + listTitle + "')/Items?@target='"

                    + hostweburl + "'",

                method: "GET",

                headers: { "Accept": "application/json; odata=verbose" },

                success: successFun,

                error: errorFun

            }

        );

    });

});

function successFun(data) {

    $("#message").hide();

    var jsonObject = JSON.parse(data.body);

    var moviesHTML = "";

    var results = jsonObject.d.results;

    for (var i = 0; i < results.length; i++) {

        moviesHTML = moviesHTML + "<p><h3>" + results[i].Title + "</p><hr>";

    }

    document.getElementById("resultDiv").innerHTML = moviesHTML;

}

function errorFun(error) {

    $("#resultDiv").append(error.statusText)

}

//function to get a Host and App Url

function getQueryStringParameter(urlParameterKey) {

    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] == urlParameterKey)

            return decodeURIComponent(singleParam[1]);

    }

}

Note: Provide permissions to the list is Read at AppManifest.xml (Based on your need)

Default.Aspx:

<asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">

  

    <div>

        <input id="btnGet" type="button" value="Show MyList Titles" />

    </div>

    <div id="resultDiv">

    </div>

    <div>

        <p id="message">

            <!-- The following content will be replaced with the user name when you run the app - see App.js -->

            initializing...

        </p>

    </div>

</asp:Content>