Yerel bir JavaScript dosyasının bağlı başvurusunu GitHub raw sürümüne değiştirmeye çalıştığımda test dosyamın çalışması durur. Hata:

MIME türü ( text/plain) çalıştırılamadığından ve katı MIME türü denetimi etkinleştirildiğinden ... komut dosyasını çalıştırmayı reddetti .

Bu davranışı devre dışı bırakmanın bir yolu var mı veya GitHub ham dosyalarına bağlanmaya izin veren bir hizmet var mı?

Çalışma kodu:

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

Çalışmayan kod:

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

Orada olan iyi bir çözüm kullanılarak, şimdi, bunun için jsdelivr.net .

Adımlar :

1. GitHub'da bağlantınızı bulun ve "Raw" sürümüne tıklayın.
2. URL'yi kopyalayın.
3. Değişim raw.githubusercontent.comiçincdn.jsdelivr.net
4. Takın /gh/adınız önce.
5. branchAdı kaldırın .
6. (İsteğe bağlı) Bağlamak istediğiniz sürümü ekleyin , çünkü @version(bunu yapmazsanız, en son sürümü alırsınız - bu uzun süreli önbelleğe neden olabilir)

Örnekler :

http://raw.githubusercontent.com/<username>/<repo>/<branch>/path/to/file.js

En son sürümü edinmek için bu URL'yi kullanın:

http://cdn.jsdelivr.net/gh/<username>/<repo>/path/to/file.js

Belirli bir sürümü veya işleme karmasını almak için bu URL'yi kullanın:

http://cdn.jsdelivr.net/gh/<username>/<repo>@<version or hash>/path/to/file.js

Üretim ortamları için , şube yerine belirli bir etiketi veya kesin karmayı hedeflemeyi düşünün. En son bağlantıyı kullanmak dosyanın uzun süreli önbelleğe alınmasına neden olarak, yeni sürümleri zorladıkça bağlantınızın güncellenmemesine neden olabilir. Bir dosyaya kesin-karma veya etiketle bağlanmak, bağlantıyı sürüme özgü kılar.

Bu neden gerekli?

2013 yılında GitHub kullanmaya başladı X-Content-Type-Options: nosniff , bu da daha modern tarayıcılara katı MIME türü kontrolünü zorlaması talimatını verdi. Daha sonra, sunucu tarafından döndürülen MIME türünde ham dosyaları döndürerek tarayıcının dosyayı amaçlandığı şekilde kullanmasını önler (tarayıcı ayarı onurlandırıyorsa).

Bu konuyla ilgili arka plan için lütfen bu tartışma konusuna bakın .

Bu artık mümkün değil. GitHub, JavaScript hotlinking'i açıkça devre dışı bıraktı ve tarayıcıların daha yeni sürümleri bu ayara uyuyor.

Uyarı: Chrome ve Firefox'a gelen nosniff başlık desteği

rawgithub.comYeniden yönlendirmelerin rawgit.comYukarıdaki örnekte şimdi olurdu Yani

http://rawgit.com/user/package/master/link.min.js

GitHub Pages , GitHub'ın bu soruna resmi çözümüdür.

raw.githubusercontenttext/plaindosya bir CSS veya JavaScript dosyası olsa bile tüm dosyaların MIME türünü kullanmasını sağlar . Bu nedenle https://raw.githubusercontent.com/‹user›/‹repo›/‹branch›/‹filepath›, doğru MIME türü değil, bir düz metin dosyası olacak ve bu dosya ile bağlantı verilecek <link href="..."/>veya <script src="..."></script>çalışmayacak; CSS uygulanmayacak / JS çalışmaz.

GitHub Pages deponuzu özel bir URL'de barındırır, bu nedenle tek yapmanız gereken dosyalarınızı kontrol etmek ve göndermek. Çoğu durumda, GitHub Sayfalarının özel bir şubeye bağlanmanızı gerektirdiğini,gh-pages .

Yeni sitenizde (genellikle https://‹user›.github.io/‹repo›, gh-pagesşubeye taahhüt edilen her dosya (en son taahhüt) bu url'de bulunur. Böylece js dosyanızla bağlantı kurabilirsiniz <script src="https://‹user›.github.io/‹repo›/file.js"></script>ve bu doğru MIME türü olacaktır.

Derleme dosyalarınız var mı?

Şahsen benim tavsiyem bu dalı paralel çalıştırmak master. Açık gh-pagesşube, size düzenleyebilirsiniz .gitignoredosyayı iade ederken, sitenize (örneğin herhangi minified varsa / derlenmiş dosyalar) için gereken tüm dist / yapı dosyaları göz ardı tutarak sizin üzerinde masterşube. Normal repodaki derleme dosyalarındaki değişiklikleri izlemek istemediğiniz için bu yararlıdır. Sadece birleştirme, barındırılan dosyaları güncelleştirmek istediğiniz her zaman masteriçine gh-pages, yeniden, taahhüt ve sonra itin.

(protip: bu adımlarla aynı işlemle birleştirebilir ve yeniden oluşturabilirsiniz :)

$ git checkout gh-pages
$ git merge --no-ff --no-commit master  # prepare the merge but don’t commit it (as if there were a merge conflict)
$ npm run build                         # (or whatever your build process is)
$ git add .                             # stage the newly built files
$ git merge --continue                  # commit the merge
$ git push origin gh-pages

Yukarıdaki cevaplar soruyu açıkça cevaplıyor, ancak başka bir alternatif sunmak istiyorum - Benzer sorunu çözmek için farklı bir görüş / yaklaşım.

Dosyalar X-Content-Type-Optionsiçin yanıt üstbilgisini kaldırmak için tarayıcı uzantısını da kullanabilirsiniz raw.githubusercontent.com. Yanıt başlıklarını değiştirmek için birkaç tarayıcı uzantısı vardır.

1. İstenen: Chrome + Firefox
2. Üstbilgileri Değiştir: Firefox

Requestly kullanıyorsanız, iki çözüm önerebilirim

Çözüm 1: Üstbilgileri Değiştir Kuralını kullanın ve yanıt üstbilgisini kaldırın

adımlar

1. Http://www.requestly.in adresinden Requestly yükleyin
2. Kurallar Sayfasına Git
3. Kural oluşturmak için Simge Ekle'yi tıklayın
4. Üstbilgileri Değiştir'i seçin
5. İsim ve Betimleme Ver
6. Seç Remove-> Response->X-Content-Type-Options
7. Kaynak alanına Url-> Contains-> girinraw.githubusercontent.com

Çözüm 2: Ana bilgisayarı Değiştir Kuralını kullanın

1. Http://www.requestly.in adresinden Requestly yükleyin
2. Kurallar Sayfasına Git
3. Kural oluşturmak için Simge Ekle'yi tıklayın
4. Değiştir raw.githubusercontent.comilerawgit.com

Daha fazla ayrıntı için bu ekran görüntüsüne bakın

Nasıl test edilir

Kodumuzda komut dosyası olarak ham github dosyalarını kullanıp kullanamayacağımızı test etmek için basit bir JS Fiddle oluşturduk. İşte aşağıdaki kod ile Fiddle

<center id="msg"></center>

<script src="https://raw.githubusercontent.com/sachinjain024/practicebook/master/web-extensions-master/storage/background.js"></script>
<script>
try {
  if (typeof BG.Methods !== 'undefoned') {
    document.getElementById('msg').innerHTML = 'Script evaluated successfully!';
  }
} catch (e) {
  document.getElementById('msg').innerHTML = 'Problem evaluating script';
}
</script>

Görüyorsanız Script evaluated successfully!, kodunuzda raw github dosyasını kullanabileceğiniz anlamına gelir. Aksi takdirde Problem evaluating script, ham github kaynağından komut dosyası yürütülürken bir sorun olduğunu gösterir.

Ben de yazdım bir makale üzerinde Requestly blog bu konuda. Daha fazla bilgi için lütfen bakın.

Umarım yardımcı olur!!

Feragatname: Ben Requestly'in yazarıyım Bu yüzden sevmediğiniz her şeyi suçlayabilirsiniz.

https://raw.githack.com/

bu site için bir CDN kaynağı buldum

• nosniffhttp üstbilgisini kaldır
• mime typeext adına göre düzelt

ve bu site:

https://rawgit.com/

NOT: RawGit kullanım ömrünün sonuna gelmiştir

Açık ve kısa şeyler yapmak

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

Bu, üretim barındırma için cdn'leri değil, rawgit'in geliştirme barındırma tarafından ele alındığını unutmayın

Kullanım durumum, Bitbucket hesabımdan Github ile aynı kısıtlamalara sahip olan ' yer imleri ' dizinini yüklemekti . Etrafımdaki çalışma senaryo için AJAX'a evalve yanıt dizesinde çalışıyordu, aşağıda snippet bu yaklaşıma dayanıyordu.

<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>

sourceURLYorum eklemenin, komut dosyasının tarayıcının geliştirici araçlarında hata ayıklamasına izin verdiğini unutmayın .

Bir dosya github'a yüklendiğinde, harici kaynak veya ücretsiz barındırma olarak kullanabilirsiniz. Troy Alford bunu çok iyi açıkladı. Ancak daha kolay hale getirmek için size bazı kolay adımları söylememe izin verin, o zaman sitenizde bir github ham dosyasını kullanabilirsiniz:

Dosyanızın bağlantısı:

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

Şimdi yürütmek için https: // ve raw ile githubusercontent arasındaki nokta (.)

Bunun gibi:

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

Şimdi bu bağlantıyı ziyaret ettiğinizde, javascriptinizi aramak için kullanılabilecek bir bağlantı alacaksınız:

İşte son bağlantı:

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

Benzer şekilde, bir css dosyası barındırıyorsanız, bunu yukarıda belirtildiği gibi yapmanız gerekir. Github'da barındırılan harici css veya javascript dosyanızı aramak için basit bir bağlantı almanın en kolay yoludur.

Umarım bu yardımcı olur.

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

Dosyanın başlangıcındaki yorumlar nedeniyle hatanın gösterildiğini gördüm, Bu sorunu çözebilirsiniz, sadece yorum yapmadan kendi dosyanızı oluşturarak ve git'e bas, hiçbir hata göstermez

Kanıt için bu iki dosyayı aynı kolay sayfa koduyla deneyebilirsiniz:

yorumsuz

yorum ile

Seninle aynı sorunu yaşadım, yaptığım şey

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

Benim için çalışıyor.

En basit yol:
<script type="text/plain" src="http://raw.githubusercontent.com/user/repo/branch/file.js"></script>
GitHub tarafından sunulan,
ve

çok

raw.github.comdosya varlığına gerçek anlamda ham erişim değil, Rails tarafından oluşturulan bir görünümdür. Bu yüzden erişim raw.github.comgerekenden çok daha ağır. Neden raw.github.combir Rails görünümü olarak uygulandığını bilmiyorum . Bu rota sorununu düzeltmek yerine GitHub bir X-Content-Type-Options: nosniffbaşlık ekledi .

Çözüm:

• Komut dosyasını şuraya koy user.github.io/repo
• Rawgit.com gibi üçüncü taraf bir CDN kullanın.

Alternatif olarak, biçimlendirme sunucu tarafınızı oluşturuyorsanız, yalnızca getirip enjekte edebilirsiniz. Örneğin, JSTL'de şunları yapabilirsiniz:

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

Bir sebepten dolayı hotlinking'e izin vermezler, bu yüzden iyi bir vatandaş olmak istiyorsanız muhtemelen kötü bir form. Bu javascript önbellek ve sadece uygun gördüğünüz gibi periyodik olarak yeniden getirmenizi öneririz.

Misal

orijinal

https://raw.githubusercontent.com/antelove19/qrcodejs/master/qrcode.min.js

cdn.jsdelivr.net

https://cdn.jsdelivr.net/gh/antelove19/qrcodejs/qrcode.min.js