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

Answer 1

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>