博客

一般获取数据都是异步的，使用Observable进行异步数据处理。错误的捕获等。

login.component.ts

import { HttpService } from 'src/app/services/http.service';

constructor(private http: HttpService) {}

// ajax数据测试 get
    doGet() {
        const obj = {
            _userName: '张三',
            pwd: 123456
        };
        this.http.doGet('ActionApi/UserInfo/CheckUserName2', {params: obj}).subscribe(data => {
            console.log(data);
        });
    }

    // ajax数据测试 post
    doPost() {
        const obj = {
            _userName: '张三',
            pwd: 123456
        };
        this.http.doPost('ActionApi/UserInfo/CheckUserName', obj).subscribe((data: any) => {
            console.log(data, 'post请求');
        });
    }

http.service.ts

import { HttpClient, HttpHeaders } from '@angular/common/http';
import {Observable} from 'rxjs';

@Injectable({
    providedIn: 'root'
})
export class HttpService {

    public api = 'http://192.168.1.114:8041/';
    // public api = 'http://localhost:4200/';

    httpOptions = {
        headers: new HttpHeaders({'Content-Type': 'application/json'})
    };

    constructor(public http: HttpClient) {}

    // get请求
    doGet(url: any, params?: any) {
        console.log(params);
        return new Observable(observer => {
            this.http.get(this.api + url, params).subscribe(response => {
                observer.next(response);
            }, err => {
                observer.error(err);
            });
        });
    }

    // post请求
    doPost(url: any, params?: any) {

        // params.timespan = new Date().getTime();

        // params.signature = this.encryption(params);

        return new Observable(observer => {
            this.http.post(this.api + url, params, this.httpOptions).subscribe(response => {
                observer.next(response);
            }, err => {
                observer.error(err);
            });
        });
    }

    // 加密处理
    encryption(data: any) {
        let str = '';
        for (const key in data) {
           if (true) {
                if (typeof data[key] === 'object') {
                    data[key] = JSON.stringify(data[key]);
                }
                str += key + data[key];
           }
        }
        return Md5.hashStr(str);
    }
}

登录数据处理

  submitForm(): void {

        // 拼接登录接口传递的数据
        const logoData = `UserName=${this.userInfo.username}&Password=${this.userInfo.password}&grant_type=password`;

        this.http.doPost('ActionApi/UserInfo/VirtualFactoryUserLogin', logoData).subscribe((data: any) => {
            // 如果返回正确，将里面的token存在本地，用来登录验证和权限处理
            if (data.access_token) {
                sessionStorage.setItem('access_token', data.access_token);
                this.router.navigate(['/home']);
                this.doPost();
            }
        }, err => {
            console.log(err.error, 'xxx');
        });

        // 路由守卫测试
        // sessionStorage.setItem('access_token', 'data.access_token');
        // this.router.navigate(['/home']);
    }