Question

我花了最后两天（确切地说）试图让我的NextJS应用程序上运行的服务工作者运行Express作为服务器。我正在托管所有代码的回购邮件是https://github.com/nicer00ster/nicer00ster-portfolio 我只是在寻找一个关于我哪里出错的提示。我使用Express的原因是发送邮件，所有使用next-offline或任何其他服务器配置的示例都使用http插件。

我已经在这个投资组合工作了大约2个月了，我真的想在我决定推出它之前得到我的灯塔得分。任何方向都会很有价值。谢谢！

Answer 1

最后弄明白这一点，最终放弃了Express，只是通过Node处理电子邮件响应的主体：

const { headers, method, url } = req;
let body = [];
req.on('error', (err) => {
  console.error(err);
}).on('data', (chunk) => {
  body.push(chunk);
}).on('end', () => {
  body = Buffer.concat(body).toString();
})

然后使用了我已经使用过的相同的nodemailer sendTransport函数。服务工作人员正在运行以及邮件外出！ = d

Answer 2

我没有足够的代表发表评论，但是......

您链接到的repl.it链接是Native Browser Javascript repls，它不运行节点，并且通过扩展，表达。您需要使用nodeJS repl，或者，如果您愿意，还可以使用我们的express template。

Answer 3

所以这周我也试图建立一个经过“灯塔验证”的项目。

接下来有一个非常好的directory of examples。我遵循的帮助我进行设置的特定示例是next.js/examples/with-sw-precache

这是与您类似的设置，仅将SWPrecacheWebpackPlugin与标准设置一起使用

似乎缺少的步骤（可能是问题所在）是您未注册服务工作者。在索引文件中，您可以在componentDidMount生命周期中注册服务工作者。

import React from 'react'

export default class extends React.PureComponent {
  componentDidMount() {
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker
        .register('/service-worker.js')
        .then(registration => {
          console.log('service worker registration successful')
        })
        .catch(err => {
          console.warn('service worker registration failed', err.message)
        })
    }
  }
  render() {
    return <p>Check the console for the Service Worker registration status.</p>
  }
}

使用NextJS＆amp; amp;混淆服务工作者表达

3 个答案: