私はMEAN Stackを使用してWebアプリケーションを作成していますが、試しても検索しても解決できない問題が発生しました。要求されたリソースに「Access-Control-Allow-Origin」ヘッダーがありません
私は、ExpressJSでパスポート/パスポート・フェイスブックを使用してログインしようとしています。私のブラウザのURLに書き込むと、localhost/api/auth/facebook
すべて正常に動作します。
ただし、このようなHTMLコードで要素を作成した場合、<a href="/api/auth/facebook">Login with Facebook</a>
は404 page
になります(下記のnginxを参照)。 そして、このような角度の方法で試してみると、<button ng-click="login_fb()">Login with Facebook</button>
のようにNo 'Access-Control-Allow-Origin' header is present on the requested resource.
というエラーが表示されます。
私は<a href="...">
要素を使うべきであると信じているが、私は、私は私のNodeJSサーバー上でCORSを有効にするので、私のnginxのスクリプトはこれで、それをブロックしていると思う:
server.all('/*', function (req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
res.header("Access-Control-Allow-Headers", "X-Requested-With, Content-Type");
next();
});
私はあまりにも私のnginxのスクリプトを残しておきます(「<」内部ブロックを無視し、「>」):
worker_processes 4;
events {
worker_connections 1024;
}
http {
upstream backend {
server 127.0.0.1:8080;
}
# To optimize the response of static files
sendfile on;
server {
# Listen to normal port
listen 80;
# Let through files like CSS, JPG, JS, ...
include mime.types;
# Alias for this server
server_name <my-domain>;
# Where the HTML files are located
root <my-folder>;
# Route for API calls
location /api/ {
proxy_pass http://backend;
}
# Route for the index
location ~ ^/*$ {
index index.html index.htm;
}
# Route for 404 page
error_page 404 /index.html;
}
}
EDIT:この<a href="http://localhost:8080/api/auth/facebook">Login with Facebook</a>
のようなリンクを使用するが、それはハードコードされたURLを使用するように私を強制的に、私は最終的にドメインの下にこのアプリを入れます。
NEW EDIT:それはそれアンギュラルート思う、と私は$ routeProviderで宣言されていないので、それがないようにするには404