当通过 angular httpClient 访问时,使用 python 的 Flask rest api 会产生空白屏幕

如何解决当通过 angular httpClient 访问时,使用 python 的 Flask rest api 会产生空白屏幕

我正在尝试构建一个基本的rest api,它在flask(python)中返回json,并尝试将其托管在heroku上,以便我可以从angular httpClient访问该api。 这是heroku api

https://testmyak.herokuapp.com/projects

问题是在尝试使用 angular 的 httpClient 访问 api 时,会显示一个空白页面

angular 代码没有任何错误,因为从 json-placeholder 网站访问任何其他虚假 api 并且它完美地填充了页面

./app.py

from flask import Flask,jsonify
app=Flask(__name__)

@app.route('/projects')
def projects():
    x=[]
    x.append({"name":"Debal","gender":"male"})
    x.append({"name":"Debdut","gender":"female"})
    return jsonify(x)

if __name__=='__main__':
    app.run()

./procfile

web: gunicorn app:app

./requirements.txt

click==7.1.2
Flask==1.1.2
gunicorn==20.0.4
itsdangerous==1.1.0
Jinja2==2.11.3
MarkupSafe==1.1.1
Werkzeug==1.0.1

这是有角度的侧面代码 ./src/app/customer.service.ts


import { Injectable } from '@angular/core';
import { HttpClient } from
'@angular/common/http';
import { ICustomer } from './customer';
import { Observable } from 'rxjs';

@Injectable()

export class CustomerService {
    _url:string='https://testmyak.herokuapp.com/projects';

    constructor(private ht:HttpClient) { }
    getCustomers():Observable<ICustomer[]>{
    return this.ht.get<ICustomer[]>(this._url);
  }
}

.src/app/customer.ts

export interface ICustomer{
    gender:string,name:string
}

.src/app/app.component.ts

import { Component } from '@angular/core';
import { CustomerService } from
'./customer.service';

@Component({
    selector: 'app-root',templateUrl: './app.component.html',styleUrls: ['./app.component.css']
})
export class AppComponent {
    title = 'my-app';
    myL:any[];
    constructor(private _s:CustomerService){}
    ngOnInit(){
     this._s.getCustomers().subscribe(data=>this.myL=data);

    }
}

./src/app/app.module.ts

import { NgModule } from '@angular/core';
import { browserModule } from '@angular/platform-browser';

import { AppComponent } from './app.component';
import { CustomerService } from
'./customer.service'
import { HttpClientModule } from
'@angular/common/http';

@NgModule({
    declarations: [
      AppComponent
    ],imports: [
      browserModule,HttpClientModule
    ],providers: [CustomerService],bootstrap: [AppComponent]
})
export class AppModule { }

请建议我应该在我的代码中进行的更改,以使 api 可以在 angular 中使用 httpClient 访问

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?
Java在半透明框架/面板/组件上重新绘画。
Java“ Class.forName()”和“ Class.forName()。newInstance()”之间有什么区别?
在此环境中不提供编译器。也许是在JRE而不是JDK上运行?
Java用相同的方法在一个类中实现两个接口。哪种接口方法被覆盖?
Java 什么是Runtime.getRuntime()。totalMemory()和freeMemory()?
java.library.path中的java.lang.UnsatisfiedLinkError否*****。dll
JavaFX“位置是必需的。” 即使在同一包装中
Java 导入两个具有相同名称的类。怎么处理?
Java 是否应该在HttpServletResponse.getOutputStream()/。getWriter()上调用.close()?
Java RegEx元字符(。)和普通点?