0

I've made a simple app in "Napa" Office 365 Development Tools. It's a SharePoint app that returns the current site lists.

This is the rest call:

site + /_api/web/lists

When i debug this app it does not work, because retrieving lists while in debug returns 403 (Forbidden). However packaging this app and deploying it works. I'd like to debug SharePoint apps without having to deploy them each time.

  • SharePoint Online
  • JavaScript
  • Napa Project opened in Visual Studio 2012
  • In regards to the actual 403 error, are you attempting to access data on the host SharePoint site directly via the REST API? – John-M Dec 15 '14 at 14:13
  • I'm not querying for any specific data. I'm asking for all lists on the current site. Using this rest call: site + /_api/web/lists – Thomas Lindauer Dec 15 '14 at 14:14
  • If you're just using $.ajax or $.getJSON it won't work... you need to use a cross domain technique of somesort like SP.RequestExecutor since your app is actually in a different domain than your host. You'll also need to grant the appropriate permissions in the app manifest. – John-M Dec 15 '14 at 14:16
  • So what you're saying is while i'm developing my app i should direct all rest calls to a specific domain and site? @John-M – Thomas Lindauer Dec 15 '14 at 14:22
  • 1
    They actually need to all be directed against your App Web, since that will be the only domain your JavaScript will have access to from the browser. Then you'll use a REST endpoint like SP.AppContextSite with your host web address with the help of the RequestExecutor library -- so that SharePoint sets up a special proxy for you. Here is an example: msdn.microsoft.com/en-us/library/office/… -- search for cross domain on this site or post another question if you still need more info! – John-M Dec 15 '14 at 14:29
1

Napa supports side-loading through the 'Run Project' button on the left hand menu which will directly load your project into your developer site collection. This is much faster than packaging your app for deployment and installing it on your SharePoint site, but you need to be using a developer site collection or a site with the developer features turned on.

By far the easiest way to debug SharePoint hosted apps is to run Visual Studio, you can get Visual Studio Community (which fully supports SharePoint/Office App Development) for free here: http://www.visualstudio.com/products/visual-studio-community-vs

You may also need to install the Office Developer Tools which can be found here: http://aka.ms/OfficeDevToolsForVS2013

Then Napa actually makes it super easy to run your project in Visual Studio (a button on the left hand navigation will allow you to 'Open in Visual Studio'). When you're in visual studio all you need to do is use the run command (F5, or the green play button at the top) then VS will side load your application similar to Napa. The difference here is that once you have that open in VS, all you need to do is modify a source file in VS and save it and VS will automatically upload the change to the server. That way all you do is hit refresh and see if your JS is doing what you want.

You can attach a browser to debug in VS, but I just find running my App in Chrome to view errors and object state, set debug points, and inspect errors to be the easiest technique -- then I go back to VS and update the source, save, refresh and see if my change worked.

  • Working on a new App today from VS2015 in Windows 10 and found out that visual studio won't automatically update your files in the SharePoint Add-in if you're using the Edge browser for the App startup action. I changed it to Chrome (it's in the properties explorer for the project object) and it worked as expected though. – John-M Oct 26 '15 at 11:31
0

Well haven't ever used Napa, done only provider hosted apps but whenever I saw 403 error I needed this solution:

$config = Get-SPSecurityTokenServiceConfig 
$config.AllowOAuthOverHttp = $true
$config.Update()

Maybe this is also a security problem on your farm.

  • Everything is in SharePoint Online. – Thomas Lindauer Dec 15 '14 at 8:51
  • Ok so that shouldn't be the case. – Ciamas Dec 15 '14 at 9:05
0

Napa was created with the objective to facilitate a 'lightweight, in-browser experience' to build SharePoint or Office web app in the same browser where they would run. Ergo, it was designed to kind of complement the inherent features of the browser.

For advanced tooling, one would have to turn to Visual Studio 2012.

You can debug code like any javascript: In IE, 'F12 developer tools' could be used to debug the JavaScript, HTML, and CSS.

Unfortunately, at now, the 'Napa' is only for development and deployment packages, no resource debug.

I hope you understand. Maybe who knows what the future may arise this feature.

Reference:

Fórum Ninja

MSDN

Edit:

You can download Project Napa(the format is filename.exe):

follow step-by-step:

Download: opening napa in vs 2012

Execute file downloaded: enter image description here

Wait for some seconds, will open vs 2012: with VS 2012 opened, set connection to online. enter image description here

Usually they come pre-configured, after do made last step, break point in your code and start mode 'debug'. :)

sorry my bad english.

hope this help.

  • I use Napa in conjuction With Visual Studio 2012. So could you extrapolate on: > For advanced tooling, one would have to turn to Visual Studio 2012. – Thomas Lindauer Dec 15 '14 at 14:02
  • and now, you must configure the properties of the solution in VS 2012 so you can debug correctly. – b1c10 Dec 15 '14 at 14:05
  • How would i do that @b1c10 ? – Thomas Lindauer Dec 15 '14 at 14:07
  • i will create as answer, because here is bad to explain. – b1c10 Dec 15 '14 at 15:23
  • see my edit now. – b1c10 Dec 15 '14 at 15:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.