2017-03-14 23 views
0

ポート8080で実行されているCORSヘッダーをサポートするExpress.jsサーバーがあり、iPhone 5のReact NativeアプリケーションからそのポートへのHTTP要求を作成しようとしています。CORS:localhostへのhttp要求が反応ネイティブで拒否されました

import request from 'superagent' 

const getMarkers = (url, callback) => { 
    request 
    .get(url) 
    .set('Accept', 'application/json') 
    .end(callback) 
} 

getMarkers('localhost:8080/markers, this.handleMarkers) 

そして、私のエクスプレスミドルウェアは、次のようになります:

[Error: Request has been terminated 
Possible causes: the network is offline, Origin is not allowed by Access-Control-Allow-Origin, the page is being unloaded, etc.] 

要求は次のようになります。

app.use((req, res, next) => { 
    res.header('Access-Control-Allow-Origin', '*') 
    res.header('Access-Control-Allow-Headers', 
    'Origin, X-Requested-With, Content-Type, Accept') 
    next() 
}) 
が、次のエラーを取得しています

私は自分のプロジェクトに「任意の負荷」を許可しました。

これらのリクエストは、iosシミュレータを使用するとうまく動作します。また、これらのリクエストは、ngrokをダウンロードし、エクスプレスサーバーディレクトリで実行し、ngrokが提供するhttpsアドレスにクライアント側のリクエストを行うときにうまく動作します。

質問:どのようにngrokのようなものを使用せずにこれらの要求を容易にすることができますか?可能であれば、httpとlocalhostだけを使ってすばやく開発できるようにしたいと思います。私は他の人がこの質問に提供できる洞察に非常に感謝しています!私はこれがあなたの問題であると考えてい

答えて

0

特急アプリの場合:場合

App Transport Security is a security feature, added in iOS 9, that rejects all HTTP requests that are not sent over HTTPS. This can result in HTTP traffic being blocked, including the developer React Native server.

ATS is disabled by default in projects generated using the React Native CLI in order to make development easier. You should re-enable ATS prior to building your app for production by removing the NSAllowsArbitraryLoads entry from your Info.plist file in the ios/ folder.

<key>NSAppTransportSecurity</key> 
<dict> 
    <key>NSAllowsArbitraryLoads</key> 
    <true/> 
    <key>NSExceptionDomains</key> 
    <dict> 
     <key>**YOUR DOMAIN HERE**</key> 
     <dict> 
      <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key> 
      <true/> 
     </dict> 
    </dict> 
</dict> 
+0

ありがとう@MattAft。私は混乱している - 私は設定が任意の負荷を可能にすると私が望むものであるHTTP要求をすることができるようになると思った。私は間違っていますか? – duhaime

+0

ええ、あなたはそれを可能にするためにオンにしたいと思うでしょう。しかし、あなたはそれが働きたいドメインを設定しなければなりません。私の答えは、それを動作させるために置いたもので更新してください。 –

+0

素晴らしいです、ありがとうございます。私は ' localhost'と同じものを持っていますが、私はまだlocalhostに対してhttpリクエストを行うことができません。他に何を試してみるか知っていますか? – duhaime

0

それはここで、バグですが、私が役に立ったと評価していているいくつかの作業--ラウンドがあり
- 明示的にhttpヘッダーを追加してください:"X-Requested-With": "XMLHttpRequest"
- 127.0.0.1ではなくIP 0.0.0.0で動作するサーバーを設定する必要がある場合があります

反応するネイティブのアプリケーションの場合:
- 私は127.0.0.1を使用する必要があった経験があり、要求を行う際に特定のホストの名前を使用していました(ローカルホストを使用)。

関連する問題