Is it safe to place Spark Core Token number in a Webpage?

Thanks again. I will do a change from the IDE.

The device ID is hard-coded on the STM32, but in the long run this might become flexible, especially if we want to support other microcontrollers down the road.

I would say that for security purposes that you should keep your access token secret but feel free to publish the Core’s ID, because the ID doesn’t give anyone access without the token. The ID is like its URL, in the context of the Cloud. Knowing the URL doesn’t give you access unless you have proper authentication.

@zach

That’s really good to know as I will only have to conceal the token only.

Thanks

Bobby

Hi bko,
Very curious. How do you use take a look at the serial port read out? I know how it works with the Arduino IDE, but I didnt thought it is used for the spark.

HI @Wildfire

I am not 100% sure I understand your question but if you mean, how do you use the serial port for debugging without the Arduino IDE, then the answer is that you just need terminal program on your PC/Mac/Linux that you have plugged the USB cable from the spark into. Here's the doc section:

Serial: This channel communicates through the USB port and when connected to a computer, will show up as a virtual COM port.

On my Mac, I usually use CoolTerm but there are lots of choices for all the common platforms. Folks have said that the Arduino IDE terminal program is not a good choice, but I have not tried it myself.

Did that answer your question?

@Wildfire

If your asking how to see the serial output from the Spark Core ? Use a tutorial by @BDub that explains how to install the Windows USB Port Driver and once that’s done you can use the Arduino IDE to see the Core’s output to the serial port; selecting just the COM PORT. https://community.spark.io/t/installing-the-usb-driver-on-windows-serial-debugging/882

Disclaimer: I am a Newbie and @bko @BDub have helped me with this too. (Credit Given)

Hello bko,
Thanks for your quick reply. Yes, I mend that I would like to use the serial port for debugging, like I normally use with my Arduino and the Arduino IDE. Do I correctly understand from you reply that it is possible to use the serial port option of the Arduino IDE with the spark core? (how do you do this, I am not able to select the COM port).
I’m using windows btw

edit: I just your reply spydrop. Thanks for the link, that was very helpful!

I only know what I know because of this Community is so helpful.

Your Welcome and don’t hesitate to ask for help.

Hi @Wildfire

If you are on Windows, I think you got the best answer from @spydrop and @BDub. If you are on a Mac instead just let us know and we will point you in the right direction.

Mmm, perhaps I jumped a bit too early. I got the spark driver installed and have port 6 and 7 for my two sparks. But I need to have the spark in blue flashing mode to select the port in Arduino IDE to open the serial monitor. But when I do this, I dont see any result in the serial monitor even though I flashed the spark with the firmware below. Is the firmware actually running when the spark is in blue flashing mode?

int count = 0;
void setup() {
Serial.begin(9600);
Spark.variable("count", &count, INT);
}

void loop() {
count = count + 1;
Serial.println(count);
delay(1000);
}

Nope! Flashing blue means that the Core is in Smart Config mode, and it is waiting to receive Wi-Fi credentials. In this mode, it's not running user defined firmware. You can connect to the Core over Serial in this mode, but only to send your Core an SSID/PW or to read off your Core's device ID.

If you flashed the code from above to your Core, it should open up a Serial connection that you can monitor using a Serial monitor like CoolTerm or Arduino's IDE.

@Wildfire I would not use the arduino IDE for the Spark Core. Your best bet on windows in my opinion is Tera Term VT. To use the serial output over USB, it’s a little tricky on windows because if you are sending data before you open your serial terminal, windows thinks the port is in use already.

On my tutorial about halfway down where is says “DRIVER INSTALLED!!! NOW LET’S USE IT!” follow that part and try that code example. This effectively pauses the Spark Core while we open the Serial terminal. I’m going to amend that post and code in a second with a little trick I use now. While we are waiting to open the port, we might as well punch the background tasks:

void setup(){
  Serial.begin(115200);
  while(!Serial.available()) SPARK_WLAN_Loop();
}

@Bdub thanks! I got it running with Tera Term. It appears that when I plug the core into the USB and start TT when the cyan breathing starts, the serial connection is made without a problem.
A core with your code and that is not connected to a terminal, would it still be on hold? If it would, this would be a bit annoying during debugging, wouldn’t it?

Excellent ! Glad to see others benefiting from this forum but, Make sure to Thank both @BDub @bko as they the ones who helped me to help you :slight_smile: Did I say that right ?

Keep us posted on your progress and share any projects you create.

Bobby

1 Like

Sometimes if you are not sending data to the Serial port too fast, you can open Tera Term without a problem in-between writes. But other times you need to pause the program to allow you to open Tera Term. If you need it, it’s not annoying. If you don’t need it, it could be annoying depending on your application. I wanna say Arduino solved this problem by resetting the ATMega328p via the DTR line every time the Serial Monitor was opened… thus avoiding conflicts with the port. That’s VERY annoying because your app will start to run, and then you reset it when open the serial monitor, then it runs again. There are similar ways to pause your Arduino from running until the Serial port is opened though. Every dev platform has it’s little quirks.

Let’s consider what would happen if you didn’t have to pause your program to open your serial terminal… you program your part, it resets and runs… it begins the serial stuff which loads the COM driver, this is the first point you could open the serial terminal… now your code is running and data is being transmitted to the computer… but your serial terminal is not open yet… come on SON, open that thing, you’re missing data! So the downside to having convenience is decreased effectiveness/performance/usability (call it what you will).

If you are debugging over serial, pausing probably makes more sense… so you can catch the first instance of something, or start looking at your debug information at a known point in time. If you are not debugging, but are just playing… lost numbers whizzing past might not matter much (like just seeing the output of your accelerometer).

Are there any examples in the docs or forums showing how to keep the token (and ID) secret?

I build a candy dispenser using my Spark Core that is triggered from a button on a public web page and everything is working fine. But if I view source - there are my ID and token for the world to see.

So I was wondering if people had specific recommendations for how to hide this info. My current webpage is incredible simple - button and send() function using ajax POST (tip of the hat to @gaudsend for sharing his code).

Does HTML support include files? Should I convert it to PHP so I can use a access.h file to hide the values? Would that even work? My HTML coding chops are very rusty so any help greatly appreciated.

Hi @longarc I started this topic a while back because there is no help in the Docs for this very important situation but, the community has been very helpful in pointing me in the right direction. see my video below where I am controlling spark core from HTML file using jquery Post request.

Credit: My Code is based from work by PDP11’s Pastebin http://pastebin.com/ZA22CGKn

@longarc If you are using jquery to make your $.Post request in your html page that is best; I believe. It can be done with PHP as well by using a PHP file include statement in your HTML file and setting permissions on the external PHP file in a sub-directory will conceal the access token. In addition, adding an isset() statement in the external php file containing the access token to validate the request as a valid request from same particular domain or that the request being made is a post request makes it virtually hacker proof.

If someone can help me with a simple syntax for appending a jquery variable to the end of my jquery Post request I have what you need @longarc

So @bko & @BDub & @Timb & other spark elite & Spark Team members your help would be very much appreciated in this quest to simplify the HTML / jquery control of the spark core and allow I, @longarc and other community members the ability to conceal our access token. Great Idea Right ? :smile:

QUESTION: What is the proper syntax to append a jquery variable to the following jquery Post statement.


function phoneOFF()
{
 $.post("https://api.spark.io/v1/devices/48ff6f065067555028091087/digitalwrite?access_token=**{insert jquery variable syntax here}**",
    {
		args:"D7,LOW"
		
    });
}

// jquery exernal file:

$(document).ready(function(){

  var $accessToken = '9876123947861293874612938746192873648976';

});

Test Files are here live to my core - Not protected for real time testing.

http://bartertronics.com/test/test.html

http://bartertronics.com/test/code.txt

http://bartertronics.com/test/includes/magic_token.js

VIDEO OF MY TESTING

I would say:

function phoneOFF()
{
  $.post("https://api.spark.io/v1/devices/48ff6f065067555028091087/digitalwrite",
  {
    args:"D7,LOW",
    access_token:"978612398476219387461293874691287346"
  });
}

This part is inline JSON:

{
  args:"D7,LOW",
  access_token:"978612398476219387461293874691287346"
}

This is useful documentation:
https://api.jquery.com/jQuery.post/

And you can see a nice example with callback there:

$.post( "test.php", { name: "John", time: "2pm" })
  .done(function( data ) {
    alert( "Data Loaded: " + data );
});

@BDub Thanks & yes the inline works but, what I am trying to do is like an include statement from PHP.

I want to set the acess_token number to a jquery variable in an external magic_token.js file; include the file as Javascript/text file in the HTML file < -----Head -----> Seciton; and finally place the access_token variable in the jquery $.Post statment.

I can do it in PHP but, I can not figure out proper syntax for using jquery to append the access_token number in the jquery $.Post statement.

Help is appreciated and its all I need to finish for user interface so I can hook up my spark core to my MagicStop Controller; do a video; start my campaign to stop the Spies and finally take overt the world (LOL) :smile:

Ok here’s part of the problem:

Just add test/to your path in your HTML file.

<script type="text/javascript" src="/test/includes/magic_token.js"></script>

Actually I see you are running your HTML file from the TEST directory, so I’m not sure why it’s trying to load from the root of your website… but it is.

or maybe

<script type="text/javascript" src="./includes/magic_token.js"></script>


Then in your code you can use it like:

function phoneOFF()
{
  $.post("https://api.spark.io/v1/devices/48ff6f065067555028091087/digitalwrite",
  {
    args:"D7,LOW",
    access_token: $accessToken
  });
}

and then CHANGE YOUR ACCESS TOKEN so NSA is not all up in your CORES :stuck_out_tongue: