我试图让用户在文本框中键入艺术家,然后按一个按钮来调用 Echo Nest API。
这是一个示例调用: http: //developer.echonest.com/api/v4/playlist/basic ?api_key=N6E4NIOVYMTHNDM8J&artist=Weezer&format=json&results=20&type=artist-radio
我将如何构建 API 调用以将该信息包含在来自文本框的用户输入中。例如,在上面的调用中,用户输入将是“Weezer”。
我试图让用户在文本框中键入艺术家,然后按一个按钮来调用 Echo Nest API。
这是一个示例调用: http: //developer.echonest.com/api/v4/playlist/basic ?api_key=N6E4NIOVYMTHNDM8J&artist=Weezer&format=json&results=20&type=artist-radio
我将如何构建 API 调用以将该信息包含在来自文本框的用户输入中。例如,在上面的调用中,用户输入将是“Weezer”。
此解决方案使用 jQuery 并假定以下 html。请注意,它还使用 JSONP,因为您是从客户端发出请求以避免跨域安全限制。为了完成这项工作,我更改了格式类型并添加了回调。getJSON 调用使用回调变量的存在来注入匿名回调函数,该函数将调用您的实际回调。
<label for="artist">Artist</label>
<input type="text" id="artist" name="artist" />
<button id="search-artist">Find</button>
$('#search-artist').click( function() {
var url = "http://developer.echonest.com/api/v4/playlist/basic?api_key=N6E4NIOVYMTHNDM8J&artist="
+ $('#artist').val()
+ "&results=20&type=artist-radio"
+ "&format=jsonp&callback=?";
$.getJSON(url, function(data) {
// do something with the returned JSON data
}
});