Запрос данных в удаленной службе с помощью веб-прокси в SharePoint
При создании надстроек SharePoint обычно необходимо объединять данные из различных источников. Из соображений безопасности связь между доменами блокируется. Если вы используете веб-прокси, веб-страницам в надстройке доступны данные в удаленном домене и домене SharePoint.
Разработчики могут использовать веб-прокси, предоставляемый в клиентских объектных моделях JavaScript и .NET. При использовании веб-прокси вы передаете запрос инициализации в SharePoint. SharePoint в свою очередь запрашивает данные в определенной конечной точке и передает ответ обратно на вашу страницу.
Используйте веб-прокси, если нужно, чтобы связь осуществлялась на уровне сервера. Дополнительные сведения см. в статье Безопасный доступ к данным и клиентские объектные модели для надстроек SharePoint.
Веб-прокси SharePoint — это посредник между вашим кодом и внешним источником данных
Что необходимо для использования примеров в этой статье
Для выполнения действий, описанных в этом примере, вам потребуется следующее:
Visual Studio 2015 и Инструменты разработчика Microsoft Office последней версии
Среда разработки SharePoint (для локальных сценариев необходимо изолировать надстройку).
Ключевые понятия, с которыми необходимо ознакомиться до использования веб-прокси
Ниже перечислены полезные статьи, в которых описано, как запрашивать данные для надстроек SharePoint из удаленного домена.
Название статьи | Описание |
---|---|
Надстройки SharePoint | Сведения о новой модели надстроек в SharePoint, с помощью которой можно создавать небольшие и удобные в использовании надстройки для пользователей. |
Безопасный доступ к данным и клиентские объектные модели для надстроек SharePoint | Узнайте о вариантах доступа к данным в надстройках SharePoint. В этой статье представлена информация о вариантах работы с данными в надстройке. |
Хост-сайты, сайты надстроек и компоненты SharePoint в SharePoint | Узнайте, в чем разница между хост-сайтами и сайтами надстроек. Узнайте, какие компоненты SharePoint можно включать в надстройку для SharePoint, какие компоненты разворачиваются на хост-сайте, какие компоненты разворачиваются на сайте надстройки, и как выполняется развертывание сайта надстройки в изолированном домене. |
Междоменная безопасность на стороне клиента | Ознакомьтесь с междоменными угрозами, случаями использования и принципами безопасности для междоменных запросов, а также оцените риски для разработчиков, возникающие при расширении междоменного доступа из веб-приложений, которые запускаются в браузере. |
Пример кода: доступ к данным в удаленной службе с помощью веб-прокси
Чтобы прочитать данные из удаленной службы, необходимо выполнить указанные ниже действия.
Создайте проект надстройки для SharePoint.
Измените страницу Default.aspx, чтобы использовать веб-прокси для запроса удаленной службы.
Измените манифест надстройки, чтобы разрешить связь с удаленным доменом.
На следующем рисунке показано окно браузера с данными из удаленной службы на веб-странице SharePoint.
Веб-страница SharePoint с данными из удаленной службы
Создание проекта надстройки SharePoint
Откройте Visual Studio 2015 от имени администратора. Для этого щелкните правой кнопкой мыши значок Visual Studio 2015 в меню Пуск и выберите Запуск от имени администратора.
Создайте новый проект с помощью шаблона Надстройка SharePoint.
На следующем рисунке показано расположение шаблона Надстройка SharePoint в 2015: Шаблоны>Visual C#>Office/SharePoint>Надстройки Office.
Шаблон надстройки SharePoint в Visual Studio
Укажите URL-адрес веб-сайта SharePoint, который планируется использовать для отладки.
Выберите SharePoint-hosted (Размещение в SharePoint) в качестве варианта размещения надстройки.
Изменение страницы Default.aspx для использования веб-прокси с помощью объектной модели JavaScript
Дважды щелкните страницу Default.aspx в папке Страницы.
Скопируйте следующую разметку и вставьте ее в тег содержимого PlaceHolderMain страницы. Разметка выполняет следующие задачи:
Предоставление заполнителя для удаленных данных.
Создание ссылки на файлы JavaScript в SharePoint.
Подготовка запроса с объектом WebRequestInfo.
Подготовка заголовка запроса Accept для указания ответа в формате Нотация объектов JavaScript (JSON).
Отправка вызова удаленной конечной точке.
Обработка успешного выполнения с отображением удаленных данных на веб-странице SharePoint.
Обработка любых ошибок с отображением сообщения об ошибке на веб-странице SharePoint.
Categories from the Northwind database exposed as an OData service: <!-- Placeholder for the remote content --> <span id="categories"></span> <!-- Add references to the JavaScript libraries. --> <script type="text/javascript" src="../_layouts/15/SP.Runtime.js"> </script> <script type="text/javascript" src="../_layouts/15/SP.js"> </script> <script type="text/javascript"> (function () { "use strict"; // Prepare the request to an OData source // using the GET verb. var context = SP.ClientContext.get_current(); var request = new SP.WebRequestInfo(); request.set_url( "http://services.odata.org/Northwind/Northwind.svc/Categories" ); request.set_method("GET"); // We need the response formatted as JSON. request.set_headers({ "Accept": "application/json;odata=verbose" }); var response = SP.WebProxy.invoke(context, request); // Let users know that there is some // processing going on. document.getElementById("categories").innerHTML = "<P>Loading categories...</P>"; // Set the event handlers and invoke the request. context.executeQueryAsync(successHandler, errorHandler); // Event handler for the success event. // Get the totalResults node in the response. // Render the value in the placeholder. function successHandler() { // Check for status code == 200 // Some other status codes, such as 302 redirect // do not trigger the errorHandler. if (response.get_statusCode() == 200) { var categories; var output; // Load the OData source from the response. categories = JSON.parse(response.get_body()); // Extract the CategoryName and Description // from each result in the response. // Build the output as a list. output = "<UL>"; for (var i = 0; i < categories.d.results.length; i++) { var categoryName; var description; categoryName = categories.d.results[i].CategoryName; description = categories.d.results[i].Description; output += "<LI>" + categoryName + ":&nbsp;" + description + "</LI>"; } output += "</UL>"; document.getElementById("categories").innerHTML = output; } else { var errordesc; errordesc = "<P>Status code: " + response.get_statusCode() + "<br/>"; errordesc += response.get_body(); document.getElementById("categories").innerHTML = errordesc; } } // Event handler for the error event. // Render the response body in the placeholder. // The body includes the error message. function errorHandler() { document.getElementById("categories").innerHTML = response.get_body(); } })(); </script>
(Необязательно) Изменение страницы Default.aspx для использования веб-прокси с помощью конечной точки REST
Дважды щелкните страницу Default.aspx в папке Страницы.
Скопируйте следующую разметку и вставьте ее в тег содержимого PlaceHolderMain страницы. Разметка выполняет следующие задачи:
Предоставление заполнителя для удаленных данных.
Обращение к библиотеке jQuery.
Подготовка запроса к конечной точке SP.WebRequest.Invoke.
Подготовка текста запроса с объектом SP.WebrequestInfo. Он включает заголовок Accept для указания ответа в формате Нотация объектов JavaScript (JSON).
Отправка вызова удаленной конечной точке.
Обработка успешного выполнения с отображением удаленных данных на веб-странице SharePoint.
Обработка любых ошибок с отображением сообщения об ошибке на веб-странице SharePoint.
Categories from the Northwind database exposed as an OData service: <!-- Placeholder for the remote content --> <span id="categories"></span> <script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.min.js"> </script> <script type="text/javascript"> (function () { "use strict"; // The Northwind categories endpoint. var url = "http://services.odata.org/Northwind/Northwind.svc/Categories"; // Let users know that there is some // processing going on. document.getElementById("categories").innerHTML = "<P>Loading categories...</P>"; // Issue a POST request to the SP.WebProxy.Invoke endpoint. // The body has the information to issue a GET request // to the Northwind service. $.ajax({ url: "../_api/SP.WebProxy.invoke", type: "POST", data: JSON.stringify( { "requestInfo": { "__metadata": { "type": "SP.WebRequestInfo" }, "Url": url, "Method": "GET", "Headers": { "results": [{ "__metadata": { "type": "SP.KeyValue" }, "Key": "Accept", "Value": "application/json;odata=verbose", "ValueType": "Edm.String" }] } } }), headers: { "Accept": "application/json;odata=verbose", "Content-Type": "application/json;odata=verbose", "X-RequestDigest": $("#__REQUESTDIGEST").val() }, success: successHandler, error: errorHandler }); // Event handler for the success event. // Get the totalResults node in the response. // Render the value in the placeholder. function successHandler(data) { // Check for status code == 200 // Some other status codes, such as 302 redirect, // do not trigger the errorHandler. if (data.d.Invoke.StatusCode == 200) { var categories; var output; // Load the OData source from the response. categories = JSON.parse(data.d.Invoke.Body); // Extract the CategoryName and Description // from each result in the response. // Build the output as a list output = "<UL>"; for (var i = 0; i < categories.d.results.length; i++) { var categoryName; var description; categoryName = categories.d.results[i].CategoryName; description = categories.d.results[i].Description; output += "<LI>" + categoryName + ":&nbsp;" + description + "</LI>"; } output += "</UL>"; document.getElementById("categories").innerHTML = output; } else { var errordesc; errordesc = "<P>Status code: " + data.d.Invoke.StatusCode + "<br/>"; errordesc += response.get_body(); document.getElementById("categories").innerHTML = errordesc; } } // Event handler for the error event. // Render the response body in the placeholder. // The 2nd argument includes the error message. function errorHandler() { document.getElementById("categories").innerHTML = arguments[2]; } })(); </script>
Изменение файла манифеста надстройки
В обозревателе решений откройте контекстное меню файла AppManifest.xml и выберите Просмотреть код.
Скопируйте следующее определение RemoteEndPoints в качестве дочернего элемента узла App.
<RemoteEndpoints> <RemoteEndpoint Url=" http://services.odata.org" /> </RemoteEndpoints>
Элемент RemoteEndpoint используется для указания удаленного домена. Веб-прокси проверяет, объявлены ли запросы к удаленным доменам в манифесте надстройки. Вы можете создать до 20 записей в элементе RemoteEndpoints. Учитывается только часть полномочий; http://domain:port
и http://domain:port/website
считаются одной и той же конечной точкой. Вы можете осуществлять вызовы множества различных конечных точек в одном домене с помощью одного определения RemoteEndpoint.
Сборка и запуск решения
Нажмите клавишу F5.
Примечание.
При нажатии клавиши F5 Visual Studio выполняет сборку решения, развертывает надстройку и открывает страницу разрешений.
Нажмите кнопку Доверять.
Выберите значок надстройки на странице "Содержимое сайта".
Ниже показаны удаленные данные на веб-странице SharePoint.
Удаленные данные на веб-странице SharePoint
Устранение неполадок в решении
Проблема | Решение |
---|---|
Visual Studio не открывает браузер после нажатия клавиши F5. | Сделайте проект надстройки SharePoint запускаемым. |
Необработанное исключение SP не определен. | Убедитесь, что вы можете получить доступ к файлу SP.RequestExecutor.js в окне браузера. Если в качестве среды разработки используется локальный сервер, необходимо отключить проверку обратной связи IIS. Выполните следующую команду с помощью командной строки Windows PowerShell: New-ItemProperty HKLM:\System\CurrentControlSet\Control\Lsa -Name "DisableLoopbackCheck" -value "1" -PropertyType dword .Внимание! Отключение проверка замыкания на себя iis в рабочей среде не рекомендуется. |
Размер ответа от удаленной конечной точки превышает заданный лимит. | Размер ответа для запросов веб-прокси не должен превышать 200 КБ. |
Комбинация "схема-порт" не поддерживается. | Комбинация "схема-порт" вызова должна отвечать следующим критериям: Схема - порт HTTP — 80 HTTPS — 443 HTTP или HTTPS — 7000–10000 Важно! Исходящие порты зависят от доступности брандмауэра узла. В частности, в SharePoint Online доступны только порты HTTP-80 и HTTPS-443. |