[解決済み] Access-Control-Allow-Originで "origin is not allowed "というエラーが表示されるのですが、なぜでしょうか?[重複しています。]
2022-04-28 02:24:52
質問
以下のエラーが表示されます。
Origin http://localhost:8080 is not allowed by Access-Control-Allow-Origin
を、このコードに置き換えてください。
var http = new getXMLHttpRequestObject();
var url = "http://gdata.youtube.com/action/GetUploadToken";
var sendXML = '<?xml version="1.0"?><entry xmlns="http://www.w3.org/2005/Atom"'+
'xmlns:media="http://search.yahoo.com/mrss/'+
'xmlns:yt="http://gdata.youtube.com/schemas/2007">'+
'<media:group><media:title type="plain">My First API</media:title>'+
'<media:description type="plain">First API</media:description>'+
'<media:category scheme="http://gdata.youtube.com/schemas/2007/categories.cat">People</media:category>'+
'<media:keywords>first, api</media:keywords></media:group></entry>';
http.open("POST", url, true);
http.setRequestHeader("Authorization", "AuthSub token=" + AccessToken);
http.setRequestHeader("X-GData-Key", "key="+ dev_key);
http.setRequestHeader("Content-Type", "application/atom+xml; charset=UTF-8");
http.onreadystatechange = function() {
if(http.readyState == 4) {
alert(http.responseXML);
}
}
http.send(sendXML);
何が原因で、どうすれば解決するのでしょうか?
どのように解決するのですか?
現在のドメイン外でajaxリクエストを行う場合、Javascriptが制限されます。
- 例1:ドメインがexample.comで、test.comにリクエストしたい=> できません。
- 例2:ドメインがexample.comで、inner.example.comにリクエストを出したい=> できません。
- 例3:ドメインがexample.com:80で、example.com:81にリクエストしたい =>できない
- EX 4: あなたのドメインは example.com で、example.com にリクエストを出したい => できる。
Javascriptは、悪意のあるスクリプトがリモートサーバーに接続して機密データを送信できないように、セキュリティ上の理由から"same origin policy"によって制限されています。
jsonp
は、javascriptの異なる使用方法です。リクエストを行い、その結果がコールバック関数にカプセル化され、クライアントで実行されるのです。これは、htmlのhead部分に新しいscriptタグをリンクするのと同じです(ここでは、自分のドメインとは異なるドメインのスクリプトを読み込むことができることはご存知でしょう)。
ただし、jsonpを使用するためには、サーバーが正しく設定されている必要があります。もしそうでなければ、jsonpを使うことはできず、サーバーサイドプロキシ(PHP、ASPなど)に頼らざるを得ません。このトピックに関するガイドはたくさんあるので、ググってみてください。
関連
-
[解決済み] Access-Control-Allow-Originヘッダーはどのように機能するのですか?
-
[解決済み] Access-Control-Allow-OriginでOriginのNULLが許可されていない。
-
[解決済み] 私のJavaScriptコードは "No 'Access-Control-Allow-Origin' header is present on requested resource "というエラーを受け取りますが、Postmanはそうならないのはなぜですか?
-
[解決済み] Access-Control-Allow-Origin複数オリジンのドメイン?
-
[解決済み] REST APIからデータを取得しようとしたときに、要求されたリソースに'Access-Control-Allow-Origin'ヘッダーが存在しない。
-
[解決済み] OPTIONSルートにCORSヘッダを追加しても、ブラウザが私のAPIにアクセスできないのはなぜですか?
-
[解決済み] file:// URLから実行されるアプリケーションのリクエストで、"Origin null is not allowed by Access-Control-Allow-Origin" エラーが発生する。
-
[解決済み] アクセス制御-許可-起源のワイルドカードサブドメイン、ポート、プロトコル
-
[解決済み】Access-Control-Allow-OriginでOriginが許可されない。
-
[解決済み】Access-Control-Allow-Originでオリジン<origin>が許可されない。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Vue Element-uiは、アイコンを追加するためのツリーコントロールノードを詳細に実装しています。
-
Vueにシンプルなメモ帳機能を実装
-
vueディレクティブv-bindの使用と注意点
-
vue ディレクティブ v-html と v-text
-
[解決済み】Node.js getaddrinfo ENOTFOUND
-
[解決済み】<select>で現在選択されている<option>をJavaScriptで取得するにはどうすればよいですか?
-
[解決済み] Access-Control-Allow-Originヘッダーはどのように機能するのですか?
-
JavaScriptのgetElementById、getElementsByTagNam、getElementsByClassNameの違いと使い方
-
[解決済み] XMLHttpRequestが読み込めない XXX 'Access-Control-Allow-Origin' ヘッダがない
-
[解決済み】Access-Control-Allow-Originを回避する方法は?