sharepoint
Skapa en leverantör värd app
Sök…
Ställa in utvecklingsmiljö
För att börja med App-utveckling behöver vi Visual studio 2013 eller högre version. Ladda ner senaste community- eller uttrycksutgåva härifrån> https://www.visualstudio.com/products/free-developer-offers-vs
När den har laddats ner och installerats
Öppna och klicka på skapa nytt projekt
utvidga Office / SharePoint-avsnittet. Du bör se ett alternativ för App som visas nedan.
Om appalternativet inte är tillgängligt Stäng VS, ladda ner och installera Microsoft Office Developer Tools https://www.visualstudio.com/en-us/features/office-tools-vs.aspx
Förbereder för utvecklarwebbplatsen
När vi har en visuell studio behöver vi en utvecklarwebbplats för att distribuera appar till SharePoint. Det enklaste sättet är att få är> Registrera dig för ett gratis Office 365-utvecklarkonto https://profile.microsoft.com/RegSysProfileCenter/wizardnp.aspx?wizid=14b845d0-938c-45af-b061-f798fbb4d170&lcid=1033
När registreringsprocessen är klar https://www.office.com/ center URL för all din app 
Skapa app i Visual studio
Låt oss börja med att skapa vår första app
- Öppna visuell studio och> skapa nytt projekt
- Ange namn och plats
- Ange din webbadress för utvecklarens webbplats som skapades i föregående steg och välj leverantör av leverantör
Popup kommer att öppnas som kommer att logga in
Nästa steg kommer det som för applikationstyp, välj antingen MVC eller Webform. Jag väljer MCV här
Under Hur vill du att ditt tillägg ska verifieras? Väljer du Använd Windows Azure Access Control Service.and Klicka på Slutför
I lösningsutforskaren kan vi se att 2 projekt har skapats. En är SharePoint-appdel och en annan är asp.net webbapp
Låter börja kodningen
Här tar jag exemplet med en grundläggande nyhetsapp
Öppna SharePoint-utvecklarwebbplatsen och skapa en lista för att lagra våra nyhetsartiklar
Skapa en anpassad lista och lägg till ytterligare 3 kolumner Body, Summery, ThumbnailImageUrl
Gå tillbaka till vår SharePoint-app, Öppna AppManifest.xml-filen, klicka på tillåtelsefliken och ge läsbehörighet till webbplatssamlingen och spara den.
Öppna HomeController från webbapplikation, i mitt fall är det en MVC-applikation. Om du skapar en webbformulär-app bör koden vara på sidan default.aspx.cs
Nedan visas kodavsnittet för att få de senaste nyheterna från listan. Så här ska vår indexsida se ut.
[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); }Nu högerklicka på Index och klicka på Lägg till vy. Klicka sedan på Lägg till
Öppna nu filen Index.cshtml Från Visningar> Hemkatalog
Nedan är kodavsnittet för filen 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>Högerklicka på modellmappen i din lösning och lägg till en CS-klassfil. Lägg till nedan Modellklasser
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; } } }Använd F5-tangenten för att distribuera och köra ditt tillägg. Om du ser ett fönster med säkerhetsvarning som ber dig lita på det självsignerade Localhost-certifikatet, väljer du Ja.
Och nu är den första appen klar
Skapa hela artikeln
Vi har redan skapat första sidan som visar alla nyhetsartiklarna. Denna sida visar artikeln komplett.
Lägg till ytterligare en åtgärdsmetod till 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); }Återigen Högerklicka på Åtgärd och skapa en vy med samma namn Åtgärdsmetodens namn. I mitt fall kallas View Aticle
@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>
Det här är koden för Full artikel-sida som visar Body of the new Article