sharepoint
Erstellen einer vom Provider gehosteten App
Suche…
Entwicklungsumgebung einstellen
Um mit App Development zu beginnen, benötigen wir Visual Studio 2013 oder eine höhere Version. Laden Sie die neueste Community- oder Ausdrucksversion von hier> https://www.visualstudio.com/products/free-developer-offers-vs herunter
Sobald es heruntergeladen und installiert wurde
Öffnen Sie und klicken Sie auf Neues Projekt erstellen
Erweitern Sie den Abschnitt Office / SharePoint. Sie sollten eine Option für App sehen (siehe unten).
Wenn keine App-Option verfügbar ist Schließen Sie das VS und laden Sie die Microsoft Office Developer Tools https://www.visualstudio.com/en-us/features/office-tools-vs.aspx herunter
Vorbereitung für die Entwicklerseite
Sobald wir Visual Studio haben, benötigen wir eine Entwicklerseite, um Apps für SharePoint bereitzustellen. Am einfachsten erhalten Sie> Ein kostenloses Office 365-Entwicklerkonto für ein Jahr ( https://profile.microsoft.com/RegSysProfileCenter/wizardnp.aspx?wizid=14b845d0-938c-45af-b061-f798fbb4d170&lcid=1033
Sobald der Anmeldeprozess abgeschlossen ist, https://www.office.com/ center URL für alle Ihre App 
App in Visual Studio erstellen
Beginnen wir mit der Erstellung unserer ersten App
- Visual Studio öffnen und> neues Projekt erstellen
- Geben Sie Name und Ort ein
- Geben Sie die URL der Entwicklersite ein, die Sie im vorherigen Schritt erstellt haben, und wählen Sie Provider-Hosted aus
Es öffnet sich ein Popup mit dem Login
Als nächsten Schritt wird wie für den Anwendungstyp MVC oder Webform ausgewählt. Ich wähle hier MCV aus
Wählen Sie unter Wie soll sich das Add-In authentifizieren? Wählen Sie Windows Azure Access Control-Dienst verwenden aus, und klicken Sie auf Fertig stellen
Im Solution Explorer können wir sehen, dass 2 Projekte erstellt wurden. Eines ist SharePoint App-Teil und ein anderes ist Asp.net Web App
Beginnen wir mit der Codierung
Hier nehme ich das Beispiel einer einfachen Nachrichten-App
Öffnen Sie die SharePoint-Entwicklerseite, und erstellen Sie eine Liste zum Speichern unserer Nachrichtenartikel
Erstellen Sie eine benutzerdefinierte Liste und fügen Sie 3 weitere Spalten hinzu. Body, Summery, ThumbnailImageUrl
Gehen Sie zurück zu unserer SharePoint-App, Öffnen Sie die AppManifest.xml-Datei, klicken Sie auf die Registerkarte Berechtigung, und geben Sie der Websitesammlung die Berechtigung Lesen, und speichern Sie sie.
Öffnen Sie HomeController über eine Webanwendung, in meinem Fall eine MVC-Anwendung. Wenn Sie eine Webform-App erstellen, sollte sich der Code auf der Seite default.aspx.cs befinden
Nachfolgend finden Sie den Code-Ausschnitt, um die neuesten Nachrichten aus der Liste zu erhalten. So sollte unsere Indexseite aussehen.
[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); }Klicken Sie nun mit der rechten Maustaste auf Index und klicken Sie auf Ansicht hinzufügen. Klicken Sie dann auf Hinzufügen
Öffnen Sie nun die Datei Index.cshtml aus Ansichten> Basisverzeichnis
Nachstehend finden Sie den Code-Ausschnitt für die Datei 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>Klicken Sie in Ihrer Lösung mit der rechten Maustaste auf den Ordner Modell und fügen Sie eine CS-Klassendatei hinzu. Fügen Sie unten Modellklassen hinzu
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; } } }Verwenden Sie die Taste F5, um das Add-In bereitzustellen und auszuführen. Wenn ein Sicherheitsalertfenster angezeigt wird, in dem Sie aufgefordert werden, dem selbstsignierten Localhost-Zertifikat zu vertrauen, wählen Sie Ja.
Und jetzt ist die erste App fertig
Vollständige Artikelseite erstellen
Wir haben bereits eine erste Seite erstellt, auf der alle Nachrichtenartikel angezeigt werden. Diese Seite zeigt den vollständigen Artikel.
Fügen Sie eine weitere Aktionsmethode zu HomeController hinzu
[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); }Klicken Sie erneut mit der rechten Maustaste auf Aktion, und erstellen Sie eine Ansicht mit demselben Namen. Name der Aktionsmethode. In meinem Fall wird die Ansicht " Absehen" genannt
@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>
Dies ist der Code für die vollständige Artikelseite, die den Hauptteil des Nachrichtenartikels zeigt