Created
September 7, 2018 11:33
-
-
Save Denkong/787a0a06923c69cfd8cff0c7856d1e9f to your computer and use it in GitHub Desktop.
JSON JSONP AJAX - отправка http запроса клиентом
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<meta http-equiv="X-UA-Compatible" content="ie=edge"> | |
<title>Document</title> | |
</head> | |
<body> | |
<div id="content"></div> | |
<!-- | |
//JSONP | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script> | |
<script> | |
function Test(callback){ | |
$('#content').append(callback.files[0].url); | |
console.log(callback.files[0].url); | |
} | |
</script> | |
<script type="text/javascript" src="https://us.api.battle.net/wow/auction/data/medivh?locale=en_US&jsonp=Test&apikey=svkjts9fa3yvguucdk5kegvbtjcfwhkj"></script> | |
--> | |
<!-- То-же самое через AJAX, но необязательно использовать JSONP и прописывать фунцию callback | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script> | |
<script> | |
$.ajax({ | |
url: 'https://us.api.battle.net/wow/auction/data/medivh?locale=en_US&apikey=svkjts9fa3yvguucdk5kegvbtjcfwhkj', | |
success: function(data){ | |
console.log(data); | |
$('#content').append(data.files[0].url); | |
} | |
}); | |
</script> | |
--> | |
<!--Не получиться, так как возвращается не JSONP | |
<script type="text/javascript" src="http://auction-api-us.worldofwarcraft.com/auction-data/ab1239c3bc437d48321a64e6b5e5ab7f/auctions.json"></script> | |
--> | |
<!--ОШИБКА, так как у них на сервере не установлен CORS | |
Решает проблему отправка ajax на свой backend, в котором осуществляется http запрос | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script> | |
<script> | |
$.ajax({ | |
url: 'http://auction-api-us.worldofwarcraft.com/auction-data/ab1239c3bc437d48321a64e6b5e5ab7f/auctions.json', | |
success: function(data){ | |
console.log(data); | |
$('#content').append(data.realms); | |
} | |
}); | |
</script> | |
--> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment