前端之家

  1. 首页
  2. 问答

Angular Js 7用自己的基本网址覆盖了Azure Web Api网址

• 问答

我在Azure Web应用程序中托管了两个单独的Web应用程序。

一个基于angular js 8前端，另一个基于.net核心Web API 2.2。

我已经创建了一个基本方法来从Web API调用返回value1和value 2的值，类似的还有一些其他API方法可以返回json。

如果我在浏览器https://B.azurewebsites.net/api/values中调用，则成功返回了value1和value 2。

现在我的前端有角度的Web应用程序正试图在运行http://localhost:4200的本地计算机中调用Web api，并调用如下所示的Azure托管Web api 

export class ApiDataService 
{
private REST_API_SERVER = "";  //mentioned in constant file under services


  constructor(private httpClient: HttpClient) {
     this.REST_API_SERVER = "https://B.azurewebsites.net/api";
  }


public getList() {
    return this.httpClient.get(this.REST_API_SERVER + 
     "/employee/getlist").pipe(catchError(this.handleError));
  }

在本地计算机上，它运行良好。

在Azure中部署有角度的Web应用程序时，它会显示错误404和消息：

＃

http：https://A.azurewebsites.net/B.azurewebsites.net/api/employee/getlist的失败响应

＃

在这里A.azurewebsites.net-> Angular Web应用程序

B.azurewebsites.net-> .Net Core Web API 2.2

我无法找到azure网站两次调用的任何原因 它应该简单地称为https://B.azurewebsites.net/api/employee/getlist

我还从

之类的有角项目中的index.html中删除了“ /” 
<base href=""/> --removed the "/"

如何在employee.component.ts中重置基本URL

任何建议或评论将非常有帮助。

lzq0809 回答：Angular Js 7用自己的基本网址覆盖了Azure Web Api网址

我必须创建一个从HTTPClient派生的类，并在其中设置基本URL，如下所示：


@Injectable()
export class ApiHttpClient extends HttpClient {
  public baseUrl: string;

  public constructor(handler: HttpHandler,private constName: ConstNameService ) {
    super(handler);

    // Get base url from wherever you like,or provision ApiHttpClient in your AppComponent or some other high level
    // component and set the baseUrl there.
    this.baseUrl = constName.apilocalUrl.prod_api_url;//'/api/';
  }

  public getMethod(url: string,options?: Object): Observable<any> {
    url = this.baseUrl + url;
    return super.get(url,options);
  }
}

现在在服务模块中使用此类来获取数据列表

constructor(private constName: ConstNameService,private apiclient :ApiHttpClient ) {}


  public getEmpList() {
   this.apiclient.getMethod("/employee/getlist").pipe(catchError(this.handleError));
  }
angularangular-ui-routerangularjs-directiveazure-web-sites
本文链接：https://www.f2er.com/3169997.html

大家都在问