如果从Postman访问端点正常,但从Angular访问时不正常,可能有以下几个原因:
Access-Control-Allow-Origin
和Access-Control-Allow-Methods
等CORS相关的字段。示例代码(Node.js Express服务器):
const express = require('express');
const app = express();
// 允许所有来源访问
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
res.header("Access-Control-Allow-Methods", "GET, POST, OPTIONS, PUT, DELETE");
next();
});
// 处理请求的路由
app.get('/api/data', (req, res) => {
// 返回数据
res.json({ message: '成功获取数据' });
});
// 启动服务器
app.listen(3000, () => {
console.log('服务器已启动');
});
示例代码(Angular服务):
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Injectable()
export class DataService {
private apiUrl = 'http://localhost:3000/api/data';
constructor(private http: HttpClient) {}
getData() {
return this.http.get(this.apiUrl);
}
}
示例代码(Angular组件):
import { Component, OnInit } from '@angular/core';
import { DataService } from './data.service';
@Component({
selector: 'app-data',
template: `
{{ data.message }}
{{ error }}
`,
providers: [DataService]
})
export class DataComponent implements OnInit {
data: any;
error: any;
constructor(private dataService: DataService) {}
ngOnInit() {
this.dataService.getData().subscribe(
(response) => {
this.data = response;
},
(error) => {
this.error = error;
}
);
}
}
这些方法可以帮助你解决从Angular访问端点时的问题。根据具体的情况,你可能需要对代码进行调整或检查网络请求。