Access-Control-Allow-Origin은 원점 널을 사용할 수 없습니다.

다음과 같이 코드가있는 weather.xsl이라는 HTML 출력을 만들기 위해 작은 xslt 파일을 만들었습니다.

<!-- DWXMLSource="http://weather.yahooapis.com/forecastrss?w=38325&u=c" -->
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
exclude-result-prefixes="yweather"
xmlns:yweather="http://xml.weather.yahoo.com/ns/rss/1.0" xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#">
<xsl:output omit-xml-declaration="yes" indent="yes"/>
<xsl:strip-space elements="*"/>

<xsl:template match="/">
    <img src="{/*/*/item/yweather:condition/@text}.jpg"/>
</xsl:template>
</xsl:stylesheet>

다음과 같이 jQuery를 사용하여 html 파일의 div에 html 출력을로드하려고합니다.

<div id="result">
<script type="text/javascript">
$('#result').load('weather.xsl');
</script>
</div>

그러나 다음 오류가 발생합니다. Access-Control-Allow-Origin에서 Origin null을 허용하지 않습니다.

xslt에 헤더를 추가하는 방법에 대해 읽었지만 그 방법을 잘 모르겠으므로 도움을 주시면 html 출력에서로드 할 수없는 경우 다른 방법에 대한 조언 그렇게하는 것이 좋을 것입니다.

Origin null은 로컬 파일 시스템이므로 URL을 load통해 호출 하는 HTML 페이지를로드하는 것을 제안합니다 file:///(예 : 로컬 파일 브라우저 등에서 두 번 클릭). 브라우저마다 동일한 오리진 정책 을 로컬 파일 에 적용하는 방법이 다릅니다 .

내 생각 엔 Chrome을 사용하여 이것을 볼 수 있습니다. SOP를 로컬 파일에 적용하는 Chrome의 규칙은 매우 엄격하여 문서와 동일한 디렉토리에서 파일을로드 할 수 없습니다. 오페라도 마찬가지입니다. Firefox와 같은 다른 브라우저는 로컬 파일에 대한 액세스를 제한합니다. 그러나 기본적으로 로컬 리소스와 함께 ajax를 사용하는 것은 브라우저 간 작동하지 않습니다.

로컬 파일을 사용하지 않고 실제로 웹에 배포 할 로컬 테스트를 수행하는 경우 간단한 웹 서버를 설치하고 http://대신 URL을 통해 테스트하십시오 . 훨씬 정확한 보안 정보를 제공합니다.

Chrome 및 Safari는 로컬 리소스와 함께 ajax를 사용하는 데 제한이 있습니다. 그렇기 때문에 다음과 같은 오류가 발생합니다.

Access-Control-Allow-Origin에서는 원점 널을 사용할 수 없습니다.

솔루션 : firefox를 사용하거나 데이터를 임시 서버에 업로드하십시오. 여전히 Chrome을 사용하려면 아래 옵션으로 시작하십시오.

--allow-file-access-from-files

위의 매개 변수를 Chrome에 추가하는 방법에 대한 추가 정보 : 작업 표시 줄에서 Chrome 아이콘을 마우스 오른쪽 버튼으로 클릭하고 팝업 창에서 Chrome을 마우스 오른쪽 버튼으로 클릭 한 다음 속성을 클릭하고 바로 가기 탭의 대상 텍스트 상자에 위의 매개 변수를 추가하십시오. 그것은 아래와 같이 좋아할 것입니다;

C:\Users\XXX_USER\AppData\Local\Google\Chrome\Application\chrome.exe --allow-file-access-from-files

이것이 도움이되기를 바랍니다!

"웹 서버 실행"응답이 상당히 어려워 보인다고 덧붙이고 싶었지만 시스템에 파이썬이 있다면 (기본적으로 MacOS 및 Linux 배포판에 기본적으로 설치됨) 다음과 같이 쉽습니다.

python -m http.server  # with python3

또는

python -m SimpleHTTPServer  # with python2

따라서 html 파일 myfile.html을 폴더에 넣으면 다음 mydir과 같이하면됩니다.

cd /path/to/mydir
python -m http.server  # or the python2 alternative above

그런 다음 브라우저가 다음을 가리 키도록하십시오.

http://localhost:8000/myfile.html

그리고 당신은 끝났습니다! 웹 보안을 비활성화하거나 로컬 파일을 허용하거나 명령 줄 옵션으로 브라우저를 다시 시작하지 않고도 모든 브라우저 에서 작동합니다 .

이 SO 소스 https : //.com/a/14671362/1743693에 따라 겸손하게 추가하고 싶습니다. 이러한 종류의 문제는 이제 다음 jQuery 명령어를 사용하여 부분적으로 해결됩니다.

<script> 
    $.support.cors = true;
</script>

IE10.0.9200에서 시도했지만 즉시 (jquery-1.9.0.js 사용) 작동했습니다 .

크롬 28.0.1500.95-이 지침이 작동하지 않습니다 ( 위의 링크에서 david 가 주석에서 불평 하는 것처럼 모든 일이 발생합니다 )

--allow-file-access-from-files로 크롬을 실행하면 작동하지 않습니다 (위의 Maistora의 주장)

다음을 사용하기 위해 Gokhan의 솔루션을 사용하기 위해 비트 추가 :

--allow-file-access-from-files

이제 대상 텍스트에 공백 뒤에 공백을 추가해야합니다. 위의 속성을 추가 한 후 크롬 브라우저의 모든 인스턴스를 닫으십시오. 이제이 속성을 추가 한 아이콘으로 크롬을 다시 시작하십시오. 모두를 위해 작동합니다.

로컬 HTML 파일에서 서버에 XHR 요청을하는 솔루션을 찾고 있었고 Chrome과 PHP를 사용하여 솔루션을 찾았습니다. (Jquery 없음)

자바 스크립트 :

var x = new XMLHttpRequest(); 
if(x) x.onreadystatechange=function(){ 
    if (x.readyState === 4 && x.status===200){
        console.log(x.responseText); //Success
    }else{ 
        console.log(x); //Failed
    }
};
x.open(GET, 'http://example.com/', true);
x.withCredentials = true;
x.send();

내 Chrome의 요청 헤더 Origin: null

내 PHP 응답 헤더 ( 'null'은 문자열입니다 ). HTTP_REFERER는 원격 서버에서 다른 서버로 교차 출처를 허용합니다.

header('Access-Control-Allow-Origin: '.(trim($_SERVER['HTTP_REFERER'],'/')?:'null'),true);
header('Access-Control-Allow-Credentials:true',true);

서버에 성공적으로 연결할 수있었습니다. Credentials 헤더를 무시해도되지만 Apache를 AuthType Basic사용하도록 설정하면 작동합니다.

FF 및 Opera와의 호환성을 테스트했으며 다음과 같은 많은 경우에 작동합니다.

VM LAN IP (192.168.0.x)에서 다시 VM의 WAN (공용) IP : 포트
로 VM LAN IP에서 원격 서버 도메인 이름으로 다시.
로컬 .HTML 파일에서 VM LAN IP 및 / 또는 VM WAN IP : 포트로,
로컬 .HTML 파일에서 원격 서버 도메인 이름으로.
등등.

file:/source 태그를 사용 하여 소스 페이지 아래의 트리에서 로컬 Javascript 파일을로드 할 수 있습니다 .

<script src="my_data.js"></script>

이 경우와 같이 입력을 Javascript로 인코딩하는 경우 :

mydata.js :

$xsl_text = "<xsl:stylesheet version="1.0" + ....

(이것은 json에 더 쉽습니다) 그렇다면 Javascript 전역 변수에 '데이터'를 사용하여 원하는대로 사용할 수 있습니다.