GitHub에서 호스팅되는 외부 JavaScript 파일 링크 및 실행


5 Answers

이것은 더 이상 가능하지 않습니다. GitHub는 JavaScript 핫 링크를 명시 적으로 비활성화했으며 최신 버전의 브라우저는 해당 설정을 존중합니다.

헤드 업 : Chrome 및 Firefox에 대한 nosniff 헤더 지원

Question

로컬 JavaScript 파일의 링크 된 참조를 GitHub 원시 버전으로 변경하려고하면 테스트 파일이 작동하지 않습니다. 오류 :

MIME 형식 ( text/plain )이 실행 가능하지 않고 엄격한 MIME 유형 검사가 사용 가능하므로 스크립트 실행을 거부했습니다.

이 동작을 비활성화하는 방법이 있습니까 아니면 GitHub 원시 파일에 연결할 수있는 서비스가 있습니까?

작업 코드 :

<script src="bootstrap-wysiwyg.js"></script>

작동하지 않는 코드 :

<script src="https://raw.github.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js"></script>



내가 오류가 파일의 시작 부분에 주석으로 인해 나타났습니다 발견, 당신은 단순히 코멘트없이 자신의 파일을 작성 하여이 문제를 해결할 수 있으며, 힘내로 밀어, 그것은 오류를 보여줍니다

이 두 파일을 동일한 페이지 코드 매기기로 시험해 볼 수 있습니다.

코멘트가없는

의견이있는




일을 분명하고 짧게 만들기

//raw.githubusercontent.com -> //rawgit.com

이것은 rawgit의 개발 호스팅에서 처리되며 프로덕션 호스팅을위한 cdn에서는 처리되지 않습니다.




파일을 github에 업로드하면이를 외부 소스 또는 무료 호스팅으로 사용할 수 있습니다. Troy Alford는 잘 설명했습니다. 그러나 쉬운 단계를 말씀 드리 자면 사이트에서 github 원시 파일을 사용할 수 있습니다.

다음은 파일의 링크입니다.

https://raw.githubusercontent.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js

이제 실행하려면 원시githubusercontent 사이의 https : // 와 점 (.)을 제거해야합니다.

이렇게 :

rawgithubusercontent.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js

이제이 링크를 방문하면 자바 스크립트를 호출하는 데 사용할 수있는 링크가 표시됩니다.

다음은 최종 링크입니다.

https://rawgit.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js

마찬가지로 CSS 파일을 호스팅하는 경우 위에서 언급 한대로해야합니다. github에서 호스팅되는 외부 CSS 또는 javascript 파일을 호출하는 간단한 링크를 만드는 것이 가장 쉬운 방법입니다.

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

추천 URL : http://101helper.blogspot.com/2015/11/store-blogger-codes-on-github-boost-blogger-speed.html




또는 마크 업 서버 측을 생성하는 경우 페치하여 삽입 할 수 있습니다. 예를 들어 JSTL에서는 다음과 같이 할 수 있습니다.

<script type="text/javascript">
    <c:import url="https://raw.github.com/mindmup/bootstrap-wysiwyg/master/bootstrap-wysiwyg.js" />
</script>

그들은 좋은 이유로 시민권자가되기를 원한다면 어떤 이유로 핫 링크를 허용하지 않습니다. 그 자바 스크립트를 캐시하고 실제로는 주기적으로 다시 가져 오는 것이 좋습니다.




내 유스 케이스는 Github와 동일한 제한 사항이있는 Bitbucket 계정에서 ' bookmarklets 'direclty를로드하는 것이 었습니다. 내가 생각해 낸 문제는 스크립트를위한 AJAX에서의 응답 문자열에 대한 eval 실행이었습니다. 아래 코드 단편은 그 접근법을 기반으로합니다.

<script>
    var sScriptURL ='<script-URL-here>'; 
    var oReq = new XMLHttpRequest(); 
    oReq.addEventListener("load", 
       function fLoad() {eval(this.responseText + '\r\n//# sourceURL=' + sScriptURL)}); 
    oReq.open("GET", sScriptURL); oReq.send(); false;
</script>

sourceURL 주석을 추가하면 브라우저의 개발자 도구 내에서 스크립트를 디버깅 할 수 있습니다.



Related