我創建了一個nodejs應用程式和一個Angular應用程式,我需要從資料庫中獲取資料并將資料存盤到資料庫中。我在連接我的Express服務器和Angular應用程式時遇到了問題。
user.service.ts
import { Injectable } from '@angular/core'/span>。
import { Observable } from 'rxjs'/span>;
import { User } from './User'。
import { HttpClient, HttpHeaders } from '@angular/common/http'/span>。
import { BASE_URL } from './const/config'。
import { MONGO_EXPRESS_URL } from './const/config';
@Injectable({
providedIn: 'root',
})
export class UserService {
constructor(private http: HttpClient) {}。
getUsers()。Observable<User[]> {
return this.http。 get<User[]>(`${MONGO_EXPRESS_URL}/fetchdata`) 。
}
users.component.ts
import { Component, OnInit } from '@angular/core'。
import { UserService } from 'src/app/services/user.service'/span>。
import { User } from '././User';
@Component({
selector: 'app-users',
templateUrl: './users.component.html',
styleUrls: ['./users.component.css'] 。
})
export class UsersComponent 實作 OnInit {
users: User[] = [] 。
constructor(private userService: UserService) {}。
ngOnInit()。void {
this.userService.getUsers() 。 subscribe((users) => (this.users = users))。
}
server.js
app.use("/"/span>, router)。
app.listen(port, function (/span>) {
console.log("Server is running on Port: "/span> port);
});
router.route("/fetchdata").get(function(req, res){
users.find({}, function(err, result) {
if (err) {
res.send(err)。
} else {
res.send(結果)。
}
});
});
uj5u.com熱心網友回復:
你能分享一下你在Express服務器上設定路由/fetchdata的地方嗎?
在你的nodeJS上應該是這樣的,你應該這樣設定express
。constructor(){
this.app = express()
}
Initialize{
this.app.use((req, res, next) => /span>{
res.header('Access-Control-Allow-Origin', '*') 。
res.header('Access-Control-Allow-Headers'/span>, 'Origin, X-Requested-With, Content-Type, Accept'/span>)。
res.header('Access-Control-Allow-Methods', 'OPTIONS, GET, POST, PUT')。
if('OPTIONS' ==req.method){
res.sendStatus(200)。
}
else {
next();
}
})
this.app.use(RouterWebservices)
this.app.listen(our. HttpPort, your.Ip, () =>/span> {
console.log('Server now listening at ', your. HttpPort, 'IP ', your.Ip)。)
})
}
然后你需要在router.webservice.ts中宣告你的變數
。export const RouterWebservices = express.Router()
RouterWebservices.get('/fetchdata'/span>, FetchWebservice)
并撰寫一個FetchWebserivce,在這里你只需用資料來回答請求
。uj5u.com熱心網友回復:
問題是路線:https://localhost:4000。 它應該是http://localhost:4000 (http://,而不是https:// )
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/307476.html
標籤:
