首页 > 解决方案 > 尝试将全栈应用程序部署到 Heroku,得到错误的响应数据

问题描述

我想在 heroku 上部署全栈应用程序,但是当我尝试登录我的应用程序时,我在网络上有不同的 res.data。我应该:

{ userName: "userName", userId: 1, token: token", isAuthorized: true, error: ""}

但我有:

<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><meta name="theme-color" content="#000000"><link rel="manifest" href="/manifest.json"><link rel="shortcut icon" href="/favicon.ico"><link rel="stylesheet" href="fontello/css/fontello.css"><title>React App</title><link href="/static/css/main.8a9a299b.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script type="text/javascript" src="/static/js/main.e17a5aa6.js"></script></body></html>

服务器包.json:

  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "tsc",
    "start": "node build/server.js",
    "client": "npm start --prefix client",
    "dev": "concurrently \"npm run client\" \"npm start\"",
    "heroku-postbuild": "npm run-script build && cd client && npm install && npm run build"
  },

我正在使用 typeOrm,这是我的连接选项:

const options: ConnectionOptions = {
  type: "sqlite",
  logging: true,
  database: "db/mydb.db",
  synchronize: true,
  entities: [
    "build/entity/**/*.js"
  ]
};

这是我来自客户端的登录请求:

export const loginRequest = userData => dispatch => {
  dispatch({ type: LOGIN_REQUEST });
  return axios
    .create({ baseURL: `${baseUrl}` })
    .post("/api/login", userData)
    .then(res => {
      console.log(res.data);
      localStorage.setItem("token", res.data.token);
      dispatch(loginSuccess(res.data));
      dispatch(redirect("/"));
    })
    .catch(error => {
      dispatch(loginError(error));
    });
};

基本网址: "https://react-app-map-creator.herokuapp.com"

项目结构:

在此处输入图像描述

POST 后我的状态为 200。我尝试了很多方法来解决这个问题。我的控制台中没有任何错误。有人可以给我一些提示来解决这个问题吗?

我又编辑了。我的路线文件有对象:

  {
    path: "/api/login",
    method: "post",
    action: login
  }

和我的登录控制器:

export async function login(request: Request, response: Response) {
  const userRepository = getManager().getRepository(User);
  const userDB = await userRepository.findOne({
    login: request.body.login
  });

  const Reject = () => {
    return response.status(401).json({
      errorMessage: "login or password is incorrect"
    });
  };
  if (userDB) {
    bcrypt.compare(request.body.password, userDB.password, (err, res) => {
      if (res) {
        const userData = {
          login: request.body.login,
          userId: userDB.id,
          isAdmin: userDB.isAdmin
        };
        jwt.sign(
          { userData },
          "secretkey",
          { expiresIn: "86400s" },
          (err, token) => {
            response.json({
              userName: userDB.login,
              userId: userDB.id,
              token: token,
              isAuthorized: true,
              error: ""
            });
          }
        );
      } else {
        Reject();
      }
    });
  } else {
    Reject();
  }
}

PS当我npm run dev在本地使用时,一切都很完美。

标签: herokudeploymentaxios

解决方案


推荐阅读