0
私はこのような質問をたくさん見ましたが、私は他の提案からすべてを試したような気がして、何も動作していないようです。しかし、JsFiddleではalert（）関数がコード内で動作し、警告ボックスが表示されますが、ローカルWebブラウザを使用してjavascript eclipseプロジェクトを実行すると、これは自分の環境では起こりません。ここに私のコードは私が受け取るが、私は物事がここに全く機能して取得することができていないデータとプログラムの実際の肉を実行する場所、これらのアラート線である私のコードはJSFiddleで動作しますが、ローカルサーバでは動作しません
<!doctype html>
<html>
<head>
<title>Testy</title>
<style type="text/css">
.container {
margin: 1em;
}
img {
margin-bottom: 1em;
}
</style>
</head>
<body>
<div class="container">
<h1>Displaying User Data</h1>
<p>Log in with your Spotify account and this demo will display information about you fetched using the Spotify Web API</p>
<button class="btn btn-primary" id="btn-login">Login</button>
<button class="btn btn-res" id="btn-res">Result</button>
<div/>
<script src="normalize.css"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0-alpha.1/handlebars.min.js"></script>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function() {
function login(callback) {
var CLIENT_ID = '04270f76089b4a65a3eb749c0addb583';
var REDIRECT_URI = 'http://jmperezperez.com/spotify-oauth-jsfiddle-proxy/';
function getLoginURL(scopes) {
return 'https://accounts.spotify.com/authorize?client_id=' + CLIENT_ID +
'&redirect_uri=' + encodeURIComponent(REDIRECT_URI) +
'&scope=' + encodeURIComponent(scopes.join(' ')) +
'&response_type=token' +
'&show_dialog=true';
}
var url = getLoginURL([
'user-library-read playlist-read-private user-follow-read'
]);
var width = 450,
height = 730,
left = (screen.width/2) - (width/2),
top = (screen.height/2) - (height/2);
window.addEventListener("message", function(event) {
var hash = JSON.parse(event.data);
if (hash.type == 'access_token') {
callback(hash.access_token);
}
}, false);
var w = window.open(url,
'Spotify',
'menubar=no,location=no,resizable=no,scrollbars=no,status=no, width=' + width + ', height=' + height + ', top=' + top + ', left=' + left
);
}
function ridDuplicates(artists) { // returns final artists array
artistsFresh = []; // will contain no duplicate artists
artistsFresh.push(artists[0]); // first element can't be a duplicate
for (var i = 1; i < artists.length; i++) {
var j = i-1;
var duplicateArt = false;
while (j >= 0 && duplicateArt == false) {
if (artistsFresh[j] == artists[i]) {
duplicateArt = true;
}
j--;
}
if (!duplicateArt) {
artistsFresh.push(artists[i]);
}
}
return artistsFresh;
}
var i = 0;
function getUserData(accessToken, i) {
return $.ajax({
url: 'https://api.spotify.com/v1/me/tracks?limit=50&offset=' + i,
headers: {
'Authorization': 'Bearer ' + accessToken
}
});
}
var loginButton = document.getElementById('btn-login');
var resButton = document.getElementById('btn-res');
var artists = [];
resButton.addEventListener('click', function() {
alert(artists.length);
});
loginButton.addEventListener('click', function() {
login(function(accessToken) {
loginButton.style.display = 'none';
var arr = [getUserData(accessToken, i)];
arr[0]
.then(function(response) {
for (var i = 50; i < response.total; i += 50) {
arr.push(getUserData(accessToken, i));
}
Promise.all(arr).then(function(chunks) {
var artists = [].concat.apply([], chunks.map(function(response) {
return response.items.map(function(item) {
return item.track.album.artists[0].name;
});
}));
// these alert lines do not seem to work
alert(artists.length);
alert(artists[9]);
var newArray = ridDuplicates(artists);
alert(newArray.length);
});
})
.catch(function(err) {
// handle errors here
});
});
});
});
</script>
</body>
</html>
です。ご協力ありがとうございました！
JavaScriptがファイルnormalize.css' 'ですか？ [ブラウザコンソール]（http://webmasters.stackexchange.com/q/8525）を使用してエラーを読み、そこの[ネットワーク]タブをチェックして、すべてのリソースが見つかったことを確認します。 – Xufox