我是一个新手nextjs
,正在研究一个小型应用程序,在该应用程序中我想提供脱机支持,但是我无法注册服务人员。
抛出Failed to register a ServiceWorker: A bad HTTP response code (404) was received when fetching the script
此错误。
以下是我的代码...并且service-worker.js是nextjs
应用程序的根目录。
componentDidMount = () => {
if ("serviceWorker" in navigator) {
navigator.serviceWorker.register('../service-worker.js')
.catch(err => console.log('err', err))
}
}
我需要以某种方式配置服务器(即(server.js))来提供该文件吗?
const express = require('express');
const next = require('next');
var routes = require('./router');
const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();
app.prepare()
.then(() => {
const server = express();
server.use('/edit', routes);
server.get('*', (req, res) => handle(req, res));
server.listen(3000, (err) => {
if (err) throw err;
console.log('http://localhost:3000');
});
})
.catch((ex) => {
console.log(ex.stack);
process.exit(1);
})
如果是,那我该怎么办..?
目录结构显示在以下图像链接中。 目录结构
您需要将
service-worker
文件作为静态文件来实现。请参阅此处的参考,
app.serveStatic(req, res, filePath)
第19行。您可以在此处查看完整的示例。