0

I have a esp32 in my home which i have programmed for controlling some christmas lights. I have set up a http server on it connected to my home wifi, and can control it by sending http requests to 10.0.0.22 using either the web browser or postman.

I would prefer to be able to make post requests and control the request body from the ui.

I do not have any other server in my home, and do not want to expose the esp32 to anything outside my home wifi.
What is a good way to build a ui for the lights where i do not hit these issues?

When i try make a UI using e.g. javascript i get hit by a a bunch of security walls (understandably). I tried using flutter, and it works in dev, but when i installed the apk to an android phone it stopped working. In flutter i used the http library.

1
  • This is an extremely broad question. You're basically looking for a tutorial, and StackOverflow is intended for focussed questions. Have you considered just running WLED? Commented Dec 1, 2022 at 18:24

1 Answer 1

0

You could make an android app, is fairly simple, then you could make a json string and send it as a POST html message from android app, to the local IP of the ESP32. I made a code similar a time ago and looks something like this:

       ui.button.setOnClickListener {
        ui.visorTexto.setText("")
        //val url = "http://192.168.100.235"
        val url = ui.urlTexto.text.toString()
        val jsonBody = JSONObject()
        //val valorPin = ui.pinTexto.text.toString().toIntOrNull()
        //val valorEstado = ui.estadoTexto.text.toString().toIntOrNull()
        val valorPin = 1
        val valorEstado = 1000

        if (valorPin != null) {
            if(valorPin in 0..13){
                if (valorEstado != null) {
                    if(valorEstado >= 0 && valorEstado <= 2000){
                        jsonBody.put("opcion", valorPin.toString())
                        jsonBody.put("tiempo", valorEstado.toString())

                        val jsonObjectRequest = JsonObjectRequest(Request.Method.POST, url, jsonBody,
                            { response -> ui.visorTexto.setText(response.toString())}
                        ) { error -> ui.visorTexto.setText(error.printStackTrace().toString()) }


                        jsonObjectRequest.retryPolicy = DefaultRetryPolicy(
                            10000,
                            DefaultRetryPolicy.DEFAULT_MAX_RETRIES,
                            DefaultRetryPolicy.DEFAULT_BACKOFF_MULT
                        )


                        val cache = DiskBasedCache(cacheDir, 1024 * 1024) // 1MB cap
                        val network = BasicNetwork(HurlStack())
                        var requestQueue = RequestQueue(cache, network).apply {
                            start()

                        }
                        requestQueue.add(jsonObjectRequest)

                    } else{
                        ui.visorTexto.setText("Error el estado es incorrecto: ${valorEstado}")
                    }
                }
                else{
                    ui.visorTexto.setText("Error2")

                }
            } else{
                ui.visorTexto.setText("Error el rango de pin es incorrecto")

            }
        }
        else{
            ui.visorTexto.setText("Error1 ${valorPin}")
        }






    }

The user interface on android studio just have a button, and the options to make a led on or off, any of the digital pins of the ESP32. I used kotling and Android Studio Dolphin.

Sign up to request clarification or add additional context in comments.

1 Comment

I had tried this earlier, but didnt get it to work. Your comment inspired me and so now i got it to work, thanks. Also used these two stackoverflow.com/questions/60090417/… stackoverflow.com/questions/45940861/…

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.