如何使用角度4的基本身份验证来休息服务

时间:2017-12-07 11:08:38

标签: angular rest http

嗨现在我正在开发角度4应用程序。在这方面,我们必须使用基本授权的休息服务。所以请使用基本身份验证帮助如何使用休息服务。

提前谢谢。

2 个答案:

答案 0 :(得分:1)

。这是我通常用于身份验证并将令牌存储在我的本地存储中的行为。 它消耗了一个WebAPI Asp.net REst endpint(但它无关紧要)..只有一件事......这是内容 - 类型:import tkinter as tk root = tk.Tk() image1 = tk.PhotoImage(file="img.gif") image2 = tk.PhotoImage(file="img.gif") label = tk.Label(root, image=image1) label._image_ref = image1 foo = root.call(label.cget('image'), 'cget', '-file') bar = image2['file'] print('1st image:\t%s\n2nd image:\t%s\nEqual:\t%r' % (foo, bar, foo == bar))

所以我application/x-www-form-urlencoded

f you want to use the normal application/json ..you simply DON'T HAVE TO OVERRIDE the headers of the login calls

let headersForm = new Headers();
    headersForm.append('Content-Type', 'application/x-www-form-urlencoded');

和Auth.ts类文件:

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs/Rx';
import { Auth, LoginData } from '../models/index';
import { environment } from '../../../environments/environment';
import { URLSearchParams, RequestOptions } from '@angular/http';


@Injectable()
export class AuthService {
  private loggedIn = false;

  constructor(private http: HttpClient) {
    this.loggedIn = !!localStorage.getItem('auth_token');
  }


  /**
   * METHOD TO DO LOGIN TO BACK END and STORE IN LOCALSTORAGE
   * @return {Auth} Auth data
   */
  public Login(data: LoginData): Observable<Auth> {

    let headersForm = new Headers();
    headersForm.append('Content-Type', 'application/x-www-form-urlencoded');

    let dataForm = new URLSearchParams();

    dataForm.append('grant_type', 'password');
    dataForm.append('userName', data.userName);
    dataForm.append('password', data.password);
    let body = dataForm.toString();
    //  let body = 'userName=' + data.userName + '&password=' + data.password + '&grant_type=password';

    //var encoded = "grant_type=password&userName=" + data.userName + "&password=" + data.password;
    return this.http.post<Auth>(environment.API_URL + 'Token', body)

      .map((res) => {
        if (res && res.access_token) {
          localStorage.setItem('AuthData', JSON.stringify({ access_token: res.access_token, username: res.userName }));
          this.loggedIn = true;

          if (localStorage.getItem("Settings") === null) {
            let settingObj = {
              unit: 'min',
              refreshTime: 1,
              help: false,
              autoRefresh: false
            }

            localStorage.setItem('Settings', JSON.stringify(settingObj));
          }

        }

        return res as Auth;
      });
  }

  /**
   * MEthod to Log Out
   */
  public logout(): Observable<void> {
    return this.http.post(environment.API_URL + 'Account/LogOut',{data:1}).map(() => {
      localStorage.removeItem('AuthData');
      localStorage.removeItem('CurrentUser');
      localStorage.removeItem('filterDashboard');
      this.loggedIn = false;

    });

  }

  /**
   *  Method to know if is logged or not
   */
  public isLoggedIn(): boolean {
    return this.loggedIn;
  }

  /**
   *  Method to set logged
   */
  public setLoggd() {
    this.loggedIn = true;
  }


}

希望它可以帮到你!

答案 1 :(得分:0)

目前我使用以下风格

let headers = new Headers();
headers.append('Authorization', 'Basic bWFoZXNoazptYWhlc2g=');
let opts = new RequestOptions();
opts.headers = headers;

this.http.get('http://localhost:8080/job/Library%20Manager/api/json?USER=a150fadfe99325644f45a2768c2d4d40&pretty=true',opts).subscribe(data => {

  console.log("sample for testing::::"+data);
});

我收到身份验证错误,但是当我尝试所有类型的其他客户端(如邮递员,onsomnia)时获得成功响应。

我也尝试过不同的休息服务。为我尝试的所有休息服务获得相同类型的问题。