About apache or nginx configuration vue routing, agent and cross-domain issues

  On the use of micro-channel public number associated functions vue developed, deployed to the server, the server needs a few things to do:

      China and China  's development server use nginx to do load balancing and proxy, with the production server apache proxy to do, so I have a problem about configuring routing and agent of friends.

  vue configure route may refer to:

https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E5%90%8E%E7%AB%AF%E9%85%8D%E7%BD%AE%E4%BE%8B%E5%AD%90

A, nginx server configuration , nginx configuration is relatively simple, this is not to do too much description, the following picture shows Kam

Two, apache server configuration

Detailed configuration instructions regarding the apache httpd.conf, please view the configuration in detail (Baidu search on the line, do not do much to explain).

1, the configuration of the micro-channel image server proxy

2, page rendering successful jump pages each page are normal, but appeared in 404 of the current page will refresh problem occurs because only one index.html file, routing the url jump vue-router are carried out in practice no other html files and other documents, the server will find these pages can not be found 404 error occurs, it is necessary back-end server configuration 404 all jump to the index.html solve the problem.

    How to configure the back-end in the end, into the httpd.conf, (apahce profile)

  (1), open rewrite_module function, 

     LoadModule rewrite_module libexec / apache2 / mod_rewrite.so, remove the #;

AllowOverride All is set for the apache support .htaccess files. 

* 在该项目根目录添加.htaccess文件(index.html平级),内容跟https://router.vuejs.org/zh-cn/essentials/history-mode.html‘>HTML5 History 模式(vue-router文档举例)类似,

1

2

3

4

5

6

7

8

<IfModule mod_rewrite.c>

RewriteEngine On

RewriteBase /resource/teachingforwechat/

RewriteRule ^index\.html$ - [L]

RewriteCond %{REQUEST_FILENAME} !-f

RewriteCond %{REQUEST_FILENAME} !-d

RewriteRule . /resource/teachingforwechat/index.html [L]

</IfModule>

 

,需要修改的两个地方,RewriteBase 处改成你的vue项目的路径; 

RewriteRule . /resource/teachingforwechat/index.html [L],要添加项目所在文件的文件名,

 

相关参考地址:

Apache下的AllowOverride和.htaccess:https://blog.csdn.net/u013927110/article/details/41414091

vue项目部署到Apache服务器中遇到的问题 :https://www.jb51.net/article/146180.htm

发布了27 篇原创文章 · 获赞 8 · 访问量 1万+

Guess you like

Origin blog.csdn.net/gonghua0502/article/details/82187295