Browser API commands won't turn on/off LED. CLI commands do

I have an Electron particle board that works with variables and functions so I can turn on an LED.

The following curl commands work from the terminal. When I enter just the https://… portion in the browser, I expect the commands to work, but they don’t. Why not? What do I need to do to make it work from a browser? The goal is to get it to work from an Android Studio App.

curl https://api.particle.io/v1/devices/myDeviceID/led -d arg=off -d access_token=myToken

curl https://api.particle.io/v1/devices/myDeviceID/led -d access_token=myToken

The browser uses a GET request but Particle.function() calls require a POST request.

So this means that it cannot be done in the Browsers URL address? Must it then be done in a JavaScript file?

I am relatively new at the languages, Java Script and node.js .

A few examples of of actually turning on an LED from a web page and an Android Studio would have been good for most everybody.

If so, I have done this within a Java Script file using a form, but the response always replaces the web page. How does one stop the response from writing a new screen?

Here’s the code below. The html code shows up in the edit screen, but not here.

<!-- Replace your-device-ID-goes-here with your actual device ID
and replace your-access-token-goes-here with your actual access token-->
<!DOCTYPE>
<html>
  <body>
  <center>
  <br>
  <br>
  <br>
  <form action="https://api.particle.io/v1/devices/EI/led?access_token=myToken" method="POST">
    EI LED DEMO<br>
    <br>
    <button type="submit" name="arg" value="on">ON</button>
    <br><br><br>
    <button type="submit" name="arg" value="off">OFF</button>
    <br>
  </form>
  </center>
  </body>
</html>

That would be the preferred way, but just recently there was a post that shows how to do it from the browser URL bar

When you mention Android Studio you better investigate the Particle Android SDK
https://docs.particle.io/reference/SDKs/android/

And here is a (slightly dated) tutorial

1 Like

Application shows two buttons, on and off initially shaded gray. Clicking/pressing the on button turned on the Electron’s LED and turns the on button green and the off button to a lighter gray. Clicking/pressing the off button turns off the Electrons LED and turns the on and off button to a darker gray. Yet to be resolved, changing the botton’s colors as a response to the JSON code response. This example utilizes the concept of CSS classes for the buttons.
Visual Studio Code used as the editor. Great for color selection and many other editor functions for HTML and CSS etc.

I had to dig into HTML, CSS, JavaScript, and JQuery to do this and to understand the above example.

Any suggestions on how to read the response before changing the button colors?

How is the security with this setup?

<!DOCTYPE HTML>

<html>

<script src=“http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js” type=“text/javascript” charset=“utf-8”></script>

<head>

<meta name=“viewport” content=“width=device-width, initial-scale=1.0”>

<title>LED/BUTTON DEMO 1</title>

<style>

container {

display: flex;

flex-direction: row;

}

button {

width: .6in;

height: 0.4in;

}

/* classes */

.onbutton {

background-color: #d8d4d4;

}

.offbutton {

background-color: #d8d4d4;

}

</style>

</head>

<body>

<br><br>

<button class=“onbutton” value=“on” onclick=“turnon(on)”>ON</button>

<button class=“offbutton” value=“off” onclick=“turnoff(off)”>OFF</button>

<script type=“text/javascript”>

var deviceID = “myDeviceID”;

var accessToken = “myAccessToken”;

var setFunc = “led”;

var on = “on”;

var off = “off”;

function particleSetLED(newValue) {

var requestURL = “https://api.particle.io/v1/devices/” + deviceID + “/” + setFunc + “/”;

$.post( requestURL, { params: newValue, access_token: accessToken });

}

function turnon(onstate) {

particleSetLED(onstate);

$(".onbutton").css(“background-color”, “#83fc73”);

$(".offbutton").css(“background-color”, “#f1f1f1”);

}

function turnoff(offstate) {

particleSetLED(offstate);

$(".onbutton").css(“background-color”, “#d8d4d4”);

$(".offbutton").css(“background-color”, “#d8d4d4”);

}

</script>

</body>

</html>