vuejs 기록 모드 라우팅

vuejs 기록 모드 라우팅

기록 모드를 사용하여 더 긴 URL 경로로 라우트하려면 어떻게 해야 하는가?

예:/catalog/[product-name]/p/[product-id]

이 사이트는 기록 모드가 켜져 있는 상태에서 공백 상태가 된다.CSS 및 JS에 다음 유형의 오류가 있는 경우

'{URL}/카탈로그/[product-name]/p/dist/build.js'에서 스크립트 실행을 거부함. 해당 MIME 유형('text/html')이 실행 불가능하고 엄격한 MIME 유형 검사가 사용 가능하기 때문이다.

라우터 코드:

const router = new VueRouter({
  mode: 'history',
  routes: [
    { path: '/catalog/my-product-name/p/MASN123U', name: 'product', component: product }
  ]
})

사이드 노트:URL이 읽기만 해도 기록 모드 없이 잘 작동한다.

/#/catalog/[product-name]/p/[product-id]

Web.config는 문서에 따른다.

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="SPA Routes" stopProcessing="true">
                    <!-- match everything by default -->
                    <match url=".*" />
                    <conditions logicalGrouping="MatchAll">
                        <!-- unless its a file -->
                        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                        <!-- or a directory -->
                        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                        <!-- or is under the /api directory -->
                        <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
                        <!-- list other routes or route prefixes here if you need to handle them server side -->
                    </conditions>
                    <!-- rewrite it to /index.html -->
                    <action type="Rewrite" url="/index.html" />
                </rule>`enter code here`
            </rules>
        </rewrite>
    </system.webServer>
</configuration>

오류로부터:

'{URL}/카탈로그/[product-name]/p/dist/build.js'에서 스크립트 실행을 거부함. 해당 MIME 유형('text/html')이 실행 불가능하고 엄격한 MIME 유형 검사가 사용 가능하기 때문이다.

HTML 파일 어딘가를 살펴보십시오. 다음과 같은 스크립트 태그가 있을 수 있음:

<script src="dist/build.js"></script>

그 경로가 다음과 같이 절대적이어야 할 때:

<script src="/dist/build.js"></script>

주목하라/전에 추가했다.dist.

참조URL: https://stackoverflow.com/questions/49984384/vuejs-history-mode-routing