Jquery 从Outlook邮件加载项调用Web服务

Jquery 从Outlook邮件加载项调用Web服务,jquery,ajax,rest,office-addins,office-js,Jquery,Ajax,Rest,Office Addins,Office Js,我有点被Outlook邮件加载项的一个问题所困扰。 我使用的是Office 365开发人员帐户,邮件加载项将在该帐户中显示(在线,在浏览器中): 我想在单击按钮时调用REST Web服务 首先,让我发布我的HTML: <html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=Edge" /> <title

我有点被Outlook邮件加载项的一个问题所困扰。 我使用的是Office 365开发人员帐户,邮件加载项将在该帐户中显示(在线,在浏览器中):

我想在单击按钮时调用REST Web服务

首先,让我发布我的HTML:

<html>
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <title></title>
    <script src="../../Scripts/jquery-1.9.1.js" type="text/javascript"></script>

    <link href="../../Content/Office.css" rel="stylesheet" type="text/css" />
    <script src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js" type="text/javascript"></script>

    <!-- To enable offline debugging using a local reference to Office.js, use:                        -->
    <!-- <script src="../../Scripts/Office/MicrosoftAjax.js" type="text/javascript"></script>  -->
    <!-- <script src="../../Scripts/Office/1.1/office.js" type="text/javascript"></script>  -->

    <link href="../App.css" rel="stylesheet" type="text/css" />
    <script src="../App.js" type="text/javascript"></script>

    <link href="Home.css" rel="stylesheet" type="text/css" />
    <script src="Home.js" type="text/javascript"></script>
</head>
<body>
    <!--Header and Footer tags not supported-->
    <div id="content-main">
        Click this button to test the create method
        <br />
        <label id="lblMessage">Message will appear here</label>
        <button id="btnTest" type="button">Perform Test Create</button>

        <!--<iframe id="my_api_iframe"></iframe>-->
    </div>
</body>
</html>
我尝试过不同的方法来做到这一点。单击按钮时,它将调用指定的函数,以下是我尝试过的几种方法:

function GetList() {
        jQuery.support.cors = true;
        $.ajax({
            type: "GET",
            url: [URL to WebMethod],
            success: function (data, textStatus) {
                $('#lblMessage').text("Success");
            },
            error: function (xhr, textStatus, errorThrown) {
                $('#lblMessage').text("Error: " + errorThrown + " StatusCode: " + textStatus + " XHR: " + xhr.readyState);
            }
        });
    }
但是,当单击按钮并调用此函数时,我得到的错误是:

我尝试的第二个功能:

function GetList2() {
        $.ajax({
            type: "GET",
            url: [URL to WebMethod], xhr: function () {
                return new ($('#my_api_iframe')[0].contentWindow.XMLHttpRequest)();
            }, success: function (html) {
                // format and output result
                $('#lblMessage').text(html);
            }, error: function (xhr, textStatus, errorThrown) {
                // format and output result
                $('#lblMessage').text(errorThrown);
            }
        });
    }
function getTokenCallback(asyncResult) {
        var token = asyncResult.value;

        // Create a web service call and pass the token as part of the call.
        _xhr = new XMLHttpRequest();
        _xhr.open("GET", [URL to WebService]);
        _xhr.setRequestHeader("Content-Type", "application/xml; charset=utf-8");
        _xhr.onreadystatechange = readyStateChange;

        var request = new Object();
        request.token = token;
        request.
        request.phoneNumbers = _om.get_item().getEntities().phoneNumbers;

        _xhr.send(JSON.stringify(request));
    }
但是没有用。这是我得到的错误:

我尝试的最后一个函数:

function GetList2() {
        $.ajax({
            type: "GET",
            url: [URL to WebMethod], xhr: function () {
                return new ($('#my_api_iframe')[0].contentWindow.XMLHttpRequest)();
            }, success: function (html) {
                // format and output result
                $('#lblMessage').text(html);
            }, error: function (xhr, textStatus, errorThrown) {
                // format and output result
                $('#lblMessage').text(errorThrown);
            }
        });
    }
function getTokenCallback(asyncResult) {
        var token = asyncResult.value;

        // Create a web service call and pass the token as part of the call.
        _xhr = new XMLHttpRequest();
        _xhr.open("GET", [URL to WebService]);
        _xhr.setRequestHeader("Content-Type", "application/xml; charset=utf-8");
        _xhr.onreadystatechange = readyStateChange;

        var request = new Object();
        request.token = token;
        request.
        request.phoneNumbers = _om.get_item().getEntities().phoneNumbers;

        _xhr.send(JSON.stringify(request));
    }
但在执行xhr.open()时,我得到了与以前相同的“拒绝访问”错误

有谁能帮我找到正确的方向,让这些REST服务打电话来?它们都以XML格式返回数据,这就是为什么我使用“application/XML”的ContentType


任何帮助都将不胜感激,即使这与我尝试的方式完全不同:)。

您的
iframe
HTML元素将被注释掉。尝试取消注释它。至少这就是GetList2()失败的原因

所以改变

<!--<iframe id="my_api_iframe"></iframe>-->



您是否正在提出CORS请求?换句话说,REST服务是否与您的页面位于同一来源?如果它位于不同的域中,并且您不能(或不想)使用CORS,则始终可以执行服务器端处理来取回文件。然后将它作为XML或JSON对象从服务器提供给javascript(在同一个域上)。请参阅@Gab Royer-否,外接程序在office365.com上运行,我要访问的服务位于localhost上。@Michael Zlatkovsky-我无法向项目中添加任何可以处理服务器端内容的web表单或其他内容。这是一个Office Mail加载项。显然,它只允许HTML、JS和CSSC创建web服务项目来补充Mail App项目,如本例所示: