質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

1回答

1370閲覧

外部からjsで動的にCDNからjsファイルを読み込む方法について

lot-uni

総合スコア0

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2022/12/22 13:44

前提

JavaScriptで動的にjsファイルを読み込んで、実行する方法を確立する為にこの質問をしています。
import.jsが読み込まれると

引用テキストMIME タイプ (“text/plain”) の不一致により “https://raw.githubusercontent.com/lot-uni/CDN/main/alert.js” からのリソースがブロックされました (X-Content-Type-Options: nosniff)。

エラーメッセージが発生してしまいました。

js import.js

1window.onload = function() { 2var script = document.createElement( 'script' ); 3 4script.type = 'text/javascript'; 5script.src = 'https://raw.githubusercontent.com/lot-uni/CDN/main/alert.js'; 6 7var firstScript = document.getElementsByTagName( 'script' )[ 0 ]; 8firstScript.parentNode.insertBefore( script, firstScript ); 9}

実現したいこと

cndからjsファイルを動的に読み込んで実行できるようにしたいです。

発生している問題・エラーメッセージ

使用しているブラウザはfirefoxです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

マイムタイプが一致しないというエラーが出ているようです

見た感じCORSには引っ駆らないようなのでどうしてもというのであればこんな感じで

javascript

1window.addEventListener('load',async()=>{ 2 const script=Object.assign(document.createElement('script'),{ 3 textContent:await fetch('https://raw.githubusercontent.com/lot-uni/CDN/main/alert.js').then(res=>res.text()) 4 }); 5 document.head.insertBefore(script,document.head.querySelector('script')); 6});

調整
上記若干調整してこんなふうでも良いかも

javascript

1window.addEventListener('load',async()=>{ 2 const script=Object.assign(document.createElement('script'),{ 3 src:window.URL.createObjectURL(new Blob([await fetch('https://raw.githubusercontent.com/lot-uni/CDN/main/alert.js').then(res=>res.text())])) 4 }); 5 document.head.insertBefore(script,document.head.querySelector('script')); 6});

投稿2022/12/23 01:02

編集2022/12/23 03:41
yambejp

総合スコア114786

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問