使用节点和角度应用程序刷新页面时获取 404 页面

2024-01-22

我是新来的Angular。我尝试使用创建 CRUD 操作Nodejs and Angular。我在用Nodejs and Express对于支持和Angular对于前端。

当我使用 routerLink 在页面上导航时,它工作正常,但是当我在页面上导航然后刷新页面时,它会显示页面未找到错误。

我知道那里发生了什么,Express 应用程序中没有定义路线,所以我刷新页面,它显示 404 错误。

如何使其与 Angular 和 Express 路线一起使用?

这是我的代码。

app.js( 服务器 )

const express = require('express');
const path = require('path');
const http = require('http');
const bodyParser = require('body-parser');
var app = express();


app.use(bodyParser.urlencoded({extended : false}));
app.use(bodyParser.json());

app.use(express.static(path.join(__dirname,'dist/MEAN-blog')));


app.get('/',(req,res) =>{
    res.sendFile(path.join(__dirname,'dist/MEAN-blog/index.html'));
});

app.post('/register',(req,res) =>{
    var u = new User(req.body);
    u.save();
    res.send(u).status(200);
})


var server  = http.createServer(app);

server.listen(8080,'0.0.0.0',() =>{
    console.log('Server is running on 8080');
})

这是角度的路线

const routes: Routes = [
    {
        path : '',
        component : PostsComponent
    },
    {
        path : 'users',
        component : UsersComponent
    },
    {
        path : 'users/:id',
        component : UsersComponent
    },
    {
        path : 'post/:id',
        component : PostDetailsComponent
    },
    {
        path : 'login',
        component : LoginComponent
    },
    {
        path : 'signup',
        component : SignupComponent
    },

];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

我用的是角度5

我该如何解决这个问题?

Thanks


通常我所做的是首先包含我的所有 api 端点,然后在最后添加这个

app.get('*',(req,res) =>{
    res.sendFile(path.join(__dirname,'dist/MEAN-blog/index.html'));
});

这样任何不是的端点/api将返回index.html,角度路由将从那里接管。

另一种选择是使用 SSR,但有点痛苦。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用节点和角度应用程序刷新页面时获取 404 页面 的相关文章

随机推荐

  • 涉及错误“赋值之前引用的局部变量...”的简单循环[关闭]

    Closed 这个问题是无法重现或由拼写错误引起 help closed questions 目前不接受答案 Python 我对此进行了很多研究 但作为初学者 我不理解解决方案 更不用说将它们应用于我的简单问题 def min max xs
  • SQL Server 在同一个表上发生死锁

    我们的应用程序中存在死锁情况的问题 在过去的几天里 我阅读了很多有关阻塞 锁定和死锁的内容 试图了解问题并解决问题 现在 当我阅读有关死锁的错误日志信息时 我无法理解这种情况是如何存在的 看看这个 我已经重命名了表名 但重要的是日志消息中名
  • 检查android listview是否向下滚动到最后一项

    我有一个列表视图 其中有几个项目 我想检查列表是否向下滚动到最后一项 在这种情况下我想运行另一个方法 该怎么做 第一组isLoading false 在构造函数中或onCreate method mListView setOnScrollL
  • PyAudio:如何捕获内部音频(不是来自麦克风)?

    尝试过这样的 p pyaudio PyAudio stream p open format FORMAT channels CHANNELS rate RATE output True frames per buffer chunk all
  • SSIS Oracle 提供商 OLEDB 连接器中的 Oracle Wallet 集成

    我已经在 Windows 7 的机器中成功配置了 Oracle 钱包 我还通过执行以下命令进行了检查 sqlplus myoracleDB 并成功连接到数据库 我正在尝试在我的计算机中执行 SSIS 包 DTSX 版本 2012 在数据流任
  • 如何将 event.preventDefault 与 KnockoutJs 单击事件处理程序一起使用?

    我将下表行作为 KnockoutJs 中的脚本模板
  • jquery 验证:如果提交按钮失去焦点,如何防止模糊(焦点消失)验证

    我有一个文本框 如果在文本框中输入无效值后单击提交按钮 我不希望对模糊进行验证 如果我模糊到任何其他控件 那么我do希望进行验证 Windows 桌面 窗体允许将控件指定为 no causing validation 对于这种具体情况 是否
  • Winston:尝试在没有传输的情况下写入日志

    我正在尝试使用 Winston 为我的 Express 服务器设置访问日志和错误日志 但我似乎做错了什么 这是我对配置文件的尝试 const winston require winston fs require fs const tsFor
  • apt-get 在公司代理后面的 docker 中

    我正在尝试使用 Docker 在企业代理服务器后面设置一个开发环境 尽我所能 我无法让 docker 容器与代理服务器通信 代理服务器和 apt get 在主机 Ubuntu 12 04 上工作正常 Dockerfile 中完成的第一件事是
  • “分组依据”代理模型

    我有理论上无限深度的树模型和一些属性 组 除了标准视图之外 我还需要以这样的方式显示此模型 并保持同步 即每个组都成为具有相同属性值的所有项目的虚拟父级 使用 Qt 的模型 视图架构实现此目的的最佳方法是什么 不久前 我通过在模型中添加 删
  • PHP邮件功能不以html格式发送

    在 PHP 中 我尝试以 HTML 格式发送电子邮件 到目前为止我有这个 subject Password Reminder message Your password is b password b br br br br me mess
  • 单击 ng-grid/ui-grid celltemplate 会导致选择行。

    当我将 celltemplate 用于 ahref 链接时 一旦单击链接 行就会突出显示 因为我启用了 RowSelection 但我不希望在单击链接时突出 显示该行 仅当在除链接之外的任何位置单击该行时 另外 在下面的示例图片中 如何删除
  • windows 8 xaml 内联超链接

    如何在 XAML 中的 Windows 应用商店应用中创建格式正确的超链接 我尝试创建一个内联超链接 并希望使用静态资源对其进行样式设置
  • Checkstyle:尾随空格正则表达式问题

    我正在将 Checkstyle 添加到我的项目中 但检测空格的规则不够好 RegexpSingleline lt S s 它检测尾随空格并仅忽略带有空格的行 它应该允许缩进的空白行 它在大多数情况下工作正常 但它抱怨使用空行的 javado
  • 适用于多种设备的演示技术

    我们的应用程序应该为多种设备提供服务 从简单的智能手机 iPhone 触摸屏到普通浏览器 应用程序是分层的 因此我们可以重用业务层和持久层 然而 我们也想对单个表示层进行编程 例如 我知道 ASP NET 根据浏览器类型生成不同的 html
  • 在 Mac (OS High Sierra) 上安装 Flask-mysqldb (python 3) 时出错

    在按照在线教程创建 Flask Web 应用程序时 我尝试使用以下命令安装 Flask mysqldbsudo pip3 install flask mysqldb 这会导致安装错误 该错误似乎源于依赖性问题 错误信息如下Command u
  • 如何在Python中根据椭圆的一般方程绘制椭圆

    我知道matplotlib可以根据椭圆的中心 半长轴长度 半短轴长度以及x轴和长轴之间的角度来绘制椭圆 但是有没有简单的方法可以像Matlab一样根据椭圆的一般方程绘制椭圆 ezplot 3 x 2 2 x y 4 y 2 5 我找到了一种
  • 如何测试文件列表是否存在?

    我有一个列出文件名的文件 每个文件名都在自己的行上 我想测试每个文件名是否存在于特定目录中 例如 文件的一些示例行可能是 mshta dll foobar dll somethingelse dll 我感兴趣的目录是X Windows Sy
  • 在 Azure 角色中使用 SmtpClient 时出现“不支持请求的功能”异常

    在 Azure Web 或辅助角色中使用 SmtpClient 时出现异常 我创建了一个控制台应用程序 通过 RDP 在角色虚拟机上手动运行以进行重现 using System using System Net using System N
  • 使用节点和角度应用程序刷新页面时获取 404 页面

    我是新来的Angular 我尝试使用创建 CRUD 操作Nodejs and Angular 我在用Nodejs and Express对于支持和Angular对于前端 当我使用 routerLink 在页面上导航时 它工作正常 但是当我在