django 后端和角度前端向后端发送请求

Posted

技术标签:

【中文标题】django 后端和角度前端向后端发送请求【英文标题】:django backend and angular frontend send request to backend 【发布时间】:2019-07-19 02:51:02 【问题描述】:

你好,我已经完成了 angular 7 basics now 的学习,已经将 django 从后面和 Angular 结合起来,因为我在这个项目的开始阶段

现在我正在为 django 使用 rest_framework,我希望 angular 向后端发送 GET 请求,因为我们知道 django 使用 127.0.0.1:8000 和 angular 127.0.0.1:4200,当我执行此功能时

export class HomeComponent implements OnInit 
  users: Object;
  recvedData: boolean = false;
  hasError: boolean = false;

  constructor(private http: HttpClient)  

  ngOnInit() 
    this.http.get('/api/qutes').subscribe(data => 
      this.users = data;
      console.log(data);
    , error => 
      this.recvedData = true;
      this.hasError = true;
      console.log(error);
   )
 

我正在尝试从后端服务器的/api/quets 获取数据 但是它从前端服务器 (127.0.0.1:4200/api/quets) 请求数据并且这个 URL 不存在我知道我可以添加一个带有变量 domain = "127.0.0.1:8000"servicethis.http.get(this.service.domain +"/api/quets") 我的问题:

有更好的方法吗?所以它会自动将所有请求发送到backend 服务器?

【问题讨论】:

更好的方法比如什么? 可以写this.http.get("api/quotes")而不是this.http.get("127.0.0.1:8000/api/quotes") 除非api 本身包含127.0.0.1:8000/api/,否则你不能AFAIN。 【参考方案1】:

如果你设置了代理,你可以把url写成/api,所有http://localhost:4200/api的调用都会被转移到http://localhost:3000/api

From angular docs:

您可以在 webpack 开发服务器中使用 proxying support 将某些 URL 转移到后端服务器,方法是将文件传递给 --proxy-config 构建选项。例如,要将所有对http://localhost:4200/api 的调用转移到在http://localhost:3000/api 上运行的服务器,请执行以下步骤。

文档中提到的步骤是:

在项目src/ 文件夹中创建一个文件proxy.conf.json,在package.json 旁边。

将以下内容添加到新的代理文件中:


  "/api": 
    "target": "http://localhost:3000",
    "secure": false
  

在 CLI 配置文件 angular.json 中,将 proxyConfig 选项添加到服务目标:

...
"architect": 
  "serve": 
    "builder": "@angular-devkit/build-angular:dev-server",
    "options": 
      "browserTarget": "your-application-name:build",
      "proxyConfig": "src/proxy.conf.json"
    ,
...

要使用此代理配置运行开发服务器,请致电 ng serve

您可以编辑代理配置文件以添加配置选项; docs 中给出了一些示例。有关所有选项的说明,请参阅webpack DevServer documentation。

请注意,如果您编辑代理配置文件,则必须重新启动 ng serve 进程以使您的更改生效。

【讨论】:

以上是关于django 后端和角度前端向后端发送请求的主要内容,如果未能解决你的问题,请参考以下文章

前端向后端发送请求,后端返回的一个值的请求的store方法

前端向后端发送请求的几种方式

在 Rails 中分离后端和前端服务器

用户注册的最佳解决方案是啥? [关闭]

前端向后端传一个json数组对象

pinus 前端服务器向后端服务器发送消息