2016-09-25 15 views
8

私は53.0.2785.116 m(64ビット)のChromeを使用しています。取得:jsonデータを投稿し、アプリケーション/ jsonをtext/plainに変更します。

私はdevtoolsで次のヘッダーを手に入れました。問題は "//"コメントでマークされています。コンテンツの種類は本当に私たちがapplication/jsonに設定することを許可していません。私は100種類の方法を試しました。

import fetch from 'isomorphic-fetch'; 
const option = { 
    method: 'POST', 
    mode: 'no-cors', 
    headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json' 
    }, 
    body: JSON.stringify({'aa':'bb'}) 
} 
fetch('/books', opts) 
.then(check401) 
.then(check404) 
.then(jsonParse) 
.then(errorMessageParse); 

リクエストヘッダ

accept:application/json 
Accept-Encoding:gzip, deflate 
Accept-Language:zh-CN,zh;q=0.8 
Connection:keep-alive 
Content-Length:97 
content-type:text/plain;charset=UTF-8 //What happen? 
Host:127.0.0.1:8989 
Origin:http://127.0.0.1:8989 
Referer:http://127.0.0.1:8989/ 
User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.116 Safari/537.36 
+1

ノート、オブジェクト 'option'は、作成されています。 – guest271314

答えて

8

に設定する必要があります。問題は、 'モード' 'ノーコア'で作業すると、ヘッダーが不変になり、一部のエントリを変更できなくなることです。あなたが変更できないヘッドの1つはContent-Typeです。あなたは「ノー・CORS」に「モード」を設定すると、あなただけのこれらのヘッダーに変更することができるようになります。その値

  • Accept
  • Content-Language
  • Content-TypeAccept-Languageとを、一度解析され、持っていますapplication/x-www-form-urlencodedmultipart/form-data、または別の

text/plain WOあるMIMEタイプ(パラメータを無視して) rds、 'mode' '-no-'cors'でapplication/x-www-form-urlencodedmultipart/form-data、またはtext/plainのみをContent-Typeに設定できます。

解決方法は、フェッチを使用して停止するか、「cors」「mode」に変更します。もちろん、これはサーバが 'cors'リクエストを受け入れる場合にのみ機能します。ここで

は、ときに必要な上記のコードが応答でCORSヘッダを注入しますあなたはApacheサーバでCORSを可能にすることができる方法の例

SetEnvIfNoCase Access-Control-Request-Method "(GET|POST|PUT|DELETE|OPTIONS)" IsPreflight=1 
SetEnvIfNoCase Origin ".*" AccessControlAllowOrigin=$0 
SetEnvIfNoCase Origin "https://(url1.com|url2.com)$" AccessControlAllowOrigin=$0 

Header always set Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin 
Header always set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS" env=IsPreflight 
Header always set Access-Control-Allow-Headers "Content-Type, Authorization, Accept, Accept-Language" env=IsPreflight 
Header always set Access-Control-Max-Age "7200" env=IsPreflight 
RewriteCond %{REQUEST_METHOD} OPTIONS 
RewriteCond %{ENV:IsPreflight} 1 
RewriteRule ^(.*)$ $1 [R=204,L] 

です。 このコードでは、サーバーはCORSをドメイン "url1.com"または "url2.com"からのみ許可します。 `opts`がfetch``に渡されるがここで

は、いくつかの参照

+0

ありがとうございます。 –

0

mode:"no-cors"オプションが問題であるように思われます。そのオプションを削除し、Content-Type"application/json"

+0

@BowenWang jsfiddle https://jsfiddle.net/b5j4vw5c/ – guest271314

+0

ありがとうございます。回答は私のために働いた。 –

関連する問題