App Script Parts in SharePoint - Office 365 Developer Patterns and Practices

Play App Script Parts in SharePoint - Office 365 Developer Patterns and Practices
Sign in to queue


Andrew Connell walks through the Office 365 Patterns & Practices Scenario adding App Script Parts into pages within an App for SharePoint. This code can be found on GitHub here

This pattern is commonly used cross the industry to integrate systems between the others using JavaScript embedding capabilities. This scenario sample shows how to achieve the similar structure using typical SharePoint provider hosted pattern and how we can provide our extension to be easily available for end users using the web part gallery.

Good examples of the pattern usage is for example Yammer embedding mechanism or how interactive maps are integrated to the sites using Bing or Google

In each of the above scenarios we reference to JavaScript and we use specific div for actually dynamically then contain the actual referenced functionality. Here's an example of Yammer embed command with JavaScript reference and the div marker to define the location of the capability in the page.

This provides more seamless and dynamic integration option than using app part which are IFrames. This also means that this is suitable option for example for responsive user interface design. So this could be definitely something to evaluate also from app model perspective. What if we would actually just simply deploy redefined script web parts to the SharePoint sites which would have the reference and needed html for provider hosted app reference. This would give the end users opportunity to add additional functionalities to the sites as needed using simply normal SharePoint user experience.

Notice thought that if you would need to provide complex parameterization for each instance on the page, this could be complex to achieve, but not impossible. You could pretty easily recognize when the page is in edit mode and then provide needed parameterization options from embedded JavaScript. Any configuration could be stored for example to the provider hosted app side. It's good to notice that since we are injecting new web part option to the web part gallery, deployment of the web part definition (.webpart file) requires tenant administration permissions, so this model is not available for apps hosted in the app store.

In production we could be running these scripts easily from Windows Azure or from any other centralized location where they can be referenced from the SharePoint pages. This also gives us easy way to update the script, since it's not stored in the actual SharePoint page, it's rather loaded completely from the provider hosted environment.



Download this episode

The Discussion

  • User profile image

    Thanks Andrew. Couple of new useful approach to design and deploy apps!

  • User profile image
    Brandon Murray

    Thanks for the example. How would this be done with a SharePoint-hosted add-in, though? I'd like to keep my add-ins as self-contained as possible.

  • User profile image

    Please notice that this video is from 2014 and completely outdated. We do recommend using SharePoint Framework as the extensibility model for SharePoint where possible. Please see the official documentation for more details at

Add Your 2 Cents