Now it's time, let's add secure file sharing to your app.
First, let's add the Client SDK. Include the Client SDK globally.
Now it's time, let's add secure file sharing to your app.
First, let's add the Client SDK. Include the Client SDK globally.
<script src="https://{your-url}/javascript/weavy.jquery.js"></script>
The {your-url}
refers to the hostname where you installed the Weavy Server SDK.
When you have loaded the SDK, you can create a new Weavy()
instance anywhere at any point in your app.
The Weavy instance is the main entry point used when embedding Weavy. It sets up a connection to a Weavy server and handles realtime communication, event distribution, and more.
To avoid timing issues when loading it may be a good idea to make sure you instantiate Weavy at the window DOMContentLoaded event.
For our example, make sure you have a container in your app named id="weavy-files"
The container must also have a specified width & height.
Use the encoded JWT you generated in the previous step.
<script>
var jwt = "{your generated jwt token}";
var weavy = new Weavy({ jwt: jwt });
var space = weavy.space({ key: "demo" });
space.app({
key: "files-demo",
type: "files",
container: "#weavy-files"
});
</script>
Spaces are used in Weavy to group apps around a subject or entity. Within those spaces are members. Any members within a space have access to any apps within that space.
In order to set up the Weavy space, we need a unique identifier - a key - in the sample snippet above that's key: "files-demo"
Keys must be unique because they are used to grab the contextual information for that specific space or app. Any unique identifier will do - it just can't be too long.
If you've done everything correctly, you should now see Weavy Files rendered in your UI - cool, right? 😉
Could look like something like this...