httpClient获取请求,获取404找不到响应

时间:2019-07-18 14:07:24

标签: angular angular-ui-router xmlhttprequest httpclient

在将一些使用http的api调用更改为httpClient之后,我已将项目版本从5.1版本移植到了angular版本,但是一旦我们启动该项目,第一个对服务层的调用就找不到404了,呼叫没有到达服务层,下面是我的代码

const routes: Routes = [
	{
		path: '',
		component: MasterComponent,
		resolve: { "appUser": CheckAccessService },
		children: [
			{
				matcher: ReadFinder,
				loadChildren: () => import('app/Read-Finder/read-finder.module').then(m => m.ReadFinderModule),
				canLoad: [CheckAccessService],
				canActivateChild: [CheckAccessService]
			},
			----------------
      --------------
     ]
   },
   {
		path: '',
		component: MasterPageComponent,
		resolve: { "appUser": CheckAccessService },
		children: [
			{ path: 'NoAuthorityPage', component: NoAuthorityPageComponent },
			{ path: '**', component: PageNotFound },
		]
	},	
];

在CheckAccessService中,用于解析的代码如下所示,

@Injectable()
export class CheckAccessService  implements Resolve<UserInfo>, CanLoad, CanActivate, CanActivateChild {
   resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<UserInfo> {
		
		let url = window.location.pathname;
		let _url = url.startsWith('/') ? url.substring(1) : url;
		return new Observable<UserInfo>((subscriber: Subscriber<UserInfo>) => {
			if (this.userInfo) {
				subscriber.next(this.getCachedUserInfo());
				subscriber.complete();
				return;
			}
			this.navApiService.getUserInfo()
				.subscribe(
				user => {
					this.storeUserInfo(user);
					setTimeout(() => {
						subscriber.next(user);
						subscriber.complete();
					});
				},
				err => {
					this.storeUserInfo(null);
					//clear session storage for unlogged users
					window.sessionStorage.clear();
					setTimeout(() => {
						this.redirectOnFail(url, err.status === 403);
					}, 3000);
				}
				)
		});
	}



}

在resolve方法中,我们有一个api调用,它是从应用程序到服务器的第一个调用,它看起来像这样,

import { HttpClient } from '@angular/common/http';

@Injectable()
export class ApiService {

	constructor(public http: HttpClient) { }
	getUserInfo(): Observable<UserInfoData> {
		return this.http.get('/api/security/user-info')
			.map(resp => <UserInfoData>resp)
			.catch(err => {
				return observableThrowError(err);
			});
	}
}

和Chrome中的错误看起来像这样,

enter image description here

1 个答案:

答案 0 :(得分:-1)

朋友!

首先,我担心自己的英语,在将Angular版本更新为8时,我也遇到了同样的问题。 我使用的是http,但是在版本8中已经过时了,必须将所有服务迁移到HttpClienr。 尝试将您的angular版本更新为版本7。 问候!