Question

所以我试图用http调用我的Angular服务中的链接，但无法检索数据。不胜感激！

代码如下：

快速文件：

router.get("/tickets/ticketList", function(req,res){

user.ticketList(function(result){
    return result; //This is the data from the db

})
});

服务打字稿文件：

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

@Injectable({
  providedIn: 'root'
})

export class UserService {

  constructor(private http:HttpClient) { }

  x(){
    return this.http.get("localhost:2000/tickets/ticketList");


  }

  }

以及使用服务的组件文件：

import { Component, OnInit } from '@angular/core';
import{ UserService } from '../user.service';

@Component({
  selector: 'app-add-event',
  templateUrl: './add-event.component.html',
  styleUrls: ['./add-event.component.css']
})
export class AddEventComponent implements OnInit {
 private userlist:any;
  constructor(private test:UserService) { }

  ngOnInit():void{
    this.test.x().subscribe((userlist) =>{
      this.userlist = userlist;
    })
  }


}

这真让我感到困惑，真的很感谢您为解决此问题提供的帮助，谢谢！

Answer 1

您设置了CORS标头吗？

如果要在单独的域上运行客户端和服务器代码，则需要添加CORS（跨域资源共享）标头。这些标题使您可以从单独的域访问网页。

例如，如果您对服务器使用localhost：3000，对客户端使用localhost：4200。

如果这是问题所在，则将这种快速中间件粘贴到您的node.js代码中应该可以：

app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept"
  );
  res.setHeader(
    "Access-Control-Allow-Methods",
    "GET, POST, PATCH, DELETE, OPTIONS"
  );
  next();
});

使用Angular从express.js路由中检索数据

1 个答案: