Question

我有3年的Web开发经验，但总是在.NET框架下使用MVC。最近我开始开发MEAN堆栈项目，但已经到了需要更多培训或帮助的地步。目前，我能够成功获取和发布请求，但是当我需要通过ID获取项目时，我无法提出获取请求。以下是我正在使用的代码。

nodeJS代码

我认为，这在后端是正确的。我认为我在Angular方面遇到了问题，但是会分享这些代码。

路由器：

router.get('/userProfile/:id', auth, ctrlProfile.userProfileRead);

控制器：

module.exports.userProfileRead = function(req, res, next) {
  const id = req.params.id
  User.findById(id)
  .select(fields)
  .exec()
  .then((result) => {
    const response = {
      count: result.length,
      data: result.map((result) => {
        return {
          id: result._id,
          firstname: result.firstname,
          lastname: result.lastname,
          email: result.email,
          username: result.username
        }
      })
    };
    if (result.length > 0) {
      res.status(200).json(response)
    } else {
      res.status(404).json({
        message: `Successfully fetched ${route_name}s. However, no ${route_name}s have been created.`
      })
    }
  })
  .catch((err) => {
    console.log(err);
    res.status(500).json({
      error: err
    });
  });
};

Angular 5代码

这就是我认为是我的问题孩子。

服务

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { map } from 'rxjs/operators/map';
import { Router } from '@angular/router';
import { AuthenticationService, UserDetails } from './authentication.service';
import { UserProfile } from './models/UserProfile';

@Injectable()
export class DataService {

  userDetails: UserDetails;

  constructor(private http: HttpClient, public auth: AuthenticationService) { 
this.userDetails = auth.getUserDetails();
 }

  getUserProfile(id: string): Observable<UserProfile> {
return this.http.get<UserProfile>(`/api/userProfile/${id}`, { headers: { Authorization: `Bearer ${this.auth.getToken()}` }});
  }
}

代理配置

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

    }

如果代码格式不佳，我道歉。我不知道有关堆栈溢出的问题，但这个让我感到难过，而且我无法在网上找到任何关于为什么这对我不起作用的信息。

感谢任何帮助。

由于

修改

我遇到的问题是，当我能够点击端点时，请求超时，我收到了一个“未知网址”的控制台错误。

修改

这是工作代码。我的请求唯一的区别是我没有发送参数。

的NodeJS

路由器：

router.post('/login', ctrlAuth.login);

控制器：

module.exports.login = function(req, res) {

if (req.body.ActiveDirectory)
  {
passport.authenticate('ldapauth', { session: false }), (req, res, next) => {
    console.log(req.body)
    res.status(200).json({ "message": "worked" })
}
  }

  else
  {
passport.authenticate('local', function(err, user, info){
  var token;


  // If Passport throws/catches an error
  if (err) {
    res.status(404).json(err);
    return;
  }

  // If a user is found
  if(user){
    token = user.generateJwt();
    res.status(200);
    res.json({
      "token" : token
    });
  } else {
    // If user is not found
    res.status(401).json(info);
  }
})(req, res);
  }

};

Angular5

服务

  private request(method: 'post'|'get', type: 'login'|'register'|'profile'|'userProfile', user?: TokenPayload): Observable<any> {
let base;

if (method === 'post') 
{
  base = this.http.post(`/api/${type}`, user);
} 
else 
{
  base = this.http.get(`/api/${type}`, { headers: { Authorization: `Bearer ${this.getToken()}` }});
}

const request = base.pipe(
  map((data: TokenResponse) => {
    if (data.token) {
      this.saveToken(data.token);
    }
    return data;
  })
);

return request;
  }

Answer 1

您尚未提供有效的网址。在您的情况下，您应该将http://localhost:3000添加到您当前使用的网址中：

http://localhost:3000/api/userProfile/${id}

Answer 2

如果您使用的是Express v4，我认为router.get（）不接受2个以上的参数。如果您正在使用中间件进行身份验证，那么app.use（）就是合适的地方。

Router

App.use

此外，您的路由器会注册/userProfile/:id而不是/api/userProfile/:id，这是您的角度代码所调用的内容。你是否在其他地方加/api作为前缀？

Answer 3

发现问题，一旦我们返回http请求变量，就需要“订阅”请求以接收数据。

this.data.profile(this.userDetails._id).subscribe(user => {
        this.userProfile = user;
      }, (err) => {
        console.error(err);
      });;

此外，参数需要在http基本请求中以不同的方式传递。

this.http.get(`/api/${type}`, { headers: { Authorization: `Bearer ${this.getToken()}` }, params: { params }});

使用Angular 5和NodeJS

3 个答案: