Adding live feed from a camera

Ask the community
, , ,
1

Question:
I want to add a trails condition cam to my website. Like what they have for webcams for road conditions where its just an updated picture every so many mins. I would want it to update every 60 mins. Is this possible to do? What camera/hardware would work best for this?

Product:
When we took over the business they had a website with wix. So right now I have been trying to create a new updated website I don’t like the website they had. So i have been using wix editor but might try wix studio

What are you trying to achieve:
To be able to grab images from an outdoor camera to update on the website so people can see how much snow we have.

2

There are several steps you will need to do, or to pay attention at.

  1. Camera should be waterprooved. (Allwether-camera).
  2. Camera doesn’t neccessarely need to have a interval-shot-function, this can be done also by coding.
  3. Camera could offer cloud-storage-options, but also not a must (but a nice to have).
  4. 2 options of where and how to store your camera-shots (directly on wix, or like mentioned before → cloud-based)
  5. Generating a code which would work regarding the used technique (cloud-based or direct by wix storage).
  6. Code will need an INTERVAL-FUNCTION which would update pics every few seconds or minutes (can be designed optional) .

Code could look like something like…

$w.onReady(function () {
    // Function to fetch and update the image
    function updateImage() {
        // Make an HTTP request to fetch the latest image URL
        // Replace 'YOUR_IMAGE_URL' with the actual URL of your image
        fetch('YOUR_IMAGE_URL')
            .then(response => response.text())
            .then(imageUrl => {
                // Update the src attribute of the image element
                $w('#imageElement').src = imageUrl;
            })
            .catch(error => {
                console.error('Error fetching image:', error);
            });
    }

    // Initial call to update the image
    updateImage();

    // Set up a timer to update the image every 60 minutes
    setInterval(updateImage, 60 * 60 * 1000); // 60 minutes in milliseconds
});