Nelmio Cors , Api how to set for angular2 request's with token headers

Question

I'm working on a project which has an API built with symfony2 as backend and front end app in Angular2. After logging and getting token when I try to sent get request with token header to my backend this issue happend

A Token was not found in the TokenStorage

below screenshot of errors

internal server error

header response

BACKEND SETTING

#nelmioCorsBundle configuration IN CONFIG.YML
nelmio_cors:
defaults:
    allow_credentials: true
    allow_origin: '*'
    allow_headers: ['accept', 'content-type', 'authorization', 'x-http-method-override']
    allow_methods: ['POST', 'PUT', 'PATCH', 'GET', 'DELETE']
    max_age: 3600


paths:

    '^/':
        allow_origin: ['http://localhost:4201']
        allow_headers: ['Authorization', 'X-Requested-With', 'Content-Type', 'Accept', 'Origin', 'X-Custom-Auth']
        allow_methods: ['POST', 'PUT', 'GET', 'DELETE', 'OPTIONS']
        max_age: 3600
        hosts: []
        origin_regex: false
        hosts: ['^\.']

BACKEND SETTING SECURITY.YML

firewalls:
        login:
            pattern: ^/api/login
            form_login:
            provider: fos_userbundle
            login_path: /api/login
            check_path: /api/login_check
            username_parameter: username
            password_parameter: password
            success_handler: lexik_jwt_authentication.handler.authentication_success
            failure_handler: lexik_jwt_authentication.handler.authentication_failure
            require_previous_session: false
        logout:       true
        anonymous:    true

    api:
        pattern:   ^/api
        anonymous: false
        provider: fos_userbundle
        lexik_jwt:  #par defaut check token in Authorization Header prefixer par Bearer
            authorization_header: # check token in Authorization Header
                    enabled: true
                    prefix:  Bearer
                    name:    Authorization
            cookie:               # check token in a cookie
                    enabled: false
                    name:    BEARER
            query_parameter:      # check token in query string parameter
                    enabled: true
                    name:    bearer
            throw_exceptions:        true     # When an authentication failure occurs, return a 401 response immediately
            create_entry_point:      false      # When no authentication details are provided, create a default entry point that returns a 401 response
            authentication_provider: lexik_jwt_authentication.security.authentication.provider
            authentication_listener: lexik_jwt_authentication.security.authentication.listener

score 0 · Answer 1 · answered Aug 29 '17 at 07:45

0

In your angular client when you sign in you must get some kind of access token. Therefore your headers should contain something like :

Authorization: Bearer <Token>

answered Aug 29 '17 at 07:45

Nick

825
1
8
20

getListcommandes(idcommande: number): Observable { const url=`${this.postUrlCommandes}/${idcommande}`; let headers = new Headers({ 'Authorization': 'Bearer ' +mytoken }); headers.append('Content-Type', 'application/json'); let options = new RequestOptions({ headers: headers}); return this.http.get(url,headers) .map((response: Response) => { var result = response.json(); return result; }); } – kadal sparkadal Aug 29 '17 at 08:51
Weird, you set you headers but they do not appear in the Request headers( from the picture you have uploaded). – Nick Aug 29 '17 at 10:33
1

Try something like this: 1. `import { HttpHeaders } from '@angular/common/http';` 2. in your getListCommandes: `headers = new HttpHeaders({ 'Authorization': 'Bearer '+mytoken, 'Accept':'application/json' }); let options = {headers: headers}; return this.http.get(url,headers) .map((response: Response) => { var result = response.json(); return result; }); ` Sorry for being repetitive about the headers, just trying to make sure that is not the issue. – Nick Aug 29 '17 at 10:41
I have trying the solution you have been suggest butthe issue kept be the same please any other idea? – kadal sparkadal Aug 29 '17 at 12:05
in my anguladr fonction service if I do console.lo(Json.stringify(headers)) I have result with header set {"Authorization":["Bearer nvCv_YEfNDsyILz8WFReLoNcjt1Jhkfm6uWF2jxveFC5lSmLSyKm0AIUoraeBerGmu_CQQPN62UE6gkF4TIR0JC4gKC1_Dl6r204VnXBARjXIOhxHbnbDASXnAx-LXLJ0BFWS1PSik8pQ97519NBgmMg3DjMNgjvID2Lywl6f11L4bt_XY90zsSbRc41YCDJ5WQb4siJlgBtQrMIttjASBk8dZayWMksqdlnde9XNp3RLRmxajpHOiVbiP7ir2JIxqQWolLCgelZk2Qi1f32CadruZGSuCE_N-SWkPpRPf7v6PxewKHnmywP-43uWn__qLKlZAvwVS76kF3pxvrnT8o_X46qaGeJTnfJ2aBPis0y6qiloYtTlXwZGPwrBPB_td7Vt4_"],"Content-Type":["application/json"],"Accept":["application/json"]} – kadal sparkadal Aug 29 '17 at 12:40
I decided to use angular2-jwt to handle header.The authorization header appear in the Request header but issue still be the same. I'm mentione that I install and set angular-jwt properly – kadal sparkadal Aug 29 '17 at 14:27

Nelmio Cors , Api how to set for angular2 request's with token headers

BACKEND SETTING SECURITY.YML

1 Answers1