2012-06-02 3 views
5

현재 SoundCloud API로 작업 중이며 버튼을 클릭 할 때 트랙이 포함되도록하고 싶습니다.Origin-null은 Access-Control-Allow-Origin에 의해 허용되지 않습니다.

은 XMLHttpRequest http://soundcloud.com/oembed.json?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F48419073를로드 할 수 없습니다 :

나는 두 가지 오류를 얻을. Origin null은 Access-Control-Allow-Origin이 허용하지 않습니다.

catch되지 않은 형식 오류 : 나는 나를 그것이 알려 내 코드에 경고를 사용

<button onclick="getPopular()">+1</button> 
<div id="track"></div> 

<script src="http://connect.soundcloud.com/sdk.js" type="text/JavaScript"></script> 
<script type="text/JavaScript"> 
    SC.initialize({ 
     client_id: "**************", 
    }); 

    var getPopular = function() { 
     SC.get("/tracks", {limit: 1}, function(tracks) { 
      var track = tracks[0]; 
      alert("Latest track: " + track.title); 
      SC.oEmbed(track.uri, document.getElementById("track")); 
      }); 
     }; 
</script> 

: 여기

의 특성 'HTML'을 읽을 수 없습니다 것은 내 코드입니다 실제로 SoundCloud API에서 정보를 가져옵니다. 나는 그 밖의 무엇이 그것을 끼어 들지 못하게할지 모르겠습니다.

미리 감사드립니다. 제 질문을 보겠습니다.

  • jiggabits
+1

"client_id"에 대해 지불해야하는 것이 있습니까? – Pointy

+1

로컬 호스트에서 액세스하려고합니다. –

+2

@Pointy SoundCloud는 노래를 공유하는 곳이므로이 API가 선택한 사용자의 노래를 가져 오는 것 같습니다. 어쨌든, OP, 로컬로 API를 테스트하고 있습니까? 내 마음을 읽는 능력은 다른 모든 SO 응답자만큼 좋지 않으며 출처 문제는 Chrome/Opera에서 로컬로 API를 실행하는 것과 관련이 있습니다. –

답변

17

주요 문제를 더 잘 이해하려면 Same Origin Policy을 약간 읽으십시오. Ajax, localhost, Chrome/Opera는 잘 어울리지 않습니다. This related question이 더 좋습니다.

두 번째 문제는 첫 번째 오류로 인해 html 응답을 반환하지 않는 Ajax 호출 (API의 어딘가) 때문입니다.

위의 링크에서 설명 된 문제를 설명하는 대신 해결책을 제시 할 것입니다. Chrome에서 실행 중이므로 해결 방법이 있습니다. 이 옵션으로 크롬을 시작

--allow-file-access-from-files

(나는 뻔뻔 Pointy에서 빌린 해결 방법)

는 또한 파이어 폭스를 실행 중이거나 일시적으로 호스팅 시도 할 수 있습니다. :)


P.S. 로컬 컴퓨터에서 심각한 개발을 계획하는 경우 http://localhost을 통해 콘텐츠를 제공하고 테스트하기 위해 Apache를 설치하여 file:/// 제한을 해제하는 것이 좋습니다.

    Windows의
  • : EasyPHP, WAMP

    여기에 개발을위한 사전 구성 아파치와 PHP와 함께 몇 가지 훌륭한 도구입니다.

  • 크로스 플랫폼 : XAMPP, BitNami.
0

다시 트랙을 받고있는 경우, 내가 노력할 것이라고 경고 (document.getElementById를 ("트랙")); 당신이 당신의 dom 요소를 얻는 지 확인하십시오.

+0

나는 닮았다! – veryrarecandy

+0

경고에 해당 코드를 추가하면 다음을 반환합니다. [object HTMLDivElement] – veryrarecandy

관련 문제