Неавторизованный ответ Angular 2 (401)

Я пишу приложение, которое требует аутентификации пользователя для доступа к определенным функциям. Когда аутентифицированный пользователь входит в систему, сервер генерирует JSON Web Token (JWT). я сохранил сгенерированный токен в локальном хранилище. Чтобы публиковать, удалять и обновлять определенные данные из базы данных, в заголовке требуются учетные данные. Я использовал документацию angular io для настройки заголовка запроса. Однако я получил несанкционированный ответ (401), когда я делаю почтовый запрос. Вот почтовый запрос и заголовок

createItem(name: string, text: string) {

  const body = JSON.stringify({noteData: {name: name, text: text}});
  const headers = new Headers();
  const token = localStorage.getItem('token');
  headers.append('Content-Type', 'application/text' );
  headers.append('Authorization', 'Bearer ' + token);
  const options    = new RequestOptions({ headers: headers });
    return this._http.post(this.createNote, body, options)
                     .map(this.extractData);

}

     private extractData(res: Response) {
         return res.text() ? res.json() : {};
   }

// вот ответ на ошибку заголовка запроса

    Request URL:http://localhost:4500/api/notes
    Request Method:POST
    Status Code:401 Unauthorized
    Remote Address:[::1]:4500
    Referrer Policy:no-referrer-when-downgrade


    Access-Control-Allow-Origin:*
    Connection:keep-alive
    Content-Length:0
    Date:Wed, 26 Jul 2017 03:08:45 GMT
    Vary:Origin
    X-Powered-By:Express


   Accept:application/json, text/plain, */*
   Accept-Encoding:gzip, deflate, br
   Accept-Language:en-US,en;q=0.8
   Authorization:Bearer "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6IjM3ZTY3MDQ3LTY0MjQtNDZkMi04NjI0LTdhZmVlYjMyZTdlZiJ9.NEKOQpQIsjYpUHKh061Jl_9-Zz_Ude5MkcsGrOLetKU"
   Cache-Control:no-cache
   Connection:keep-alive
   Content-Length:43
  Content-Type:application/text
  Host:localhost:4500
   Origin:http://localhost:4200
  Pragma:no-cache
  Referer:http://localhost:4200/note
 User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 
 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36

// функция для входа и установки локального хранилища

   login(username: string, password: string) {
    const body = JSON.stringify({username: username, password: password});
    const headers = new Headers();
    headers.append( 'Content-Type', 'application/json' );
    const options    = new RequestOptions({ headers: headers });
    return this._http.post(this.loginUser, body, options)
                     .map((res: Response) => {
                        const token = res.json() && res.json().token;
                        if (token) {

          localStorage.setItem('token',JSON.stringify(res.json().token));
                        }

                    })
                     .catch((error: any) => 
           Observable.throw(error.json().error || 'Server error'));
}

person mulugeta zeleke    schedule 26.07.2017    source источник
comment
Не могли бы вы попробовать это, позвонив от почтальона, дайте мне знать, ваш звонок успешен или нет.   -  person k11k2    schedule 26.07.2017
comment
И, как вы сказали, вы пытались дать место на Bearer headers.append('Authorization', 'Bearer ' + token);, не могли бы вы обновить вопрос еще раз, чтобы никто не ошибся в вашем вопросе.   -  person k11k2    schedule 26.07.2017
comment
@ k11k2 несанкционированный ответ и на запрос почтальона   -  person mulugeta zeleke    schedule 26.07.2017
comment
@mulugetZeleke Тогда все дело в вашем токене, ваш токен недействителен. прямо сейчас речь идет не о ваших заголовках. подтвердите действительный токен, пока ответ почтальона не будет 202. и проверьте свой код с действительным токеном.   -  person k11k2    schedule 27.07.2017


Ответы (1)


Добавьте пробел после Bearer:

createItem(name: string, text: string) {

  const body = JSON.stringify({noteData: {name: name, text: text}});
  const headers = new Headers();
  const token = localStorage.getItem('token');
  headers.append('Content-Type', 'application/text' );
  headers.append('Authorization', 'Bearer ' + token); //<-- added space after 'Bearer'
  const options    = new RequestOptions({ headers: headers });
    return this._http.post(this.createNote, body, options)
                     .map(this.extractData);
}
person RichGoldMD    schedule 26.07.2017
comment
Должна быть какая-то проблема с токеном. Можете ли вы проверить, что токен, который вы отправляете в заголовке запроса, действителен (т. е. токен, который вы извлекаете из локального хранилища, является тем же токеном, который вы получили от службы создания токенов? Кроме того, является ли тип содержимого правильным для API? Возможно это должно быть application/json, но это в любом случае не может привести к ошибке 401. - person RichGoldMD; 26.07.2017
comment
Я сохранил в локальном хранилище то, что генерируется сервисом по производству токенов. - person mulugeta zeleke; 26.07.2017
comment
Я предлагаю вам проверить фактические отправленные заголовки, возможно, в консоли разработчика, чтобы убедиться, что сохраненное и полученное значение соответствует вашим ожиданиям. - person RichGoldMD; 26.07.2017
comment
Каков был результат? - person RichGoldMD; 31.07.2017
comment
headers.append('Авторизация', 'Носитель' + токен) настраивается владельцем серверной части. он/она настраивает авторизацию следующим образом: headers.append('authentication-token', token) - person mulugeta zeleke; 31.07.2017