Let's say you need to use media files in your mobile application
or that you just want to store another type of file in a scalable and robust way if you
have this use case join me in this episode of decoded quick it's where we'll go through
the amazon s3 connector and use it in a mobile application in outsystems
okay so two things we need before we get started to create an edibles account and to download and
install the fourth component for the os3 product so let's go through the [ __ ] account part i
already have a free account it's easy you just sign up for a free account you'll find
it and then we want to go to the identity and access management go to users and as you can
see i already have some of them we will be using this one but you you probably will need to create
a new one add users choose a name and choose the programmatic access as we will need the access key
and the secret access key next you have to go through the permissions and for this test is just
full access to s3 to the service be careful with the real world application as you might want to
be more strict on these type of policies and later to finish creating a new user
you will have the secret and access key given to you this is only one time thing so make sure to
store those credentials in a safe place because if you forget them you'll have to create new ones
and to show you the user that will be using it's this one as you can see it has full access and
for the security credentials you can go here and check them out then we will need to go
to the yes3 service and we are going to create a bucket specific for this application which in this
case it's events recordings so once again you just go here create a bucket and i'll show you
what this is it's just an empty bucket it has no objects we will upload them later in the in the
video and it should be as simple as this events recordings bucket so aws account sign up for free
create a user with full access to s3 if you're just experimenting and create a bucket then we
go to the outsystems forge we search for amazon s3 and you'll find here the amazon simple storage
service that is a supported component click download and install it in your environment so
that's then let's jump right into service studio okay so for the application that we will be using
you can install it via the new application start from an app and we are going to use the events app
and to give you a quick overview of what that looks like let me log in with the demo user
and as you can see we have a list of sessions for this specific event and we can rate the session
join for remote session and all the details what we will be doing is we will be changing this so
we can have a way for the users to watch the recording later so in order for our users to
watch the recording we need to put the recording somewhere in a storage place so let's go to
service studio and i've built a very simple back office that lists all the sessions for the event
and then you can update the details of the session and add a section where you can upload
the video so this is the upload recording it's the upload widget that comes with the platform
and it's binded to this local variable where it will receive the name of the file that we are
uploading and the binary of the video and then if we see what this ad recording does it just updates
the video and the event session what we want to do is stop using the database in our application
and put that load into ds3 service so to do that we go here and we have already referenced the
component that we installed that is the amazon s3 and this module is the integration service one
and we'll use the object put method so in order to do this i'll just create a few more utilities
here which will give me the aws credentials that i created for that user that you need
to create and this will return me the region the access key and the secret access key then we will
want the bucket name and for that i already have that name in a function as well and then for the
key of the object it will be the recording name that comes from the file that is being uploaded
and of course the file that is the binary data we can use metadata for example to attach the
video file to the session so for example as a quick test here i can say that the session id is
the session title or even more metadata that can be important for you to use so what we are doing
here recapping uploading a file that is only accepting video and as soon as we add recording
it validates if everything is okay stores that file in the bucket that we created before with
the credentials that we created before it assigns name updates the session so we have that file name
to be used later and that's it that's how we upload a video later what we want to do is in our
mobile application where we have the the listing of sessions per event we will go to the agenda
detail and as you can see we already changed this so we have a button that says watch recording
and that redirects to this recording screen that i've created which checks if there's
a file in s3 or not and if it has we show it using the video widget from autistic ui that needs a url
if not we will just show a blank state message and an option to go back to the agenda so let's take
care of this video widget that needs a url three different things that you can do to retrieve an
object from a bucket you can get the binary of the data or you can just get a pre-signed url
where you can directly access that object and that's what we are going to use this
in this video widget so if you go here the get recording fetching data from other resources
what we'll need is something from a amazon s3 that is the object get pre-signed url
so as you can see here we are getting the details of the session in particular so we can use this
as the key for the object that we want to retrieve as you remember let's and let's go back here as
we were putting the object to the bucket we were using the recording name the name of the file so
that's the key that s3 will have when we want to retrieve that object and so here what we will use
is what we updated in the database when we were uploading the video so we need a few things here
and once again we have some functions we want to use https because you believe in it
and get the bucket name as well with this we just need this output parameter assigned and
it's what we are doing here and this will be the url in order to finish we just need to assign get
recording url here and we are ready to go and so let's take it for a spin let's go to google chrome
and i already have the application open here let's go to the ceo keynote and we already have that
button watch recording but we don't have anything here so let's go to the back office search for
ceo and i want to upload a video let's upload it to s3 okay let me just check because we never know
and this is the bucket where it's supposed to happen the magic and here it is the seo keynote
and let's see what happens here so i think the ceo cannot heat here let's watch the recording
yep here it is awesome and that's how you can leverage s3 and outsystems together take into
account that as you are handling media files large files the network availability is an important
factor when you are implementing this use case it's not just drag and dropping some stuff
and yes if you were wondering i was using the mac service studio so if you like using mac os you can
now develop natively with service studio for mac os go to the downloads page and you can install
it so i guess that's it for today's episode let us know in the comments what other topics
you would like us to cover in this quick hits fashion so i guess i see you in the next one bye
you