Trying to read a JSON file with a script [closed] - javascript

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 days ago.
Improve this question
I'm trying to read a secure Json file on my server when I access the file directly through the URL I get this:
Access Denied
You don't have permission to access "xxxx.com" on this server.
Reference #18.2497f648.1675536275.16f2f2ad
What I'm trying to do is actually read the content in the file and when the file is updated with the specific word I'm looking for then I'll get a notification to my application
my code:
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
var delay = null;
function loadXMLDoc(){
if (delay) {
clearTimeout(delay);
}
var sec = 2000;
const xhr = new XMLHttpRequest();
xhr.open('GET', 'test.json', true);
xhr.setRequestHeader('Referer', 'test.json');
xhr.SetRequestHeader('X-Requested-With', 'XMLHttpRequest');
xhr.onload = getJson;
xhr.send(null);
xhr.responseType = 'text';
xhr.onload = function(e) {
if (this.status == 200) {
const final = this.response;
if (final !== ""){
{
sec = 10000;
iff(final); // call to iff function - send to aplication.
}
}else{
document.getElementById("name").textContent = "אין התרעות כרגע";
}
delay = setTimeout(loadXMLDoc,sec);
}
}
xhr.send();
};
window.onload = function() {
loadXMLDoc();
}
</script>
<script>
function iff(final){
const object = JSON.parse(final);
for (let err of object.data) {
var zone = err;
document.getElementById("name").textContent = zone;
$.post("sendtofirebase.php", {zone: zone}, function(data) {
// returned from php
});
}
}
</script>
</head>
<body>
<text id="name"></text>
<meta http-equiv="refresh" content="3600">
</body>
</html>

Related

Rapidapi Api request with XMLHttpRequest

this is my second post, I hope to be luckier than last time end get some reply. 🙂
I’m trying to make a Rapidapi api request working with javascript ”XMLHttpRequest”
I must say that the api works perfectly with ios siri shortcut.
this is the code provided from apirapit site on the "XMLHttpRequest" section:
var data = null;
var xhr = new XMLHttpRequest();
xhr.withCredentials = true;
xhr.addEventListener("readystatechange", function () {
if (this.readyState === this.DONE) {
console.log(this.responseText);
}
});
xhr.open("GET", "https://download-video-youtube1.p.rapidapi.com/mp3/medPORJ8KO0");
xhr.setRequestHeader("x-rapidapi-host", "download-video-youtube1.p.rapidapi.com");
xhr.setRequestHeader("x-rapidapi-key", "[my key here]");
xhr.send(data);
And this is my code:
<!DOCTYPE html>
<html>
<body>
<h2>The XMLHttpRequest Object</h2>
<button type="button" onclick="loadDoc()">Request data</button>
<p id="demo"></p>
<script>
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.withCredentials = true;
url='https://download-video-youtube1.p.rapidapi.com/mp3/xF5t2jOsCt8';
xhttp.onreadystatechange = function() {
if ((this.readyState == 4 && this.status == 200 )||(this.readyState === this.DONE)) {
document.getElementById("demo").innerHTML = "ciao" + this.responseText;
}
};
xhttp.open("GET", url);
xhttp.setRequestHeader("x-rapidapi-host", "download-video-youtube1.p.rapidapi.com");
xhttp.setRequestHeader("x-rapidapi-key", "[my key here]");
xhttp.send();
}
</script>
</body>
</html>
Just to testing I created a simply bank html page to have the JSON response beneath the button just after pressing it. The result is just the string “ciao” i set before the this.responseText. If I remove the apikey or modify it with a wrong value an JSON error message appear ( so like the case posted, as I intentionally removed it).
Otherwise as said noting but “ciao” string
Is there any syntax error? Is there a logical reason why it behave like this?
Thanks
Franco
Trying adding a data variable as null. That's what RapidAPI provides in their code snippet.
function loadDoc() {
const data = null
var xhttp = new XMLHttpRequest();
xhttp.withCredentials = true;
url='https://download-video-youtube1.p.rapidapi.com/mp3/xF5t2jOsCt8';
xhttp.onreadystatechange = function() {
if ((this.readyState == 4 && this.status == 200 )||(this.readyState === this.DONE)) {
document.getElementById("demo").innerHTML = "ciao" + this.responseText;
}
};
xhttp.open("GET", URL);
xhttp.setRequestHeader("x-rapidapi-host", "download-video-youtube1.p.rapidapi.com");
xhttp.setRequestHeader("x-rapidapi-key", "my key here");
xhttp.send(data);
}

AJAX get JSON function not looping

Question: Why the function is not able to retrieve the json object?
I also noticed when debugging the code on my browser that the console does one pass through the code but never comes back! I thought the way this works is by having the function at the bottom of the html code looping back up until the the request status is changed.
I am starting to learn html javascripting. Following a tutorial I have the following code for html page that gets and parse JSON object:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function ajax_get_json(){
//crate our XMLHttpRequestobject
var hr = new XMLHttpRequest();
//var p1 = "p1";
//creat some variable we need to sned to our php file
hr.open("GET", "mylist.Json", true);
//set content type information for sending url encoded variables in the
//reqeust
console.log(5+6);
hr.setRequestHeader("Content-type", "application/json", true);
//Acess the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatchange = function(){
if (hr.readyState == 4 && hr.status == 200){
var data = JSON.parse(hr.responseText);
var results = document.getElementsById("results");
results.innerHTML=data.user;
// document.getElementById("results").innerHTML = return_data;
}
}
//send the data to php now and wait for the response to update the
//status div
hr.send();
results.innerHTML = "reqeusting...";
// document.getElementById("results").innerHTML="processing...";
}
</script>
</head>
<body>
<div id="results"></div>
<script type="text/javascript">ajax_get_json();</script>
</body>
</html>
Here is the json object code
{"user":"John", "age":22, "country":"United States" }
Both files are sitting in my ubuntu server that has LAMP enabled. Here is what the directory looks like:
Apparently the problem lies in declaring var results within hr.onreadystatechange function. Moving the declaration to the top fixed the code. Here is the working code:
<!DOCTYPE html>
<html>
<head>
<script>
function ajax_get_json(){
var results = document.getElementById("results");
//crate our XMLHttpRequestobject
var hr = new XMLHttpRequest();
//var p1 = "p1";
//creat some variable we need to sned to our php file
hr.open("GET", "mylist.json", true);
//set content type information for sending url encoded variables in the
//reqeust
//console.log(5+6);
//hr.setRequestHeader("Content-type", "application/json", true);
hr.setRequestHeader("Content-type", "application/json", true);
//Acess the onreadystatchange event for the XMLHttpRequest object
hr.onreadystatechange = function(){
if (hr.readyState == 4 && hr.status == 200){
var data = JSON.parse(hr.responseText);
results.innerHTML=data.user;
// document.getElementById("results").innerHTML = return_data;
}
}
//send the data to php now and wait for the response to update the
//status div
hr.send(null);
results.innerHTML = "reqeusting...";
// document.getElementById("results").innerHTML="processing...";
}
</script>
</head>
<body>
<div id="results"></div>
<script>ajax_get_json();</script>
</body>
</html>

AJAX check page return every 5 minutes [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I want to make a simple AJAX script but I don't know how to do that :
Every 5 minutes, the scripts check if the page "req.php?online_mode" returns the text "true" or "false". If it returns "true", it'll do anything, but if it returns "false", it will show a Javascript alert().
Any help please ? Sorry for bad english,
Cheers, MrZ
Take a look at $.ajax() and setTimeout().
make_call = function() {
setTimeout(function() {
$.ajax({url: "demo_test.txt",
success: function(result){
if (result == true) {
make_call();
} else {
alert("!!!");
}
}});
}, 300000);
}
If you want to use native Javasript:
var request = new XMLHttpRequest();
request.open('GET', 'demo_test.text', true);
request.onload = function() {
make_call();
};
request.send();
Puedes hacerlo de una manera fácil y rápida, así:
function ajaxCheck(url, minutes, text){
if(text == "false") return alert("Finalize!");
setTimeout(function(){
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
xhr.readyState == 4 && xhr.status == 200 && ajaxCheck(url, minutes, xhr.responseText)
};
xhr.open("GET", url, true);
xhr.send()
}, 60*1000*minutes)
}
ajaxCheck("req.php?online_mode", 5)

i want my ajax code should appear with a fadeIn effect [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
this is my html code
<input type="text" name="query_post" id="textid" />
<input type="button" class="gbutton" style="-webkit-user-select: none; opacity:1 " id="shareImageButton" value="Share" onclick="Postquery()">
<div id="new_query_post">
</div>
css
.new_query_post{
display:inline;
}
js
function Postquery() {
// 1. Create XHR instance - Start
var xhr;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
}
else {
throw new Error("Ajax is not supported by this browser");
}
// 1. Create XHR instance - End
// 2. Define what to do when XHR feed you the response from the server - Start
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status == 200 && xhr.status < 300) {
document.getElementById('new_query_post').innerHTML = xhr.responseText;
}
}
}
// 2. Define what to do when XHR feed you the response from the server - Start
var textid = document.getElementById("textid").value;
// 3. Specify your action, location and Send to the server - Start
xhr.open('POST', 'postquery.php');
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("textid=" + textid);
// 3. Specify your action, location and Send to the server - End
}
php
<?php
$textid =trim($_POST["textid"]);
echo"
<div id='each_query'>
<span style='margin-top:1%; margin-left:3%;float:left;color: #3bb598'>Jan 26'14 </span>
<span style='margin-top:1%; margin-right:3%;float:right;color: #3bb598'>Hits : 39 Views : 60</span>
<br>
<table><tr>
<th><img src='propic/pro_pic.jpg' id='img' align='top'><br><span style='color:#3bb598'>Title</span> <br><span style='color:#3bb598'><a href='' id='tagid'>Travel</a></span></th>
<th></th><th></th><th></th>
<th style='text-align: justify;color: #212121;'>".$textid."
</th><th></th><th></th><th></th>
</tr></table>
</div>
";
?>
i want the new query should be posted with a fadeIn effect and should show some ajax loading before posting ......
It could be simpler with jQuery's post:
var jqXhr = function(e) {
var $id = $('#textid').val();
var $spinner = $('#spinner');
var $result = $('#new_query_post');
e.preventDefault();
$result.fadeOut(200);
$spinner.show();
$.post('postquery.php', { textid: $id }, function(response) {
$result.html(response).fadeIn(200);
$spinner.hide();
});
}
$('#shareImageButton').on('click', jqXhr);
And add a <div id="spinner">...</div> in your HTML (you can find some examples here for pure CSS spinners).

Ajax Pull Content From another webpage

So I got this code for pulling rss feeds from another website (i asked them, and they gave me permission) I Don't know what should i Write in TAG1 and TAG2. Basically that is just my problem:
Here is the html (its an ajaxed page)
<!doctype html>
<html lang="hu">
<head>
<title>Videók</title>
<meta charset="utf-8"/>
<script type="text/javascript" src="../js/videok.js"></script>
</head>
<body>
<h2>Van egy jó videód? Töltsd fel és kikerülhet az oldalra!</h2>
<div id="videok"></div>
</body>
</html>
And here is the Javascript for pulling
window.onload = initAll;
var xhr = false;
var dataArray = new Array();
var url = "choose url";
function initAll() {
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
}
else {
if (window.ActiveXObject) {
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) { }
}
}
if (xhr) {
xhr.onreadystatechange = setDataArray;
xhr.open("GET", url, true);
xhr.send(null);
}
else {
alert("couldn't create XMLHttpRequest");
}
}
function setDataArray() {
var tag1 = "subject1";
var tag2 = "subject2";
if (xhr.readyState == 4) {
if (xhr.status == 200) {
if (xhr.responseXML) {
var allData = xhr.responseXML.getElementsByTagName(tag1);
for (var i=0; i<allData.length; i++) {
dataArray[i] = allData[i].getElementsByTagName(tag2)[0].firstChild.nodeValue;
}
}
}
else {
alert("the request failed" + xhr.status);
}
}
}
You won't be able to use javascript to pull from another web page because javascript is sandboxed when in browsers. Sandboxing means that you will only be able to send requests to the same domain that the javascript originally came from (also known as the 'same orgin policy').
You can use a serverside language like php to do the pulling and then hand it down to the javascript through ajax.
The code that you posted looks like it just makes a simple ajax call but it shouldn't work when trying to request an RSS from anything other than your own site.
It's better that you have the server side of your application fetch data for the xml and format the data how you want it.
You would have the Ajax request hit your server's end point, then your server will fetch the xml data, format it properly and respond to the request with the correct formatted data.

Categories

Resources