Вызов API из надстройки Word Web (Office.Js) не работает: проблема CORS?
Друзья,
Я пытаюсь вызвать API из надстройки Word и получаю ошибку "Доступ запрещен". Я провел небольшое исследование, и похоже, что причиной этого является "совместное использование ресурсов из разных источников".
1. Web API
Я размещаю Web API 2 локально в "http://localhost:61546/api/ORG_NAMES " & Я разрешил CORS принимать все исходные данные, см. ниже WebApiConfig.
public static class WebApiConfig
{
public static void Register(HttpConfiguration config)
{
// Web API configuration and services
var cors = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(cors);
// Web API routes
config.MapHttpAttributeRoutes();
config.Routes.MapHttpRoute(
name: "DefaultApi",
routeTemplate: "api/{controller}/{id}",
defaults: new { id = RouteParameter.Optional }
);
}
}
2. Тестовое Приложение
Чтобы проверить этот API, чтобы убедиться, что он поддерживает CORS, я создал ниже страницу и разместил на localhost: 52799 / home.html, я смог получить ожидаемый ответ. Я проверил это в IE 10 и Chrome.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function () {
var obj;
.support.cors = true;
$.getJSON("http://localhost:61546/api/ORG_NAMES/112233",
function (data) {
alert(data.ORG_ID);
});
});
});
</script>
</head>
<body>
<button>Click me</button>
</body>
3. Слово Надстройка
Теперь я хотел вызвать этот API из моей надстройки Word Web. Надстройка Word, запущенная с другого хоста https://localhost:44339/, см. ниже код. Здесь getJSON возвращает "Доступ запрещен".
var OrgID;
$.getJSON("http://localhost:61546/api/ORG_NAMES/112233",
function (data) {
OrgID = data.ORG_ID;
});
Кроме того, когда я вызываю API из надстройки word, это не будет fiddler.
Примечание: это проект" Web Add-ins --> Word Add-in".
4. Исправить-Нужна Помощь
Не уверен, почему я получаю ошибку "отказано в доступе" от Word-Add-In, если CORS является проблемой, то мое тестовое приложение (#2) не должно было работать, правильно ?
Я попытался вызвать JSON, используя "$.ajax", "XMLHttpRequest", но это не сработало.Возможно, мне не хватает некоторых параметров конфигурации.
Ценю любую помощь здесь. Дайте мне знать, если вам понадобится дополнительная информация.
3 ответа:
Поскольку это звучит как проблема только в надстройке Office, а не на обычной странице, вы пробовали установить свой
AppDomains
в файле манифеста? См. раздел "укажите домены, которые вы хотите открыть в окне надстройки" в https://dev.office.com/docs/add-ins/overview/add-in-manifests<?xml version="1.0" encoding="UTF-8"?> <OfficeApp xmlns="http://schemas.microsoft.com/office/appforoffice/1.1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:type="TaskPaneApp"> <Id>c6890c26-5bbb-40ed-a321-37f07909a2f0</Id> <Version>1.0</Version> <ProviderName>Contoso, Ltd</ProviderName> <DefaultLocale>en-US</DefaultLocale> <DisplayName DefaultValue="Northwind Traders Excel" /> <Description DefaultValue="Search Northwind Traders data from Excel"/> <AppDomains> <AppDomain>https://www.northwindtraders.com</AppDomain> </AppDomains> <DefaultSettings> <SourceLocation DefaultValue="https://www.contoso.com/search_app/Default.aspx" /> </DefaultSettings> <Permissions>ReadWriteDocument</Permissions> </OfficeApp>
Вам не понадобится Jsonp, если вы делаете вызовы Ajax. Вам нужно будет убедиться, что вы все запускаете с HTTPS, если он запускается в HTTP, он заблокирует этот трафик. Помните, что office-js back bone является IE и существует для; в целях безопасности api будет разрешать только HTTPS
Обновить
Помните, что надстройка office-js-это фактически два проекта, и вы должны убедиться, что ваши проекты запускаются в HTTPS. Кроме того, я бы просто посмотрел на файл манифеста и посмотрите на свой источник и убедитесь, что это точка на HTTPS
У меня была такая же проблема, используя ajax не мог позвонить web-api.NET MVC.
Сторона веб-api (сторона сервера):
- реализовать CORS в Web api, потому что excel office.js работает на другом порту и связывает прокси-объект сервера внутри excel, в то время как веб-api хранятся на другом порту, так что это так же хорошо, как иметь 2 различных домена на локальном, так что браузер автоматически блокирует запрос.
Таким образом, требуется совместное использование ресурсов из разных источников.
- включите Https для веб-API. http://csharp-video-tutorials.blogspot.com/2016/09/aspnet-web-api-enable-https.html
Клиентская сторона
Просто сделайте вызов с помощью ajax, как показано ниже. url: 'https://localhost:44319/api/Default/PostItems ' Примечание: https: обязательно требуется .
function makeAjaxCall(rangeJSON) { $.ajax({ url: 'https://localhost:44319/api/Default/PostItems', type: 'POST', data: rangeJSON, contentType: 'application/json;charset=utf-8', }).done(function (data) { console.log(data) app.showNotification(data.Status, data.Message); }).fail(function (status) { app.showNotification('Error', 'Could not communicate with the server.'); }).always(showResponse); } function exceltojson() { Excel.run(function (ctx) { var range = ctx.workbook.worksheets.getItem("Sheet1").getRange("A1:BO765"); range.load("values, numberFormat"); ctx.sync().then( function () { makeAjaxCall(JSON.stringify(range.values)); }).catch(function (error) { console.log(error); }); }); function showResponse(object) { console.log(object); $("#output").text(JSON.stringify(object,null, 4)); }