解码登录用户令牌时，Ionic给出未定义的错误不是对象（评估'_co.user.username'）

Question

这是我收到的错误消息的一部分：

[Error] ERROR – TypeError: undefined is not an object (evaluating '_co.user.username') TypeError: undefined is not an object (evaluating '_co.user.username')(anonymous function)checkAndUpdateView — core.js:44...

在我的应用程序的ionic serve版本上，我的登录过程工作正常，并且用户的数据也很好，但是在ios上，我可以看到该错误消息，例如json编码无法正常工作或其他原因。为什么JSON在网站上可以正常运行，而在应用程序上却不能正常运行？这是TokenService的内容：

    constructor(private cookieService: CookieService) {}

    setToken(token) {
        this.cookieService.set("chat_token", token);
    }

    getToken() {
        return this.cookieService.get("chat_token");
    }

    deleteToken() {
        this.cookieService.delete("chat_token");
    }

    getPayload() {
        const token = this.getToken();
        let payload;
        if (token) {
            payload = token.split(".")[1];
            payload = JSON.parse(window.atob(payload));
        }

        return payload.data;
    }

这是loginUser中的LoginComponent函数，该函数在登录时触发：

loginUser() {
        this.showSpinner = true;

        this.authService.loginUser(this.loginForm.value).subscribe(
            data => {
                this.tokenService.setToken(data.token);
                localStorage.setItem("currentUser", JSON.stringify(data));

                this.loginForm.reset();

                setTimeout(() => {
                    this.router.navigate(["/streams"]);
                }, 200);
            },
            err => {
                this.showSpinner = false;

                if (err.error.message) {
                    this.errorMessage = err.error.message;
                }
            }
        );
    }

现在，服务器端，我在route /目录中有此路由，在文件authRoutes.js中表示的节点中：

router.post('/login', AuthCtrl.LoginUser);

然后我将其保存在routes /目录中的文件userRoutes.js中：

const express = require('express');

const router = express.Router();

const UserCtrl = require('../controllers/users');
const AuthHelper = require('../Helpers/AuthHelper');

router.get('/users', AuthHelper.VerifyToken, UserCtrl.GetAllUsers);
router.get('/user/:id', AuthHelper.VerifyToken, UserCtrl.GetUser);
router.get(
  '/username/:username',
  AuthHelper.VerifyToken,
  UserCtrl.GetUserByName
);
router.post('/user/view-profile', AuthHelper.VerifyToken, UserCtrl.ProfileView);
router.post(
  '/change-password',
  AuthHelper.VerifyToken,
  UserCtrl.ChangePassword
);

module.exports = router;

这是节点服务器端控制器auth.js的一部分：

    async LoginUser(req, res) {
        if (!req.body.username || !req.body.password) {
            return res.status(HttpStatus.INTERNAL_SERVER_ERROR).json({ message: "No empty fields allowed" });
        }

        await User.findOne({ username: Helpers.firstUpper(req.body.username) })
            .then(user => {
                if (!user) {
                    return res.status(HttpStatus.NOT_FOUND).json({ message: "Username not found" });
                }

                return bcrypt.compare(req.body.password, user.password).then(result => {
                    if (!result) {
                        return res
                            .status(HttpStatus.INTERNAL_SERVER_ERROR)
                            .json({ message: "Password is incorrect" });
                    }
                    const token = jwt.sign({ data: user }, dbConfig.secret, {
                        expiresIn: "5h"
                    });
                    res.cookie("auth", token);
                    return res.status(HttpStatus.OK).json({ message: "Login successful", user, token });
                });
            })
            .catch(err => {
                console.log("Error is:");
                console.log(err);
                return res.status(HttpStatus.INTERNAL_SERVER_ERROR).json({ message: "Error occured" });
            });
    }

Answer 1

我通过将所有存储的数据从CookieService（这是导致错误的主要原因）转移到localStorage来解决此问题的方法。与其将有效负载和该cookie存储在CookieService中，不如将其转移到localStorage，而且我没有任何其他问题。似乎越简单越好。