Vue deploy IIS URL Rewrite one-page application

First, tell us about the organizational structure of the project.
Project is divided into three parts:
1. Micro Home root directory, including index.html and static directories, independent Vue project (routing using history program is being forwarded pit micro-channel, only history, otherwise the contents of the back # directly it intercepted, greeting micro-letter team)
2. admin directory management background, independent Vue project
3. api ASP.NET Web API development, api directory

Write pictures described here

upload upload pictures is stored.

I believe we all know that in IIS solution 404 Vue single-page application appears to use URL Rewrite (if not on your IIS URL Rewrite, please search on the Internet under mounting method), all requests are transferred in /index.html . As shown below:
Write pictures described here

Write pictures described here

Write pictures described here

Write pictures described here

Several figures above are the main steps to solve the problem, there are many online, here I made reference to a number of posts online, pay tribute to them! But if only this would resolve the problem is I do not write their own blog is. Because my directory structure is rather special:
1. The IT department does not give the domain root directory, have to give a secondary directory, such as: http://domain.com/test
2. As shown in the first chart, we Micro Home projects and back-office systems have been placed in the test directory api

1 leads to the problem and solution

At this time, if the configuration according to another url rewrite fourth graph, the steering /index.html the requests are not ideal because index.html not in the root directory, so to change /test/index.html, this test only a placeholder, if you're like me is in the secondary directory, please change your directory name.

2 leads to the problem and solution

Because the url rewrite of regular writing is very simple, that is. *, This will lead to so request files are not oriented index.html, which is obviously problematic. why? Because not all api file exists in the form! It's really very pit! Then how to solve it? Of course, is to modify the regular match, do not kill a stick, contains the api to filter out words, do not go url rewrite strategy. To tell the truth I am not very familiar with the positive, I know it I do not know it! The Internet to find for a while, is the final match of the regular

^(?!.*api).*$

Kick call it a day, posted a final configuration diagram
Write pictures described here

There is also a method to solve two problems, not to index.html and static micro-site directly on the test directory, but create a root directory and admin api same level, put them here, so you do not have a regular complicated. Url rewrite but still can not solve.

If you think my solution to your problems, helped me a praise Oh, hee hee! !

Published 53 original articles · won praise 39 · views 80000 +

Guess you like

Origin blog.csdn.net/Chinese521/article/details/78120797