Remote Spark Web App


#8

Sorry @BDub, maybe I’m being a bit thick! I can’t see an index.php on @Coffee’s github repository. If I follow one of the links there to an older Arduino repository, there is an index.php there, but I don’t think its Spark Core related


#9

Here is a http example:

https://github.com/synox/spark-core-examples/blob/master/http_timeapi.cpp


#10

Thanks for posting that, @Coffee. Seems to be some firmware code to get the current time from an internet time service. That will be useful to me.

But I am still not understanding how it helps me hide my core id and token on web pages I publish that need to display Spark variables?


#11

@PaulRB Sorry I missunderstood your problem.
What you need to do:

  • Upload this html to a webserver
  • Create a PHP-Script that forwards the request to the Spark-Cloud
  • Access the PHP Script from the html file. The Admin-Token would be added with in the php script.

What @BDub was refering to was to following file, which I deleted already: https://github.com/synox/Spark-Busstop-Light/blob/2df182763ca91c566d166e2aa04d17594a2dcc57/php_webservice/index.php#L16


#12

I though that must have been what happened. Your link is the file I mentioned in my post earlier. Its an Arduino application and doesn’t show any example calls to spark cloud, so its only so much use to me as an example, unfortunately.

So… PHP… another new language to get to grips with!

Question: This PHP script will be hosted on my web server, correct? And the Javascript in my HTML page will query that instead of querying the spark cloud directly. If the PHP script has the core ID and token in it, what’s to stop anyone taking it from there?

Thanks for your patience with this web-dev-noob!

Paul


#13

Paul, it’s ok, thats’s how we all started. :wink:

The script is executed on the server, so everything somebody else can see is the response of the request, not the source code.

I would do something like this. It takes all the parameters, adds the access token, and sends it to the api.

<?php
$device = $_REQUEST["device"];
$method = $_REQUEST["method"];
if(!$device||!$method) die("device or method param missing\n");


// add access token
$_REQUEST["access_token"] = "12399....123123";

// create params
$params = http_build_query($_REQUEST);

// make request
$url = "https://api.spark.io/v1/devices/" . $device . "/" . $method . "?" . $params;
$response = file_get_contents($url);
echo $response; 
?>

PS: I didn’t test it :wink:


HTML, ajax, and php proxy Variable Calls work, Function Calls don't [Solved]
#14

Awexome! Glad I got you two hooked up on this! Please be sure to share your final code @PaulRB as it would be a great example :wink:


#15

Hi PaulRB, can you share yours, or did I miss somethinh? :smile:


#16

Thanks @Coffee. Despite not knowing any PHP, I think I follow what it is doing. I could hide the core id too, by changing it to not expect that as a parameter, and adding it to the forwarded request, just like the access token.

OK, great. Now, what do I do with the above code? Just drop it onto my web server, any particular file name? Which folder (presumably not public_html)?And how do I change my web page’s javascript/JQuery to refer to it?

Happy to share all files once that’s working!

Thanks,

Paul


#17

I seem to have got it to work:

I took @Coffee’s PHP script, put my access token in it and uploaded it to my web server as “weather.php” into the public_html folder.

Then I changed my html (the one based on @BDub’s original remote control app) as follows:

Removed my access token;

Change the line

var baseURL = "https://api.spark.io/v1/devices/";

to

var baseURL = "weather.php";

and the line

  var url = baseURL + coreID + "/" + variable + "?access_token=" + accessToken;

to

  var url = baseURL + "?method=" + variable + "&device=" + coreID;

I am not using any spark functions, only variables, so I did not fix the parts of the javascript code that deal with functions.

Have I done this correctly?

I am still concerned that someone could download my weather.php file and get the access token from that, although I can’t seem to be able to do it myself.

Thanks again @Coffee and @BDub, the web-dev-fog is starting to clear a little for me!


#18

Hi @PaulRB,

Last time I used PHP, my goto method for securing config data was to make a “config.php” file somewhere out of the web root (depends on how you’re hosting it), and readable by the web-server uid, and include a reference to that in your page. In theory your web server should be sensible enough to not serve php source, but in the event that fails somehow at least your config file is not visible without some other more extensive hack.


#19

Technically it depends how your web server is configured, but generally when a server is set up to run a program like a PHP script it won’t respond with the source of the program itself, but rather run the program and send the result to the client. So, the privacy of your token depends on the resistance of your web server to hacking or other malicious activity.

Edit: yup, what @Dave said… lol


#20

Thanks @amanfredi, yes, that’s what seem to happen when I try to view the .php file using my browser. I’m no hacker though, so I don’t know how securely my web server is set up. I pay for it anually, I certainly didn’t set it up myself!


#21

This is it so far…

Weather Station


#22

I know this thread has somewhat died, but I am all of a sudden having trouble with this web app. It was correctly working for me last Sunday, but for some reason is no longer working and I cannot seem to figure out why. I am using it for something simple and very similar to @PaulRB’s Weather Station; just using it to call some Spark.variable()s, which should be simple enough. The Remote-Spark code is generally unchanged, except for substituting my access token, my coreID, and variables that I am trying to retrieve. And, like I previously mentioned, this was working for me last weekend, but is not now. Is anyone else (that is using this code) experiencing similar problems?

FWIW, the Spark-Helper app is working just fine to call my Spark.variable()s, so I am totally stumped as to why Spark-Helper works but Remote-Spark does not. Any direction would be greatly appreciated.


#23

Hi @kherman,

If you’re having trouble using an API helper, or the web IDE, make sure your access token hasn’t changed since the last time you used it. Sometimes it’s also helpful to refresh the web IDE page, or log out and back in.

Otherwise, what kind of errors are you seeing? We also removed “TEMPORARY_allTypes” from the variable return format, so it’s possible this code is expecting that to be present.

Thanks!
David


#24

Hi @Dave

I did make sure that my access token had not changed; I even re-copy/pasted it directly from the Spark IDE as part of my troubleshooting. I have refreshed the page, restarted, and even tried 3 different browsers (IE, Chrome, and Comodo Dragon), in both Remote-Spark and Spark-Helper.

I don’t receive any errors at all from Remote-Spark API, just ‘—’ in the respective variable boxes (which I believe means that it’s not getting anything back).

I think you just identified the issue with the “TEMPORARY_allTypes” because, yes, the Remote-Spark code does use it. See below. I suppose I should try to hack the Spark-Helper API then, unless you have another workaround? The web app is rather important to my intended application (and web development is definitely not my strong area), so it’s kind of a requirement to use a website based API.

        function getVariable(variable, callback) {
      var url = baseURL + coreID + "/" + variable + "?access_token=" + accessToken;
      $.ajax({
        url: url,
        dataType: "json"
      }).success(function(obj) {
        console.log(obj);
        (obj.coreInfo.deviceID && obj.coreInfo.deviceID == coreID) ? onMethodSuccess() : onMethodFailure((obj.error)?obj.error:"");
        callback(obj.TEMPORARY_allTypes.number);
      }).fail(function(obj) {
        onMethodFailure();
      });
    }

#25

Yeah sorry about that! It’s on my backlog list to update my repos, honest!


#26

In the meantime it’s just a matter of replacing:

obj.TEMPORARY_allTypes.number

with something like:

obj.result

Thanks @BDub! Sorry we didn’t give more notice about that change!


#27

@BDub awesome! You already rock for putting up your Remote-Spark so we can all benefit from it in each of our projects! Your efforts are already GREATLY appreciated. At least I know now I’m not going crazy…

@Dave thanks for the quick solution. I will replace while also try to explore the reasoning. I’m in the process of trying to add jQuery to my toolchest of knowledge, so I’m sure that understanding will be helpful to me in the future.