Why does one cross-domain query work and the other doesn't?

L

lilandre2018-02-23 18:42:55

JavaScript

lilandre, 2018-02-23 18:42:55

Good afternoon. Understanding Ajax in JavaScript. I study the topic of cross-domain queries. Why does a cross-domain request work on one site, but not on another?
mefston19.clone.pp.ua/ajax - site where I test cross-domain requests.
index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Ajax CrosDomain</title>

  <script src="script.js" async></script>
  <link rel="stylesheet" href="script.css">
</head>
<body>


<div class="container">
  
  <div class="buttons">
    <button id="button">Запрос на Lenta.ru</button>
    <button id="button2">Запрос на www.html5rocks.com

  </button>


<div id="container"> </div>




<div id="container2"> </div>



  <p id="containerText">Demo</p>
  <p id="containerText2">Demo2</p>


</div>
  
</body>
</html>

script.js

var container = document.getElementById('container');
var container2 = document.getElementById('container2');
var button = document.getElementById('button');
var button2= document.getElementById('button2');

var containerText = document.getElementById('containerText');
var containerText2= document.getElementById('containerText2');


button.onclick=function(){
  requestL()
  container.innerHTML= 'Отправили  запрос на Lenta.ru';

}

button2.onclick=function(){
  // alert(' Script work!!');
  requestH();
  container2.innerHTML= 'Отправили запрос на html5rocks.com';

}





function requestL(){
  var XHR = ('onload' in new XMLHttpRequest())? XMLHttpRequest : XDomainRequest;

  var xhr = new XHR();

  xhr.open('GET','http://lenta.ru/robots.txt', true);

  xhr.send();


  xhr.onload = function (){
    alert(this.responseText);
    console.log('Answer : '+this.responseText)	
    containerText.innerHTML= ('Ответ:  '+this.responseText);	
  };
  xhr.onerror= function (){
    alert('Error code: '+this.status+'Text error: '+this.statusText);
    console.log('Error code :\n'+this.status+'\n Text error: '+this.statusText);
    containerText.innerHTML= ('Cross-Origin Resource Sharing does not work. Error code: '+this.status+'\n Text error: '+this.statusText);		
  };

}


function requestH(){
  var XHR = ('onload' in new XMLHttpRequest())? XMLHttpRequest : XDomainRequest;

  var xhr = new XHR();

  xhr.open('GET','http://html5rocks-cors.s3-website-us-east-1.amazonaws.com/index.html', true);

  xhr.send();


  xhr.onload = function (){
    alert(this.responseText);
    console.log('Answer : '+this.responseText);	
    containerText2.innerHTML=('Ответ:  '+this.responseText);		
  };
  xhr.onerror= function (){
    alert('Error code: '+this.status+'Text error: '+this.statusText);
    console.log('Error code: '+this.status+'Text error: '+this.statusText);	

  };

}

Reply

Answer the question

In order to leave comments, you need to log in

2 answer(s)

I

Ilya Kanyshev, 2018-02-23
@lilandre

Ajax requests are prohibited on lenta.ru, so alas and ah

A

Atlllantis, 2018-02-23
@Atlllantis

If the server is yours, then look at the headers on the server: "Access-Control-Allow-Origin", if not, then alas.