.NETコアで認証ミドルウェアでCORSを使用できます

Question

現在、私の.netコア2 Web APIとは別の角型アプリケーションWebクライアントがあります。角度アプリはlocalhost：35000でホストされ、Web APIはlocalhost：36000でホストされます。このため、CORSが要求を成功させるためには、さまざまな場所が必要です。次のようにStartup.csでは、私は私の認証ミドルウェアを設定している：

services.AddOpenIddict(options => 
      { 
       // Integrate with EFCore 
       options.AddEntityFrameworkCoreStores<MylestoneIdentityContext>(); 
       // Use Json Web Tokens (JWT) 
       options.UseJsonWebTokens(); 
       // Set a custom token endpoint (default is /connect/token) 
       options.EnableTokenEndpoint(Configuration["Authentication:OpenIddict:TokenEndPoint"]); 
       // Set a custom auth endpoint (default is /connect/authorize) 
       options.EnableAuthorizationEndpoint(Configuration["Authentication:OpenIddict:AuthorizationEndPoint"]); 
       // Allow client applications to use the grant_type=password flow. 
       options.AllowPasswordFlow(); 
       // Enable support for both authorization & implicit flows 
       options.AllowAuthorizationCodeFlow(); 
       options.AllowImplicitFlow(); 
       // Allow the client to refresh tokens. 
       options.AllowRefreshTokenFlow(); 
       // Disable the HTTPS requirement (not recommended in production) 
       options.DisableHttpsRequirement(); 
       // Register a new ephemeral key for development. 
       // We will register a X.509 certificate in production. 
       options.AddEphemeralSigningKey(); 
      }); 
... 
app.UseAuthentication(); 

を、次のように私は自分のアプリケーションにCORS要求を許可されています

services.AddCors(options => 
      { 
       options.AddPolicy("AllowCors", 
        builder => builder.AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod()); 
      }); 
... 
app.UseCors("AllowCors"); 
... 
//also put [EnableCors("AllowCors")] on each controller class declaration 

私は、サーバーをヒットし、成功したユーザーを登録することができていますアカウントは、ログインしようとするときしかし、私はまだブラウザにエラーが表示されます。

Failed to load http://localhost:36000/api/connect/token: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:35000' is therefore not allowed access. The response had HTTP status code 500. 

が、私はこれが原因になるかもしれないと思う/ API /トークンAを持っていない/接続私は注釈[EnableCors（ "AllowCors"）]を置くことができます。

post(url, data, opts = {}) { 
     this.configureAuth(opts); 
     return this.http.post(url, data, opts); 
} 

configureAuth(opts: any) { 
    var i = localStorage.getItem(this.authKey); 
    if (i != null) { 
     var auth = JSON.parse(i); 
     console.log(auth); 
     if (auth.access_token != null) { 
      if (opts.headers == null) { 
       opts.headers = new Headers(); 
      } 
      opts.headers.set("Authorization", `Bearer ${auth.access_token}`); 
      opts.headers.set("Access-Control-Allow-Origin", `*`); 
     } 
    } 
} 

I」は次の角HTTPサービスラッパーを打つ

return this.http.post(
      url, 
      this.toUrlEncodedString(data), 
      new RequestOptions({ 
       headers: new Headers({ 
        "Content-Type": "application/x-www-form-urlencoded", 
        "Access-Control-Allow-Origin": "*" 
       }) 
      })) 

：私はこの私のWebクライアントでは、次のように私の要求に指定されたヘッダを付加するなど、克服するための複数の方法を試してみました私のミドルウェアにこの許可要求を通過させる方法に関するアイデアがなくなりました。すべての助けに感謝します。

Answer 1

Access-Control-Allow-Originヘッダーに「*」というワイルドカードを使用することはできません。
はMDN: Credentialed requests and wildcardsを参照してください。

資格認定の要求に応じて、サーバはワイルドカード「*」を指定する代わりに 、アクセス制御 - 許可 - 起源ヘッダの値に の原点を指定しなければなりません。