The code below does not update according to frequency;
It is just updating once at the beginning
new Ajax.PeriodicalUpdater('message_field', "http://localhost:8888/lsl_application/php/update_message_field.php?"+param, {
method: "GET",
frequency: 2,
decay: 1,
onSuccess: onSuccess_forPeriodic,
onFailure: function(xhrResponse){
alert("Failed to update!"+xhrResponse.statusText);
}
});
Hi according to your question I have made sample application as below. It looks like your web service/API is taking some time to process your request.
Please try to run as below example you may have an answer to your question.
My Client Code, Index.php, request every second.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Hello</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="prototype.js"></script>
<script type="text/javascript">
new Ajax.PeriodicalUpdater('message_field', "time.php", {
method: "GET",
frequency: 1,
//asynchronous: false,
onSuccess: function(s){
document.getElementById("t").innerText = s.responseText;
},
onFailure: function(xhrResponse){
alert("Failed to update!"+xhrResponse.statusText);
}
});
</script>
</head>
<body>
<h1 id="t"></h1>
</body>
</html>
Server Code, time.php, Web Service/API logic.
<?php
sleep(5);
echo date('h:i:s A');
?>
Note: Please have look to the Network of your browser. I have the frequency of 1 while answer comes at every 5 seconds.
According to the documentation http://api.prototypejs.org/ajax/Ajax/PeriodicalUpdater/ the frequency is the amount of time that the code waits between the end of the first request to when the next request is started.
For example what you are expecting is this
function poll()
{
//function body
}
setInterval(poll,2000);
However what Ajax.PeriodicalUpdater does is this
function poll()
{
//function body
setTimeout(poll,2000);
}
poll();
The benefit of waiting till the first(previous) request is finished prevents the UI from hammering the backend code every 2 seconds regardless of how fast the backend process runs. Especially if the backend process takes 2 seconds or longer to process, it will cause the requests to stack.
Also I believe you might be using it incorrectly as Ajax.PeriodicalUpdater is simply a wrapper around Ajax.Updater which does the content update for you. I could be wrong as I can't see the rest of your code. The code snippet you provided should be updating the element with id message_field with the response from your URL request. That content update is fired on the onComplete event which is after the onSuccess event. So if the URL response is not changing as it does in Jenish Zinzuvadiya's answer then you would see that behavior.
I hope I was able to help.
Related
I know there are a lot of these questions about this one, but unfortunately i cant find the right answer so i try it again.
I simply want to display the current song from "http://178.19.116.253/currentsong?sid=1" on my site that must refresh every x seconds.
I rather not use php cause it will make a background process for all users, so i've seen a lot of little scripts like this..
<div id="sc_stats"><?php include_once 'sc_stats.php'; ?></div>
var refreshId = setInterval(function() {
$.get("sc_stats.php", function(data) {
$("#sc_stats").html(data);
});
}, 10000);
But i cant get mine to work without php.
Someone can help me with this?
You don't need to use php, the following snippet which only uses jQuery will display the current song and refresh it every second.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div class="nowplaying"></div>
<script src="https://cdn.jsdelivr.net/jquery/3.2.0/jquery.min.js"></script>
<script>
setInterval(function() {
$.ajax({
url: "http://178.19.116.253/currentsong?sid=1",
dataType: "html",
success: function(data) {
$('.nowplaying').text(data);
console.log(data);
}
});
}, 1000);
</script>
</body>
</html>
Note: In order to get this to work, either:
This piece of code must run on the same domain/server as your stream
Or CORS must be enabled on your server. More about CORS can be found here
You can test CORS with the following Chrome plugin: Allow-Control-Allow-Origin:
I'm trying to get photos from instagram by get request,
I tried jQuery.get() which worked well for other purpose of get request which is not instagram,
but for this one it doesn't work.
I used postman and I get the request no problem at all,
I also tried to change from jQuery.get() to jQuery.getJSON() and still no luck.
By the way, tried to get the request with NodeJS using request module and it works fine.
Hope you can help, here is my simple code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script>
$(function () {
$.get("https://www.instagram.com/uefachampionsleague/media/",
function (data) {
alert(items[0].id);
},"json");
});
</script>
</head>
<body>
<p></p>
</body>
</html>
You need to register your application and then set the credentials in the AJAX request, or you can also use the crossorigenme proxy:
$(function () {
$.get('https://crossorigin.me/https://www.instagram.com/uefachampionsleague/media/', function(data) { console.log(data); });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
As Jaromanda added "It's worth noting the caveat on crossorigin.me - PLEASE DO NOT USE THE PROXY ON A PRODUCTION SITE - if you want to "bypass" CORS, use your own damned server to do it".
This post is just to learn something, Recently I came across a domain called as www.content-queen.me/PtWkz in a page from facebook.com, on clicking the post with this link it redirected me another domain http://www.wittyfeed.com/story/18644/when-9-cops-sat-down-at-red-robin-the-waitress-realized-something-is-terribly-wrong?utm_source=undefined&utm_medium=SOCIAL&utm_campaign=33-campaign&utm_hash=PtWkz&i=2...Initially I dint see it, but the next time I did with another url, the same thing happened..so my question is how to do it, I know how create a redirect, as it can be done in .htaccess, but this kind of redirect is very new and interesting, And I even tried to dissect the code and found this source code
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US">
<head>
<meta charset="UTF-8">
<title>When 9 Cops Sat Down At Red Robin, The Waitress Realized Something Is Terribly Wrong</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta property="og:locale" content="en_US" />
<meta property="og:type" content="article" />
<meta property="og:title" content="When 9 Cops Sat Down At Red Robin, The Waitress Realized Something Is Terribly Wrong" />
<meta property="og:description" content="You never know when any deed done by you can make anyone's day. Hence, being on the good side of the threshold is always preferable. Jessica Dunbar definitely understands the effect good actions have and she is definitely doing everything the right way. Especially, when it is about men in uniform. When she notices a group of cops sitting in her section, this happens." />
<meta property="og:url" content="http://www.content-queen.me/PtWkz" />
<meta property="og:image" content="http://cdn.wf-media.com/18644/pvoaelaw7buvswooe47x.jpeg" />
<meta property="og:site_name" content="www.content-queen.me" />
<meta property="article:section" content="Pictures" />
<a href="https://www.viral9.com/tr_hs_vs/PtWkz" id='myLink'></a>
<style type="text/css">
#myLink {
display: none;
}
</style>
</head>
<body>
<div id="output">
</div>
</body>
</html>
<script type="text/javascript">
// view_count_update();
function view_count_update()
{
var jUTM = "utm_source=SOURCE&utm_medium=referral&utm_campaign=CAMPAIGN&utm_hash=HASH";
var redirect_url = "http://www.wittyfeed.com/story/18644/when-9-cops-sat-down-at-red-robin-the-waitress-realized-something-is-terribly-wrong?utm_source=SOURCE&utm_medium=SOCIAL&utm_campaign=33-campaign&utm_hash=PtWkz&i=2";
redirect_url = redirect_url.replace("SOURCE", document.referrer.split('/')[2]);
window.location = redirect_url;
}
function myFunc(){
}
//hello
</script>
<script>
try{
(function(){
var d = {
'user_id' : "33",
'url_id' : "2609257" ,
'advertiser_id' : "1",
'user_agent' : navigator.userAgent,
'campaign_id' : "18362" ,
}
$.ajax({
url: "http://www.asapoo.com/mysql_testing",
type:'GET',
data: d,
success : function(data) {view_count_update();},
error : function(){ view_count_update();},
complete: function() {view_count_update();},
timeout : 2000
});
})();
}catch(e){ view_count_update(); }
</script>
<script src="//c.fqtag.com/tag/implement-r.js?org=T6tuwESp3TrUwruYu4eZ&p=NOTSET&a=33&cmp=PtWkz&rt=display&sl=1&fmt=banner&ctu=http%3A%2F%2Fwww.wittyfeed.com%2Fstory%2F18644%2Fwhen-9-cops-sat-down-at-red-robin-the-waitress-realized-something-is-terribly-wrong%3Futm_source%3DSOURCE%26utm_medium%3DSOCIAL%26utm_campaign%3D33-campaign%26utm_hash%3DPtWkz%26i%3D2&fq=1"></script>
I hope there will be guys who would have done this here and would like to learn how to do it.
That code is pretty much it, really. The redirects are coming from a site set up just for that. It most likely has a database driving it, mapping those random strings of letters to sites. Then it had a template for the page you posted here where it fills in values from the database.
You can see in the code where it updates a page view counter. Then, right after that it sets window.location to where they want you to go, which makes the browser load the page.
This is called a url shortener, you need a back-end script to do the redirect.
The application works as follows, when a request for www.content-queen.me/PtWkz, it will analyze the url. and take the random string PtWkz as a key, this key is connected to the orginal url and the relation stored somewhere in database or cache memory.
What the script do is to match the short string to the orginal url and send to our browser http redirect 302.
There are some feathers to the shortener like you can change the destination the original url with keep sharing the short url.
The back-end script can be written in all programing languages and scripts, you may use python or php for it.
There are many online url shortener services like goo.gl and bitly.com.
Now I have a javascript code which refreshes a webpage every 2 seconds to check if there is any update from the database.
What I would like it to do is to play a sound when the webpage display new things.
Below is the html file:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(function() {
$.ajaxSetup ({
cache: false
});
var auto_refresh = setInterval(function () {$('#loading').load('index.php').fadeIn("slow");}, 2000);
});
</script>
</head>
<body>
<div id="loading"></div>
</body>
</html>
I am new to Javascript
I think what you want is custom implementation like HTTP ETag.
It should look like this:
Extract version no from html sent by PHP script, pass this version no to each ajax request, server will check both versions and provide proper responses to client.
If server replies with
1) http status code 200 => web page is changed => play sound.
2) http status code 304 => web page is not changed
I am trying to use JavaScripts WebWorkers and setTimeout to have a asynchronous Timeout on a ChromeCast Application.
This is used inside of jQuery, but the call to the asynch javascript file is outside of jQuery.
This is the minimal sample (without jquery and working standalone):
index html:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<script>
function func(){
console.log("start");
var worker = new Worker('timer.js'); //External script
worker.onmessage = function(event) { //Method called by external script
console.log("10s later");
};
}
</script>
<body onload="func()">
</body>
</html>
timer.js:
setTimeout(continueExecution, 10000) //wait ten seconds before continuing
function continueExecution()
{
postMessage(null);
}
the callback works inside the chromecast and jQuery, but is executed instantaneously without the delay of 10 seconds.
Does anyone know how the chromecast handles timeouts ?
setTimeout does work on Chromecast, you can check out our reference receiver which uses that method in multiple places.