尽管对该问题进行了实质性的失败研究,但我认为它可能并没有那么难解决,只是我对Angular和Apache没有足够的经验。
所以这是信息。我有一个Angular 2应用,我想在服务器端进行渲染,以改善其SEO并改善在社交媒体上共享的网站链接的外观。
托管网站的服务器是Linux Ubuntu Linux ubuntu 18.04。
Web服务器应用程序是Apache2。
我已经按照官方Angular documentation上的服务器端渲染说明进行操作。
此外,我启动了server.js文件,因此它在端口4000上为应用程序提供服务。我必须指出,在本地运行它没有问题。问题是当我尝试在服务器上运行它时...
出于安全考虑,本文不会使用真实域。
打开页面:www.mydomainexample.com/ssr时出现此错误:
这是我的文件夹结构:
- / var / www / html /
- ssr /
- .htaccess
- server.js
- dist /
- 浏览器/
- 3rdpartylicenses.txt
- es2015-polyfills.js
- favicon.ico
- fontawesome-webfont.svg
- fontawesome-webfont.ttf
- fontawesome-webfont.woff
- fontawesome-webfont.woff2
- index.html
- main.js
- polyfills.js
- runtime.js
- scripts.js
- styles.css
- 资产
- 服务器/
- main.js
- main.js.map
- 浏览器/
- ssr /
这是apache2.conf
...
<Directory />
Options FollowSymLinks
AllowOverride None
Require all denied
</Directory>
<Directory /usr/share>
AllowOverride None
Require all granted
</Directory>
<Directory /var/www/>
Options Indexes FollowSymLinks
AllowOverride All
Require all granted
</Directory>
...
这是.htaccess文件:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /ssr/
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^ - [L]
RewriteRule ^ /dist/browser/index.html
</IfModule>
<VirtualHost *:80>
ServerName mydomainexample.com
ServerAlias www.mydomainexample.com
<Proxy *>
Order allow,deny
Allow from all
</Proxy>
ProxyPreserveHost On
ProxyRequests Off
ProxyPass / http://localhost:4000/
ProxyPassReverse / http://localhost:4000/
</VirtualHost>
<VirtualHost *:443>
ServerName mydomainexample.com
ServerAlias www.mydomainexample.com
<Proxy *>
Order allow,deny
Allow from all
</Proxy>
ProxyPreserveHost On
ProxyRequests Off
ProxyPass / https://localhost:4000/
ProxyPassReverse / https://localhost:4000/
</VirtualHost>
此外,我认为显示索引html文件的一部分很重要,并且我认为基本标记也很重要。这是index.html文件中的基本标记:
...
<base href="/">
...