Answered

Use Videoask to record a video from my website


Userlevel 1
Badge

Hi all, I’m developing a website and my customer wants to use videoask during the onboarding procedure (when an invited user enter in the website for the first time). In this phase, the user fills various fields like name, job, and so on, and, at the end, he should record a video with some information about him. My customer ask me to do it by using VideoAsk. After recording the video, I have to store something (I think some reference to the video) in my DB, so other users in the community can see the video.

How to do this by VideoAsk?

Thanks!

icon

Best answer by Grace 22 June 2022, 15:18

View original

14 replies

Userlevel 7
Badge +5

Hi @Luigi thanks for stopping by!

This sounds very cool, have you had a looks through the VideoAsk API documentation yet?

Sounds like you want to be sharing the responses of the video messages collected, is that right? 

Userlevel 1
Badge

Hi @Luigi thanks for stopping by!

This sounds very cool, have you had a looks through the VideoAsk API documentation yet?

Sounds like you want to be sharing the responses of the video messages collected, is that right? 

Yes, my idea is that each one who enter in the website for the first time, record a small video (using videoask, embedded in my website). Then I store the reference to this video, so every other user in the community can see this video once seeing the user’s card

Userlevel 7
Badge +5

Hi @Luigi this sounds great! 

You might be interested in watching our latest episode of VideoAsk Voyagers, we spoke to John and Ariana from Stigma and they are using VideoAsk in a similar way:

 

I’m sure John from @UnicornRoad would be happy to chat to you about tapping into the VideoAsk API to develop your website 😊

Userlevel 2
Badge

Thanks, @Grace Let me know, @Luigi 

Userlevel 1
Badge

Thanks, @Grace Let me know, @Luigi 

Hi John, I see the video, but it seems, for me, much more than I need… Basically I have in my website i “button” saying “introduce yourself”, during the onboarding procedure. The user can record a short video about him. A reference to this video will be stored in my database, so it can be seen by other users, when needed, by accessing the user's information.

I don’t know if I can do this by videoask….

Thanks

L.

 

Edit…

I made some tests, to understand well. I create a new videoask, Then I make a preview, recording a response video. A notification was sent to my email. All works. Now I have to switch to next level. I have to embed this videoask to my website. I think I coud do this by use the embed section or using an iframe. Ok. But I need some types of automation in this process. I have to collect data once a video is registered. I see I have to use the API, so I have to switch to a paid plan. After this I think I have the following things (please confirm, if you can):

Setup a “responde webhooks” for my videoask (so when some user records a video, an endpoint of my webapp is called to collect data. How can I know which user has recorded a video? can I set some variables when starting videoask, so this variable will be returned in the “response webhook”?)

With the data collected I can store in my DB the information. With these information, can I get, in the future, the response video recorded by the user, to show it in my webapp?

 

Userlevel 7
Badge +5

Hi @Luigi, thanks for asking your question here!

My understanding is that you’re looking for a reference or unique identifier for each response you receive. If so, you can use the contact_id field in the webhook that fires whenever you receive a new response (see below). This is a unique identifier for each response.

contact_id field in the webhook response

You can then make an API call using the documentation here (or screenshot below) to look up the contact_id and fetch the responses. However, this endpoint has a low rate limit. So it’s best practice to add what you need from the original webhook response to your own database. That way you can perform queries without limitations.

I hope this helps! Let me know if you have any questions.

Userlevel 1
Badge

Hi @Luigi, thanks for asking your question here!

My understanding is that you’re looking for a reference or unique identifier for each response you receive. If so, you can use the contact_id field in the webhook that fires whenever you receive a new response (see below). This is a unique identifier for each response.

contact_id field in the webhook response

You can then make an API call using the documentation here (or screenshot below) to look up the contact_id and fetch the responses. However, this endpoint has a low rate limit. So it’s best practice to add what you need from the original webhook response to your own database. That way you can perform queries without limitations.

I hope this helps! Let me know if you have any questions.

Ok, I have more clear ideas. My question is, if I use webhooks and 2 people make a response video at the same time, I will receive 2 calling to my endpoint. But I don’t know how to link one response to a user and one to the other one. What I have is only the id of my videoask (that I embed in my webapp as widget or as iframe, using https://www.videoask.com/xxxxxxx , for example). So I understand 2 users will record their videos, the webhook will fire 2 time, saying my endpoint that 2 people have record their video. I will receive 2 different contact id, but I don’t know how to link each one to the right user...

 

Userlevel 7
Badge +5

@Luigi I’d recommend collecting each respondent’s email within the videoask, allowing you to link responses to a specific user within your system.

Alternatively, if you already know their contact details, you can pass that information into the videoask using variables so respondents don’t have to manually enter their email.

Userlevel 1
Badge

@Luigi I’d recommend collecting each respondent’s email within the videoask, allowing you to link responses to a specific user within your system.

Alternatively, if you already know their contact details, you can pass that information into the videoask using variables so respondents don’t have to manually enter their email.

Obviously when starting a videoask I know at least the ID (in my db) of the user. How can I pass this id when starting a videoask by embedding code, or by iframe, so I can retreive also this information in the webhook reply?

Thanks!

Userlevel 7
Badge +5

@Luigi You’d want to pass the user ID into the URL of the webpage, then you could use some JavaScript code to pull that user ID parameter from the webpage URL into the videoask embed URL.

For example: www.example.com?user-id=123 → www.videoask.com/xxxxx?user-id=123 

Here’s some code that achieves something similar to what you’re looking for:

<!DOCTYPE html>
<html>
<head>
</head>
<body>

<script>

const pathname = window.location.pathname;
var iframe = document.createElement('iframe');
iframe.setAttribute('id', 'iframe');
iframe.style.width = "640px";
iframe.style.height = "480px";
iframe.style.border = "none";
iframe.allow = "camera *; microphone *; autoplay *; encrypted-media *; fullscreen *; display-capture *;"

document.body.appendChild(iframe);

iframe.setAttribute('src', 'https://www.videoask.com/XXXXXXXXXX#source=' + pathname, 'allow', '"camera *; microphone *; autoplay *; encrypted-media *; fullscreen *; display-capture *;"', 'width', '"100%"', 'height', '"600px"', 'style', '"border: none; border-radius: 24px"');

</script>

</body>
</html>

Instead of passing URL parameters, however, it passes the path of the webpage to videoask as a variable called “source”.

To see how this demo works, you’ll want to do three things:

  1. Embed this code on a page that has a path (e.g. example.com/demo)
  2. Create a custom variable in your videoask called “source” (or whichever name you prefer)
  3. Replace the https://www.videoask.com/XXXXXXXXXX#source= part of the code with your videoask URL (make sure to include the custom variable you just created at the end, too!)

Now when responses come through in videoask, you should see the page path / source variable come through. This information would also be available in the webhook response.

Again, this is just some sample code that does something similar. You’d have to make some tweaks for it to solve your specific use case, but this should help get you one step closer!

Userlevel 1
Badge

@Luigi You’d want to pass the user ID into the URL of the webpage, then you could use some JavaScript code to pull that user ID parameter from the webpage URL into the videoask embed URL.

For example: www.example.com?user-id=123 → www.videoask.com/xxxxx?user-id=123 

Here’s some code that achieves something similar to what you’re looking for:

<!DOCTYPE html>
<html>
<head>
</head>
<body>

<script>

const pathname = window.location.pathname;
var iframe = document.createElement('iframe');
iframe.setAttribute('id', 'iframe');
iframe.style.width = "640px";
iframe.style.height = "480px";
iframe.style.border = "none";
iframe.allow = "camera *; microphone *; autoplay *; encrypted-media *; fullscreen *; display-capture *;"

document.body.appendChild(iframe);

iframe.setAttribute('src', 'https://www.videoask.com/XXXXXXXXXX#source=' + pathname, 'allow', '"camera *; microphone *; autoplay *; encrypted-media *; fullscreen *; display-capture *;"', 'width', '"100%"', 'height', '"600px"', 'style', '"border: none; border-radius: 24px"');

</script>

</body>
</html>

Instead of passing URL parameters, however, it passes the path of the webpage to videoask as a variable called “source”.

To see how this demo works, you’ll want to do three things:

  1. Embed this code on a page that has a path (e.g. example.com/demo)
  2. Create a custom variable in your videoask called “source” (or whichever name you prefer)
  3. Replace the https://www.videoask.com/XXXXXXXXXX#source= part of the code with your videoask URL (make sure to include the custom variable you just created at the end, too!)

Now when responses come through in videoask, you should see the page path / source variable come through. This information would also be available in the webhook response.

Again, this is just some sample code that does something similar. You’d have to make some tweaks for it to solve your specific use case, but this should help get you one step closer!

Seems right, thanks. I think I can pass directly the id, in the iframe src, like “https://www.videoask.com/XXXXX?source=15”, So, in the webhook reply, I will find the page path, in wich I will find the “source=15” part, So I’ll be able to associate the reply to the user ID.

Now, how can create a custom variable? I’m looking for it in the setting of my videoask, but I can’t find anything related to the creation of custom variables…

 

Thanks again

L.

Userlevel 1
Badge

Or.. maybe the variable you intend is not a real variable…. maybe I don’t need a variable. If I use a src with a ?source=15 in it, I will find this string in the webhook reply….

And for the API, there is a way to test the API, with the webhook replies, before buying it? If all works as I expected, I will subcribe the plan, but I don’t know if all works as I expected… Don’t you know if there are the possibility to test the api?

thanks

L.

Userlevel 7
Badge +5

Hi @Luigi!

You can create a variable by going into the Share & Embed settings of your videoask (see screenshot). You’ll want to create a variable, otherwise the value of the URL parameter won’t be saved. 

Unfortunately, webhooks aren’t available on the free/Start plan. You’ll need access to at least the Grow plan. However, if there’s specific information you’re looking for in a webhook response, I can run a test and let you know if it’s available.

Hi @Luigi, thanks for asking your question here!

My understanding is that you’re looking for a reference or unique identifier for each response you receive. If so, you can use the contact_id field in the webhook that fires whenever you receive a new response (see below). This is a unique identifier for each response.

contact_id field in the webhook response

You can then make an API call using the documentation here (or screenshot below) to look up the contact_id and fetch the responses. However, this endpoint has a low rate limit. So it’s best practice to add what you need from the original webhook response to your own database. That way you can perform queries without limitations.

I hope this helps! Let me know if you have any questions.

Ok, I have more clear ideas. My question is, if I use webhooks and 2 people make a response video at the same time, I will receive 2 calling to my endpoint. But I don’t know how to link one response to a user and one to the other one. What I have is only the id of my videoask (that I embed in my webapp as widget or as iframe, using https://www.videoask.com/xxxxxxx , for example). So I understand 2 users will record their videos, the webhook will fire 2 time, saying my endpoint that 2 people have record their video. I will receive 2 different contact id, but I don’t know how to link each one to the right user...

 

Thanks its very helpful for me.

Reply