Camera App inventor ( help)

Hello, my name is Lisa, I am 18 years old I am in my final year and I am leading a project where I have to create an Android application in which I have to show the video image of a camera but I do not know which camera take and how to make it work on the application.
Thank you for your understanding and thank you to those who will respond to this post

Hello Lisana

Well, it was wise to ask upfront about the cameras because one of the most popular, Based on an ESP32 controller board, does not have enough memory to work with Smartphones that are on Android v8 and above.

Typically, these cameras work over WiFi without requiring an internet connection. They “build” an HTML file (web page) which streams the video, so your App needs to be able to connect to the file in order to display the stream.

What to use? Much depends on what the camera is for (mobile or stationary, public or private, indoors or outdoors etc). Search the forum for “ESP32” to learn about the issues. I think it should be possible to find an ESP32 board or similar that does have enough memory (at least 1024 bytes instead of 512 bytes).

In fact, here is an explanation written by MIT Guru Evan Patton on our old Google Groups Forum:

Hi Frank,

I poked around a bit and tried to mimic this as best I could given that I don’t have a ESP32 Cam. Here are the results of my analysis.

Test apparatus:

A python server running on port 8000 with a single file stream. The IP address of the machine had the same length as the one given in your pictures.

This means that the HTTP request line and the Host headers are exactly the same length as in your scenario.

I used Wireshark on the server to capture incoming packets to the python server. Here’s an example of the packet sent from my phone. It may differ slightly from your phone, but I think the point should generally be the same:

GET /stream HTTP/1.1

Host: xxx.xxx.x.xxx:8000

Connection: keep-alive

Upgrade-Insecure-Requests: 1

User-Agent: Mozilla/5.0 (Linux; Android 8.1.0; Pixel Build/OPM1.171019.012; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome 78.0.3904.96 Mobile Safari/537.36

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,/;q=0.8,application/signed-exchange;v=b3

X-Requested-With: edu.mit.appinventor.aicompanion3

Accept-Encoding: gzip, deflate

Accept-Language: en-US,en;q=0.9

Based on what I’ve found about the ESP32 HTTP server processing of headers, the request line doesn’t count against the 512 bytes of headers, so we can start counting from the start of the Host field. The values, including the \r\n characters are as follows:

26
24
30
173
128
52 << this is the X-Requested-With header
32
33

which totals up to 498, 14 bytes shy of the 512 byte limit. If the host page has set cookies, then you’ll probably be above 512 and you’ll get the error. My guess is that your older version of Chrome that you downgrade to is not sending as many headers, and therefore gives you more flexibility in what works.

So how does this fit into compiled apps? As you can see on the X-Requested-With header we have the package name of the app. Your app’s package name will be appinventor.ai_<email address before @>., which is likely bound to be longer than edu.mit.appinventor.aicompanion3. For the example app I built, the package name was appinventor.ai_ewpatton.WebviewHeaderTest. The resulting packet was 507 bytes, just 5 bytes short of the limit. If I had made my project name much longer, or had a longer email address, then I would have tripped the issue.

If you send me the version of Chrome you downgrade to in order to get the project to work, I might be able to give you some more insights into what exactly is going on when you upgrade Chrome, but the best course of action here is probably to reload the firmware on your ESP with a bigger allocation for header processing.

Regards,

Evan

So, a board with more memory is required. I think something like this one should be good to go:

I’m going to assign your Topic to my fellow Power User Juan because he is an expert in this field.

Hi Lisa, I don’t know if you mean that the App captures video and is sent in stream, or that an external device, such as ESP32, Raspberry … captures images and sends it to the App.

  • I don’t think that with App Inventor you can capture video and send it in stream.

If you mean that an external device captures video and sends it,
You can work with Raspberry Pi, Phyton and a USB-Cam.

I send you some ideas that are in Spanish, but you can easily find similar tutorials in other languages:

  • Configure Raspberry as local WebServer, capture image with a USBCam and stream. In an App with WebView component you can view that video by typing its IP, example: http://192.168.1.12:8081

http://kio4.com/raspberry/24_webcam_usb.htm

  • Other ideas not related to Android:

.- Raspberry Pi shows TimeLapse.

http://kio4.com/raspberry/26_webcam_timelase.htm

.- When you change a static image taken by the USBCam, save the captured image and send it by Gmail.

http://kio4.com/raspberry/37_enviar_correo.htm

the problem is that the camera should be waterproof because we plan to make a marine robot and thank you very much for your answers and your advice

But we only work with arduino cards

For my application it would be necessary that the camera films the surroundings and that this is retransmitted on the android application that is all

It’s a good idea to host the cam on an Ardunio, that makes it easier because you can easily program Arduino - going to take a lot of experimenting!

Concerning underwater recording, it depends on whether you are streaming live to the App - it sounds like you are, in which case you are going to need a cable. You could possibly have the cam data sent from an Arduino in the Robot via Ethernet/data cable to another Arduino on dry land. The land-based box can send the data to a smartphone via WiFI or if not far away, via Bluetooth (BLE 4 Range 100m max outside, BLE 5 Range 1000m max outside.)

Sounds like a cracking project Grommet! Food for thought?

Obviously all the electronics (the heart) need to be housed in a waterproof container, but one you can still open. You could go down the 3D printing route (possibly you are for the other robot components?). However, it would take some time to create an enclosure to meet requirements - so I would also consider using an Industrial enclosure that already has waterproofing done and dusted. Then there is the waterproofing of the motors to consider…

So, team work, lots of hand drawn sketches and discussions, list of essential requirements, do not add complexity with unnecessary features, lots of prototyping and testing of individual features (hardware and software). KISS: Keep It Simple Stupid.

With Arduino UNO it must be difficult to make a video in stream. Here is a tutorial that captures images and sends them over WiFi.

Arduino Yun is more powerful, check out the Arduino forums:

…there are indeed a lot of different Arduino Boards available. You could ask for advice about which one to use with CAM on the Arduino forum:
https://forum.arduino.cc/

An interesting camera board:

How can we know if the camera works with App inventor?

The camera must work with the external processor: Arduino Yun, Raspberry, ESP32, …
The external processor must send the image stream by WiFi and the app (App Inventor) will display the image using the WebViewer component.

1 Like