I am currently developing a C# application that pulls information from a specific program. The information is pulled and updated about once every second. I want to export the information to a locally stored website (with HTML, CSS, and JS), and have it updated constantly without any need of refreshing the page.
Is there any way to do this?
The information stored will be in a string format, if it helps.
You will need to have a server read in the data and serve it on some path. The client webpage can make AJAX requests at timed intervals to get the data from the server.
If you have a domain name like http://example.com and you serve the data from /dataPath, then the client-side javascript that pulls data from the server every second could look something like this:
(function timedFunction () {
setTimeout(function getData () {
fetch('http://example.com/dataPath')
.then(function(response) {
// Do something with data
});
timedFunction();
}, 1000);
})();
Related
Is there a way to read the user's date when first requesting a page to the server? I'm puzzled on how to sync server time and client time, and maybe sending the client time to the server would be a good solution.
I'm currently doing the inverse, outputting the server time on the page, so JS will read it, but I need to actually read the user's time and then process data on the server based on it.
The only way I can do it until now is loading the page then using an ajax call to send the time.
From the client side, you can execute an XmlHttpRequest to the server using jQuery:
$(function() {
var userTime = new Date();
$.post("path/to/record.php", {"userTime": userTime}, function(data) {
// do something with data, if necessary...
});
});
On the server, you can log the information however you feel fit:
<?php
if(!empty($_POST['userTime'])) {
$userTime = $_POST['userTime'];
// do something with it.
}
?>
I am trying to write my first chrome extension. The workflow goes something like this -When the extension is installed and active if a user hovers over a specific product/ID displayed on the page, the extension retrieves related vendor data about the product with the ID.
This is how I thought about this:
Use jQuery attr to access the ID on mouse over.
Post this ID to a retrieve.php file with .post() method
The retrieve.php file retrieves the data from database
Display the data in a tool tip on the web page.
I have some queries for the above process:
I am able to get this working on a local XAMPP server but how will it work online as the chrome extension will not have access to server. What is the way around to retrieve data without using PHP?
I am able to get the logic working but am unable to place these in respective files - Will all my logic reside in background.js ?
Any suggestions on getting this started will be much appreciated.
You could build a very simple API on your server that responds with JSON to any request it receives after processing it. Like this:
{"firstVar":"foo","secondVar":"bar" }
Your chrome extension can then make an xmlhttp request to this server and and process the returned data.(You could also use JSONP and wrap the response in a callback function which will execute as soon as you have the reponse)
The JS extension will be able to deal with the JSON nicely as it can understand that format so you can then choose to display the data in whatever way you want.
Essentially, what you want is a server that can take an ID posted to it and return the corresponding date in a nice and readable format. And a chrome extension that can make an request to a server and then process the response. Build and test them separately (keep positing an ID to the server and see the response and for your JS side at first instead of making requests to your unfinished API just set a static response to begin with which will be the same as an expected response.
I have a website with a form (currently it's plain HTML but we're switching to JQuery). The flow is like this :
Take in the user's inputs --- 5 integers
Make a call to a web service via REST
Run some calculations server side... and generate a JSON object
??? Now I have my result JSON object, but how do I get it to the client? Persist it?
??? Does the URL need to be the exact location of the JSON file? That would mean 100's
??? of JSON files in my web server's DIR.
D3.js on the client side, waits for the data to be present (via AJAX?).
var data; // a global
d3.json("path/to/file.json", function(error, json) {
if (error) return console.warn(error);
data = json;
visualizeit();
});
Once data is present, render for the client, and remove the calculator from the screen.
I'm having a tough time here, because I notice all AJAX requests need a URL.. but then does that mean I need to give a unique URL to each resulting JSON object? Doesn't that mean I need to persist that object?
I'd just like to have d3.js render my JSON object but unclear what are my options for where to put it.
How do I post parameter on d3.json?
Typically, you will pass some parameters via a javascript object or
a query parameter.
Basically, something like...
data = {}
data.var1 =5;
data.var2 =10;
var my_request = d3.xhr(url)
my_request.post(JSON.stringify(data), function(error,received)){
};
Or
d3.json(url+"?"+"var1=5&var2=10",function(error,received)){
}
Obviously, these form parameters can be parsed on the server easily. After the values are parsed on sever, the server can generate the new JSON using the form parameters that have been parsed.
Make sure that if you are running the script from a local page (or a page that is not on the website) that the server has the ability to allow cross origin (or domain) requests.
If you want to persist the data across multiple calls, you will probably have to to embed the callbacks, or use global variables.
I have a static page (by static, I mean html, css and javascript are fixed on the page).
On the server side, I can tell (based on server-side session info) whether this is the first loading of the page or not by a particular user. Now, based on this detail, I want to signal the front end (e.g. by setting something in the response header, maybe?), so that a javascript function on the page can perform some action based on whether this is the first time the user has landed on this page.
The server that actually serves the page is Nginx, and the server that handles the logic, session, etc is Tornado. So presumably I need to do something in tornado, and then instruct nginx to deliver the static page.
Is this doable? If so, what is the most robust way of doing so?
You could achieve this with cookies: http://www.quirksmode.org/js/cookies.html
WIth cookies you would send a specific cookie w/ the response headers on the first view. Then each time the page loads, have your javascript check the specific cookie
Or use local storage: http://diveintohtml5.info/storage.html
Similar to the cookie method, but on the first view have javascript store a key=value pair in local storage, and check against that each time the page loads. Something along these lines:
(function () {
window.onload = function () {
if (localStorage.getItem("SeenBefore")) {
// Not first time viewed
} else {
localStorage.setItem("SeenBefore", true);
// First view
}
}
}())
Another option is, on the serverside, you could set a session variable the first time the page is viewed, then check agianst that each time a user sends a request for the page. This could also be achieved using cookies.
I'm new to BackBone and building my app based off a template found on the web. I start by loading my data from file.json like so...
livestock.groups = Backbone.Collection.extend({
model: livestock.Activity,
url: "groups.json"
});
I then have several lines of code loading the collection to the HTML and setting button functionality. Then near the end I have a line which updates the extended collection like this...
function addToList(activity) {
livestock.groups.add({id: 6, type: activity, comments: 'Wow...that was easy.'});
}
This works fine for the HTML version of the collection but I want to add a line to addToList function that will update my .json file. How can this be done?
This isn't actually possible. Backbone was meant to interact with a RESTful web service. When you give it the URL to a JSON file like your'e doing, it sends a GET request, which works fine. It doesn't know whether or not it called a web service or not. However, when you want to send the update to the collection, it generates an HTTP POST request. However, that doesn't do any good submitting a POST request to a static file. Apache or whatever you're using to host the JSON file will probably ignore that and serve the static file again.
The real problem, however, is unrelated to Backbone itself. The problem is you can't edit a file on a remote server via javascript. You need some web service in between using something like PHP or Ruby that can take the request from Backbone and update the file on the server's hard drive.
If instead you're developing right now on your local computer, then this won't work for a different reason. Your browser, for security reasons, won't allow javascript to modify local files on your hard drive, even though they're in the same folder as your html and javascript.
Hope this helps.
Edit: Based on comments, adding links here to a couple sample adapters for Backbone to LocalStorage and IndexedDB:
http://documentcloud.github.com/backbone/docs/backbone-localstorage.html
https://github.com/superfeedr/indexeddb-backbonejs-adapter