2017-06-12 8 views
0

Goで、私のフロントエンドがAngular(AngularJSなし)のAPIを開発していますが、APIをWebアプリケーションからAngularで呼び出すと、バックエンドにヘッダーが表示されません私のAPIはJWTベースの認証を持っているのでヘッダーhttpはAPIに配信されません

また、PostmanとGo Requestクライアントを使用してアプリケーションをテストしていて、ヘッダーがAPIに問題なく配信されていることを言いたいと思います。

以下は、バックエンドのCORSと私のフロントエンドからのAPI呼び出しです。

マイバックエンド:

func Cors() gin.HandlerFunc { 
    log.Println("CORS Middleware") 
    return func(c *gin.Context) { 
     c.Writer.Header().Add("Access-Control-Allow-Origin", "*") 
     c.Next() 
    } 
} 

私のフロントエンド:

getData() { 

const auth = `Bearer ${this.token}`; 

const headers = new Headers({ 
    'Access-Control-Allow-Origin': '*', 
    'Accept': 'application/json', 
    'Authorization': auth, 
}); 

const options = new RequestOptions(headers); 

console.log(headers); //Here I can see 

const products = this.http.get('localhost:8000/api/products', options) 
       .subscribe((response: Response) => { 
        this.data = response.json(); 
       }); 
return products; 
} 

おかげで、私の英語のため申し訳ありませんが、私は私のCORSが問題を引き起こしていると思います。代わりに

const options = new RequestOptions(headers); 

ドゥの

+0

、これは関係のないことかもしれないが、あなたは「認証」の末尾にカンマを削除する必要があります:あなたのバックエンドについては

は、ここでの改善提案は(ほとんどの場合を処理する必要があります)ですAUTH、 – SolidSnake

答えて

0

const options = new RequestOptions({ headers: headers }); 

constructor for RequestOptionsはないHeadersRequestOptionsArgsが必要です。


また、あなたはCORSについてよく理解していないようです。フロントエンドからバックエンドにヘッダーを送信する必要はありません(CORS要求であることがわかると、ブラウザは自動的に必要なものを追加します)。これらのヘッダー(Access-Control-Allow-Origin)は、サーバーによってのみ送信されます。

func Cors() gin.HandlerFunc { 
    log.Println("CORS Middleware") 
    return func(c *gin.Context) { 
     c.Writer.Header().Set("Access-Control-Allow-Origin", "*") 
     c.Writer.Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE, UPDATE") 
     c.Writer.Header().Set("Access-Control-Allow-Headers", "Origin, Content-Type, Content-Length, Accept-Encoding, X-CSRF-Token, Authorization") 
     c.Writer.Header().Set("Access-Control-Expose-Headers", "Content-Length") 
     c.Writer.Header().Set("Access-Control-Allow-Credentials", "true") 
     c.Writer.Header().Set("Access-Control-Max-Age", "86400") 
     // c.Writer.Header().Set("Content-Type", "application/json") // uncomment if needed 

     if c.Request.Method == "OPTIONS" { 
      fmt.Println("OPTIONS") 
      c.AbortWithStatus(200) 
     } else { 
      c.Next() 
     } 
    } 
} 
+0

ありがとう、私の問題はほぼ解決されました。私の認証ヘッダーは、次のような最初と最後にいくつかの兆候を見極めることができます。 郵便配達員からのリクエストとウェブアプリケーションからのリクエストを添付しました。 ANGULAR WEB APP ベアラー "\" eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE0OTk2MTUyMTAsImlhdCI6MTQ5NzAyMzIxMCwibWFpbCI6InNlbGxlciJ9.nFV5JwB5lcN3e8CuMbNNx9Y6n1tW4oBT-5Eh8H5-YQ4 \ "" POSTMAN ベアラeyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE0OTkzODIzMjksImlhdCI6MTQ5Njc5MDMyOSwibWFpbCI6ImFkbWluIn0.v3GSiAIq6Bs5w3NPfjWT1kJF2Wv6zRrkSQY7hVDe7qQ – fabulias

+0

あなたは何を意味するのですか?現在の問題は何ですか? – acdcjunior

+0

私は私のヘッダーAuthorizationを角度で作成すると、端末にBearer が表示されますが、バックエンドでヘッダーが表示されたら(go)、この文字は "\"、\ ""表示され続けます。( – fabulias

関連する問題