web-dev-qa-db-ja.com

AngularJSでHTTPSを使用するにはどうすればよいですか？

私はAngularJSを使用しています、$resource＆$httpとapisを使用しますが、セキュリティ上の理由により、HTTPSリクエストを作成する必要があります（HTTPSプロトコルで動作します）。

AngularJSでhttpsを使用する方法は何ですか。ご協力いただきありがとうございます。

javascriptnode.jsangularjsangular-ui
42
Dick Van Ocampo

通常どおり_$http_ apiを使用します。

_$http.get('/someUrl').success(successCallback);
_

アプリがHTTPS経由で提供されている場合、発信している呼び出しはすべて同じホスト/ポートなどに送信されるため、HTTPS経由でも送信されます。

リクエストに完全なURIを使用する場合（例： $http.get('http://foobar.com/somePath')その後、httpsを使用するようにURIを変更する必要があります

27
craigb

何らかの理由で、リクエストの末尾に末尾/がない場合、AngularはすべてのリクエストをHTTP経由で送信します。ページ自体がHTTPS経由で提供される場合でも。

例えば：

$http.get('/someUrl').success(successCallback);  // Request would go over HTTP even if the page is served via HTTPS

ただし、先頭にすべてを追加すると、すべてが期待どおりに機能します。

$http.get('/someUrl/').success(successCallback);  // This would be sent over HTTPS if the page is served via HTTPS

編集：この問題の根本的な原因は、Angularがサーバーからの実際のヘッダーを調べることです。 httpsを介したhttpデータの内部パスが正しくない場合、httpヘッダーが残り、最後に/を追加しない場合、Angularはそれらを使用します。つまり、httpsを介してコンテンツを提供するNGINXがあるが、httpを介してバックエンドのGunicornにリクエストを渡す場合、この問題が発生する可能性があります。これを修正する方法は、正しいヘッダーをGunicornに渡すことです。そのため、フレームワークはhttps経由で提供されるという印象を受けます。 NGINXでは、次の行でこれを行うことができます。

proxy_set_header X-Forwarded-Proto $ scheme;

26
Danil

私は最近、Angular 1.2.26を使用して同様の問題に遭遇しましたが、ロードバランサーを介して相互作用する場合のみ-https関連ヘッダーを取り除く可能性があります...まだ原因は不明です。私はこれに頼った：

uri = $location.protocol() + "://" + $location.Host() + "/someUrl"

非標準のポートを使用している場合も、$ location.port（）を追加することをお勧めします。

9
Cork