Enabling html5 mode using AngularJS and an external NodeJS server

So, I read almost every answer / question on this topic, but still I have a lot of questions in my head.

Firstly, the problem is:

I have an AngularJS application with html5 enabled, so I can get rid of the '#' sign.

$locationProvider.html5Mode({ enabled: true, requireBase: true });
$locationProvider.hashPrefix('!');

This is the important part in my index.html :

<!DOCTYPE html>
<html ng-app="application" ng-controller="ApplicationController as app">
  <head>
    <meta name="fragment" content="!">

    <title>LivingRoomArt</title>

    <meta charset="UTF-8">
    <base href="/index.html" />

I communicate with a NodeJS server that uses express:

router.route('/events')
  .post(authController.isAuthenticated, eventController.postEvent)
  .get(eventController.getEvents);

// Register all our routes with /api
app.use('/api', router);

// Start the server
app.listen(process.env.PORT || 5000);

So the usual problem:

After reboot, I get 404 from the server. I understand that this is here, the proposed solution is everywhere:

  // This route deals enables HTML5Mode by forwarding missing files to the index.html
  app.all('/*', function(req, res) {
    res.sendfile('index.html');
  });
});

The fact is that I do not have an index.html file on my server. I want to duplicate it on my server.

So, how do I tell Node to handle requests correctly without saving html files on my server?

I host a Node app on Heroku if that helps.

+4
1

, , , API node.js ?

, URL-, http://api.com http://client.com.

, API 404. http://api.com index.html? , API, :

app.all('/*', function (req, res) {
   res.redirect('http://client.com');
});

, , - .


:

, , node.Js-, -, sendfile, index.html

Nginx ( , ) , ​​, ( /) index.html

server {
  listen 80;

  root /app/www;
  index index.html;

  location / {
    try_files $uri $uri/ /index.html;
  }
}
+1

Source: https://habr.com/ru/post/1624063/


All Articles