sharepoint
Создание приложения, размещенного провайдером

.NET Framework ASP.NET C# Language CSS HTML JavaScript jQuery PowerShell Microsoft SQL Server VBA

Настройка среды разработки

Для начала с App Development нам нужна Visual studio 2013 или более поздняя версия. Загрузите последнюю версию сообщества или выражения здесь> https://www.visualstudio.com/products/free-developer-offers-vs

Как только он был загружен и установлен

Открыть и клик создать новый проект

в разделе Office / SharePoint вы должны увидеть опцию для приложения, как показано ниже.

Если параметр «Приложение» недоступен, закройте VS, загрузите и установите Microsoft Office Developer Tools https://www.visualstudio.com/en-us/features/office-tools-vs.aspx

Подготовка к сайту разработчика

Когда у нас есть визуальная студия, нам нужен сайт разработчика для развертывания приложений в SharePoint. Самый простой способ - это> зарегистрироваться на бесплатную однолетнюю учетную запись разработчика Office 365 https://profile.microsoft.com/RegSysProfileCenter/wizardnp.aspx?wizid=14b845d0-938c-45af-b061-f798fbb4d170&lcid=1033

После завершения процесса регистрации https://www.office.com/ URL центра для всего вашего приложения

Создать приложение в Visual Studio

Давайте начнем с создания нашего первого приложения

Открыть визуальную студию и> создать новый проект
Введите имя и местоположение

Введите URL-адрес вашего сайта разработчика, созданный на предыдущем шаге, и выберите Host-Host

Всплывающее окно откроется, как для входа в систему
Следующим шагом будет как тип приложения, либо выбрать MVC или Webform. Я выбираю MCV здесь
В разделе «Как вы хотите, чтобы ваша надстройка была аутентифицирована?», Выберите «Использовать Windows Azure Access Control Service» и нажмите «Готово».
В обозревателе решений мы видим, что 2 проекта были созданы. Одна из них - часть приложения SharePoint, а другая - веб-приложение asp.net.

Позволяет начать кодирование

Здесь я беру пример базового приложения новостей

Откройте сайт разработчика SharePoint и создайте список для хранения наших новостных статей
Создайте собственный список и добавьте еще 3 столбца Body, Summery, ThumbnailImageUrl
Вернитесь в наше приложение SharePoint, откройте файл AppManifest.xml, щелкните вкладку «Разрешение» и дайте разрешение на чтение для семейства сайтов и сохраните его.
Откройте HomeController из веб-приложения, в моем случае это приложение MVC. Если вы создаете приложение webform, тогда код должен быть в файле default.aspx.cs

Ниже приведен фрагмент кода для получения последних новостей из списка. Это будет выглядеть наша индексная страница.

[SharePointContextFilter]
public ActionResult Index()
{
    User spUser = null;

    var spContext = SharePointContextProvider.Current.GetSharePointContext(HttpContext);
    List<NewsList> newsList = new List<NewsList>();
    using (var clientContext = spContext.CreateUserClientContextForSPHost())
    {
        if (clientContext != null)
        {
            spUser = clientContext.Web.CurrentUser;

            clientContext.Load(spUser, user => user.Title);

            clientContext.ExecuteQuery();

            ViewBag.UserName = spUser.Title;

            List lst = clientContext.Web.Lists.GetByTitle("News");
            CamlQuery queryNews = CamlQuery.CreateAllItemsQuery(10);
            ListItemCollection newsItems = lst.GetItems(queryNews);
            clientContext.Load(newsItems, includes => includes.Include(i => i.Id, i => i.DisplayName, i => i["ThumbnailImageUrl"], i => i["Summery"]));

            clientContext.ExecuteQuery();

            if (newsItems != null)
            {
                foreach (var lstProductItem in newsItems)
                {
                    newsList.Add(
                        new NewsList
                        {
                            Id = Convert.ToInt32(lstProductItem.Id.ToString()),
                            Title = lstProductItem.DisplayName.ToString(),
                            Summery = lstProductItem["Summery"].ToString(),
                            Thumbnail = lstProductItem["ThumbnailImageUrl"].ToString()
                        });
                }
            }
        }
    }

    return View(newsList);
}

Теперь щелкните правой кнопкой мыши по индексу и нажмите « Добавить вид». Затем нажмите «Добавить».

Теперь откройте файл Index.cshtml From Views> Home directory

Ниже приведен фрагмент кода для файла index.cshtml.

@model List<SharePointNewsAppWeb.Models.NewsList>
 @{
 ViewBag.Title = "My News - browse latest news";
}
 <br />
 @foreach (var item in Model)
 {
 <div class="row panel panel-default">
  <div class="col-xs-3">
    <a href="/home/[email protected]">
        <img class="img-responsive" style="max-height:200px;max-width:100%;" src="@item.Thumbnail" alt="@item.Title" />
    </a>
</div>
<div class="col-xs-9 panel-default">
    <div class="panel-heading">
        <h4><a href="/home/[email protected]">@item.Title.ToUpper()</a></h4>
    </div>
    <div class="panel-body">
        <p>@item.Summery</p>
    </div>
</div>

Щелкните правой кнопкой мыши папку Model в вашем решении и добавьте файл класса CS. Добавьте ниже классы моделей

 using System;
 using System.Collections.Generic;
 using System.Linq;
 using System.Web;

 namespace SharePointNewsAppWeb.Models
{
  public class NewsApp
   {

   }
 public class NewsList
  {

public int Id { get; set; }

public string Title { get; set; }

public string Summery { get; set; }

public string Thumbnail { get; set; }
 }
 public class FullArticle
 {

  public int Id { get; set; }

  public string Title { get; set; }

  public string Body { get; set; }

 }
}

Используйте ключ F5 для развертывания и запуска надстройки. Если вы видите окно Security Alert, которое просит вас доверять самоподписанному сертификату Localhost, выберите «Да».

И теперь первое приложение готово

Создание полной страницы статьи

Мы уже создали первую страницу, на которой будут показаны все новостные статьи. На этой странице будет показана полная статья.

Добавить еще один метод действий для HomeController

[SharePointContextFilter]
public ActionResult Aticle(int ArticleId)
{
    User spUser = null;

    var spContext = SharePointContextProvider.Current.GetSharePointContext(HttpContext);
    FullArticle article = new FullArticle();
    using (var clientContext = spContext.CreateUserClientContextForSPHost())
    {
        if (clientContext != null)
        {
            spUser = clientContext.Web.CurrentUser;

            clientContext.Load(spUser, user => user.Title);

            clientContext.ExecuteQuery();

            ViewBag.UserName = spUser.Title;

            List lst = clientContext.Web.Lists.GetByTitle("News");
            CamlQuery queryNews = new CamlQuery();
            queryNews.ViewXml = @"<View><Query><Where><Eq><FieldRef Name='ID'/>" + "<Value Type='Number'>" + ArticleId + "</Value></Eq></Where></Query>" +
                "<ViewFields><FieldRef Name='ID'/><FieldRef Name='Title'/><FieldRef Name='Body'/></ViewFields></View>";//
            ListItemCollection newsItems = lst.GetItems(queryNews);
            clientContext.Load(newsItems, includes => includes.Include(i => i.Id, i => i.DisplayName, i => i["Body"]));

            clientContext.ExecuteQuery();

            if (newsItems != null)
            {
                foreach (var lstProductItem in newsItems)
                {
                    article.Id = Convert.ToInt32(lstProductItem.Id.ToString());
                    article.Title = lstProductItem.DisplayName.ToString();
                    article.Body = lstProductItem["Body"].ToString();
                }
            }
        }
    }
    return View(article);
}

Снова щелкните правой кнопкой мыши на Action и создайте представление с тем же именем Имя метода. В моем случае View будет называться Story

  @model SharePointNewsAppWeb.Models.FullArticle

@{
 ViewBag.Title = "Aticle";
}

<br />
<div class="panel panel-default">
 <div class="panel-heading"><a style="font-size:20px;" href="/"><i   class="glyphicon glyphicon-chevron-left"></i> <i class="glyphicon glyphicon-home"></i>      </a></div>
 <div class="panel-heading"><h1 class="h2">@Model.Title.ToUpper()</h1></div>
 <div class="panel-body">@Html.Raw(@Model.Body)</div>
</div>

Это код для полной страницы статьи, на которой показан текст статьи о новостях

Modified text is an extract of the original Stack Overflow Documentation

Лицензировано согласно CC BY-SA 3.0

Не связан с Stack Overflow