如何在 VueJS 项目中记录错误，部署在 nginx docker 映像上？答案

【问题标题】：How to log errors in VueJS project, deployed on nginx docker image?如何在 VueJS 项目中记录错误，部署在 nginx docker 映像上？
【发布时间】：2019-02-27 15:43:31
【问题描述】：

我有一个VueJS 项目，它使用nginx docker 映像进行部署。

我的.Dockerfile 看起来像：

# build stage
FROM node:lts-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm i npm@latest -g && npm install
COPY . .
RUN npm run build

# production stage
FROM nginx:stable-alpine as production-stage
COPY nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=build-stage /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

而我的nginx.conf 看起来像：

server {
  listen 80 default_server;
  listen [::]:80 default_server;

  root /usr/share/nginx/html;

  index index.html;

  location / {
    # Support the HTML5 History mode of the vue-router.
    # https://router.vuejs.org/en/essentials/history-mode.html
    try_files $uri $uri/ /index.html;
  }
}

现在我正在寻找一种方法来设置某种记录器，以便将应用程序中可能发生的任何潜在错误写入服务器上的某个.log 文件中。由于该应用程序已经投入生产，我希望何时打开此文件（我将能够在其中记录错误）以查看应用程序中存在的任何潜在警告/错误，这可能会损害正常流程用户。

由于VueJS 是客户端JavaScript 框架，我不确定如何将所有这些放在一起以及我需要在哪一侧添加记录器，因此我分享了来自码头工人调整流程。目前我正在做的只是添加console.log 消息，但是当我想要查看潜在错误时，这对我没有帮助。

【问题讨论】：

您必须将任何客户端错误发布到后端服务（Web 服务等）并保存错误。

标签： docker nginx vue.js logging vuejs2

【解决方案1】：

我使用了像 Loggly 这样的第 3 方日志记录服务来执行此操作。创建账号，然后就可以使用https://www.npmjs.com/package/loggly建立连接了：

  var loggly = require('loggly');

  var client = loggly.createClient({
    token: "your-really-long-input-token",
    subdomain: "your-subdomain",
    auth: {
      username: "your-username",
      password: "your-password"
    }
  });

然后您只需像这样记录：

  client.log('127.0.0.1 - oops i did it again');

然后您登录到他们的服务以查看日志和一堆用于分析的工具。

还有 Logzio 等其他日志服务。

【讨论】：