Work with files everywhere: Store files, extend user experiences, and build business processes
Hello. Everyone. Hope. You're ready for a great day too here, at builds. Let. Me switch over to the presentation, make sure we're all good. Clicker. Works. Maybe. Clicker. Works great, so, if you couldn't tell from the title which is work with files everywhere, we're going to talk about files, in, office 365, SharePoint. Onedrive. Microsoft, graph all, the good stuff to. Get the most out of your your business data in the cloud, so, we're gonna start with a quick overview for those that don't know what's, available. There's. Some super helpful resources, to get started, graft up Microsoft, comm if you leave with one thing, today, remember, graft Microsoft, comm because. It is your place to get started with pretty much everything. Graphics. Floor is hosted, there and graph explorer is a great tool that lets, you simulate. Your Microsoft, graph rest. Calls and use. Either a sample, data set that we provide, or, you, can log in with either your Microsoft, account or Active, Directory account, and. Go against your actual, real data to test it out and see what's going on I use, this thing daily, it's. Great. My name is Jeremy Kelly by the way I totally forgot to introduce myself I'm a senior program manager on, the onedrive and SharePoint developer, platform team we. Provide all the graph, API is along with the other server API is for, onedrive and SharePoint. Documentation. Is also linked to from graph Microsoft. Comm if. You're ever looking for, what's available, call. Semantics, there's a lot of great resources in the documentation, that will help you get started. So onedrive. How many people have files that they actually need to work with every day a. Few. Most, people hopefully. Onedrive. For, us means both onedrive, consumer, and onedrive, for business and, in. The terms of Microsoft graph it doesn't, really matter which one you're talking to, the, semantics, for talking to them are the same the, references, are largely the same, so for us one. Drive and the drive API, s are everywhere, files are throughout office 365. A, couple, basic elements, that we're gonna see as we look at some, code demos in a little bit we. Have a drive which is just a container of files and a drive item most, of the operations, that you do whether it's uploading, downloading. Copying. All of that stuff is going to happen on the drive item, so. That super. Basic super, easy to work. With. Good. Thing to remember on, the, SharePoint site so. It. Wasn't always obvious that, SharePoint and onedrive go, together but, as a team we definitely, think they do share. Point of course is made of sites and. Lists, and those are your core constructs, in SharePoint, all. Accessible, through the graph, and. Lists have list items the thing that might stand out here that I'm not calling, out explicitly is, document, libraries, and that's, because for us document, libraries, are both a list.
And A drive so. When I want to work with things that are kind of file operations I, used the drive reference, to my, document, library, to, upload new files to, it download. And what I want to do things like add SharePoint, metadata, work, with columns, that sort of thing then I use the list interface so. Same. Resource, can be accessed, in kind of two different modes, and. We'll see that you can easily switch back and forth between the two so, it's not difficult. To see what's going on. Integration. Points so those, are really everything, you need to know to get started with coding. Against onedrive and SharePoint in the graph those, five. Or so basic, elements are going to give you all the building blocks so, you might now be wondering well where, do I actually want to do, some of these integrations. We've. Got the SharePoint framework so if you work in SharePoint, if you have intranet, portals built. On SharePoint, we. Have a new framework in, the last year or so lets. You build using, all of standard, open, source development tools for the web you, can use react other frameworks, too build components, that sit on pages as of. One point four point one we've introduced a preview graph, client, that allows you to easily access, the graph and. In one point five we've updated this as well so we're continuing, to make this easier one. Of the benefits, you get working within the SharePoint framework is that we handle all of the authentication. We. Handle registering, with Azure Active Directory so, your app we, kind of connect the to manifest worlds. Together so when you create a SharePoint framework project and upload. It to your tenancy it's, going to get registered automatically, for you so you don't have to do the manual app registration. The way you would in in, some other examples. Onedrive. Has a file handler model, did anyone else know that that existed. Probably. Not so file handlers, are a great way if you have a custom, file type, to. Integrate. With onedrive. So, what it lets you do is get access to some menu items and, when, the user activates. Your file, handler it will bring. Out a new window to, a service, that you host and you, can do whatever, you want so some examples of these in production today there's. An adobe file handler that lets you work with PDF, files using, their service. SurveyMonkey. Also has built a file handler based solution, that allows you to work with SurveyMonkey. Right from within office 365. And. Close. To my heart rich client, apps and in particular, Universal, Windows platform. There's. A lot of different options for integrating, into a rich app and that's what we're gonna take a look at in the demo in just a minute there. Is a new get packaged Microsoft, graph that wraps, some. Of the heavy lifting of just making calls, to the. Service. That's. Certainly an option there, is a preview, library, for authentication, for MS Al this. Uses, the. V2, endpoint, of Azure, Active Directory what. This means is the benefit, you get is it works against both. Consumer. And business there. Are some limitations. Still, that they haven't quite ported, all the way forward so. If you're doing a pure. Your Active Directory solution. You, can still use the 1.0, libraries, that are available as well for our demo I used the MS al because it made it really easy for what I was doing and it lets us use target, both platforms simultaneously without. Any work on our part there's.
Also The, uwp community, toolkit which. Is a great resource beyond. Just accessing. Office. 365, services, it's a out, on github it, gives you a whole bunch of different tool kits for login management, works with onedrive works with graph works. With other Microsoft services. I believe, it's community contributions. As well so. It's continually, being updated that's, a great option and the. Option we're gonna go with today in the demo which is manage, your HTTP, client calls, directly, so, if you actually want to craft the rest calls yourself, which. Gives you a little bit of bit of extra, flexibility, at the cost of a little more setup. Overhead. This, is certainly a way you can go and it's what we're gonna take a look at in just a minute, so. For, our demo how do we work with all this stuff and why do I have all this junk. Up on the, the, console, I thought. It would be interesting too, because apparently a lot of the demos this week are IOT, based, to, take my handy little Raspberry Pi running. Windows 10 IOT. Connected. Up to a webcam, and an infrared motion sensor, and when. It detects. Motion it's going to take a picture upload. That to onedrive. Or SharePoint. It's, gonna actually send the photo in the SharePoint scenario over to the cognitive services API, do, some quick face detection on it and we're, gonna then upload, the number of faces that it finds in the picture back into the SharePoint library. So. Sounds. Really complicated, but as we're gonna see it's actually not that much code so. Let's hop over. To, the my laptop. Wrong cable. We'll. Come over here. And. We're just gonna take a look at kind of the. Core, of the app so if I'm building an app from scratch there's a couple things I need to do one, I need to start. Start. With a new project in, this case I just started with a new blank Universal, Windows project, once. I've got that I go and I register, my app with, the azure portal, and, I've got a link back in the slides that we'll take a look at that that'll tell you where to do that that's, going to give us an app ID that, we're gonna take a look at real quick so. Once I get the app ID from. A juror I'll be able to use that with some of my calls later on to make sure that our app, is who we say we are. So. Then I need to write, some quick login code we'll see that's really easy and then I've got all my business, logic how do I upload how do I set the metadata and we're gonna walk through those steps so this is kind of my my business logic function, here you can see we're gonna sign in the user we're.
Gonna Take our photo, we're. Gonna upload it to a document library where, I detect some faces and then we're gonna upload the metadata to the the, doclet. So. If we come over here let's start with a number on here logging in it seems like this would be really hard right like I've got this this graph ID what do I need to do historically. Off is a complicated. Piece, of code but. For us using, the MS al library, it's. One block that we're gonna stick right in here and we're gonna see what it does. So. Right off the bat we create this public client application, using, the ID, that we passed in that, gives us a context, that we can talk to a ad with, once. We do that we, call a choir token, async we, pass in the Scopes that we want so when I registered my, app I had. To say what what scopes. I wanted, that app to have in my case I said I want to be able to use read the user profile, I want, to be able to read and write all the files that the user has access to and, I want to be able to read and write to all of the SharePoint sites that the user has access to I'm, going to pass that string along with it when I often, to Kate and it's, going to handle. All of the process, of login all of the UI that you normally see when you're logging in to an AAT site is handled. By that one call that I make right there and, the rest of this is just outputting some data so we know that we signed in or that we got an exception, so, that, was pretty easy after, this point we, are signed in and ready to go and we can start making graph calls so, let's take a look at what it takes to actually upload. Our file. Right. Here I've got kind of the the bones. Of, an upload, routine. I passed, my file in I've, got the graph endpoint, coming in as a URL along. With the token, that the login provided. So inside this user credentials object. Up here is a bearer, token, that I can use to say that the user is authenticated we're, gonna pass that with every request we make to, make sure that it succeeds, if we don't pass that token everything, fails and we don't get our data so. That's really the magic of how we make. Sure the login worked so. When we want to do the upload, to. Do that, token, passing all. I need to do is add a the. Authorization. To the headers, we're. Gonna put this right here. So. I've created a request it's, gonna be a put request because I'm uploading a file I'm passing. A URL and I've. Got my bearer token, that, I'm adding to the headers once. I've got that when, I execute, that request against the server it's going to succeed and our files gonna go up the, rest of this is just opening, the stream I set. The content, of the request as that, that file, data and then, I send it using the HTTP client a lot of this is handled, directly, by the various. Libraries, that I referenced, earlier so. In many cases you won't actually need, to do this but I want to show you what the URLs look like so, you can kind of learn what what. That object model, is gonna be later. On so this is our low-level file upload with this we should be able to put any file we want into. SharePoint. Onedrive, and we should be good but we need the URL up here to actually hit the group the right graph endpoint, so, that's gonna be what we're gonna look at next. So. The upload kind, of the outer layer here we've, got another section, another. Block. I. Mentioned. Before that it doesn't really matter whether I'm logged into onedrive consumer. Or business I'm, gonna get the, right the. Right place, based. On the users log in context. The code I write is going to be the same in. My case I do want to switch though between uploading. To a SharePoint document library and, uploading, to my onedrive whichever one it is whether it's consumer, or business so. If I'm uploading the SharePoint, and I've got a combo box in our demo app that just lets me switch between those two first. I'm gonna have this graph API, prefix. As I called it I'm just string building here nothing fancy and that's, gonna go to graph that Microsoft comm /v, 1.0, so. We're gonna start building there for. A SharePoint, document library I'm gonna go to sites I'm, gonna add the ID of the site and if, you look here you'll see that this ID is rather long and not.
Terribly Friendly, that's, why I put it into a variable, and hard-coded it up above because it makes this line of code get really long but, what that's doing is concatenated. Your, host where your tenancy is the. Grid, associated. With the site collection, and the, web that you want to talk to so if you're familiar with how a SharePoint, site collections. And sites work you kind of need all three of those bits to say this is a unique, thing that graph will know how to route to so, I take that I pass that in here, then. I say I want to access the drives so, like I said document libraries, are both lists, and drives in this case I'm uploading a file so I want to talk to it like a drive I, give, it which document, library ID I want which I've pulled out earlier, and hard-coded. Then. I ask for the route this is important, you actually need a path that says, give. Me the contain. Ernest part of this so we kind of have a multi layer bit in the drive you, access the drive you ask for route or. Another path if you're working with some different. Paths we. Give it a name so, I'm passing whatever my new file name is here and then, to do an upload I request, the content, stream, so. I do a slash content. And I. Want to get back some information, from. This call that I don't normally get so, I'm gonna select back the, point IDs and, that, means that when it cut when it uploads the file it's gonna come back and say give me all of the IDS that I might need to reference this in a SharePoint context. Even though I started out in a drive context. When. I'm uploading to onedrive. I don't. Need quite as much of, that complexity, all I need to remember is me drive route and me. Drive route is going to give me my onedrive, based, on my users logged in context, consumer. It'll give me the consumer, route business. It'll give me my onedrive. For business route, and from, that point on it's working, with a drive it doesn't matter semantically. Which one I am, there are a few features that don't, work in one context, or another just based on the fact that the service, doesn't offer them for. Example in consumer, you can request special, files like in my case my music folder which. Typically doesn't exist on the business side so we give you some shortcuts on the consumer, for special consumer, features that don't exist on business, they'll, return an error if you call on the business context, but, it's pretty easy to handle that case, ok. We're getting close to the end here so, we've got an upload routine we know we can take a file and upload it now, we want to actually update some SharePoint, metadata. The. Only difference here is that instead of doing a put I'm gonna do a patch. Dotnet. Framework doesn't, have a built in patch so I had to create a new context, here and say it's a patch I, passed, that header the bearer token, again right here and I'm. Setting the content, equal to a JSON blob of what fields, I want to update in SharePoint, and, this is pretty easy to format, and create. And. We're gonna do that next so, let's get demo 5. We're. Gonna craft a new endpoint. Similar. To our old one but slightly different. And. That. In this case we're gonna go sites instead. Of the drives we're gonna go to the lists we're. Gonna go to the, list we want slash items, the, item ID the fields, and we're gonna upload at that, point we should have a working file uploader, and I've.
Already, Pre compiled, onto the Raspberry Pi to make this a little faster because we're getting pretty close to time and, let's. See what we get over here so. I've got my login screen I got this right from that one line of code that I showed earlier. Let. Me find my mouse so I can set the focus. That's, gonna log its in and. We're. Throwing some errors. There. We go so, those first errors were because it tried to take a picture and upload before we'd signed in so, that's just the stack trace of the login failure, now. That we've signed in you can see we're getting data back from SharePoint, and, we. Are let, me pause this. So. We can take a look. In. This case you can see we uploaded, let. Me show that's not a touchscreen so that's not gonna work I. Uploaded. Some share to SharePoint, so here's the first graph call we made. That. Gave us back a download, URL and, the, SharePoint, IDs block right here I, use. Those, SharePoint, IDs to put the data into the library, and you can see that at least in this last one we. Called the. Endpoint. For the cognitive services and detected some faces and it detected, at least three of you were looking enough at the camera, that, it was able to find you so we'll, switch really, quick back over to the laptop and, I'll. Show that that all worked into, SharePoint. And if, we refresh, this you can see. Here's. A few seconds, ago about a minute. There's. The photo we took so. Not. A whole lot of code to make this work we needed to do the upload we needed to do the the. Metadata. Patch the, rest of it was really the business logic making, sure that I had all of the, the. Camera and the sensors, and, the cognitive services, the cognitive servant services is literally about one line of code to make that work and do, the face detection out of the image I was super impressed with how fast I could do that so. Like. I said one, thing to remember grafton, microsoft comm it's your home if you're working with graph stuff you'll find everything you need there and also.
User, Voice we. Are always listening, taking. Feedback looking, for feature suggestions. If there's something in the API you need that, you don't see, put, it on user voice where we use that to inform our backlog, of features that go into what shows up for onedrive, and SharePoint so, thanks, everyone for coming out I hope you learned at. Least a little bit about, what we've got please, evaluate the session let, me know how I did and enjoy. The rest of your day.