vuejs / vitepress

Vite & Vue powered static site generator.
https://vitepress.dev
MIT License
11.47k stars 1.86k forks source link

route 没有导航到正确的路由,网页卡死 #2549

Closed Liboq closed 10 months ago

Liboq commented 10 months ago

Describe the bug

导航到https://onekjs.github.io/onek-ui/components/icon//中,加载不到资源,网页卡死 image

Reproduction

我在源码中发现如下代码 src/client/app/utils.ts pathToFile

 pagePath =
        sanitizeFileName(
          pagePath.slice(base.length).replace(/\//g, '_') || 'index'
        ) + '.md'
      // client production build needs to account for page hash, which is
      // injected directly in the page's html
      let pageHash = __VP_HASH_MAP__[pagePath.toLowerCase()]

这里 pagePath 解析为"components_iconindex.md" VP_HASH_MAP_image 所以 pageHash 为 undefined,所以 sanitizeFileName( pagePath.slice(base.length).replace(/\//g, '') || 'index' ) + '.md'这里可以优化下

Expected behavior

页面不被卡死,路由重定向

System Info

windows 64位 chorme 版本 114.0.5735.134(正式版本) (64 位)

Additional context

我是用vitepress最新版本调试的

Validations

zonemeen commented 10 months ago

你给的地址仓库启动会报错,能提供一个简单的复现仓库或者在线stackblitz地址吗

Liboq commented 10 months ago

您给的地址仓库启动会报错,能否提供一个简单的恢复仓库或者在线stackblitz地址吗

这个只有线上才会出问题,开发环境是没有问题的,如果需要一个简单的仓库,那可能要等一会

brc-dd commented 10 months ago

Your URL has two trailing slashes. I'm not sure how others handle that, but that will break things in VitePress.

Liboq commented 10 months ago

您的网址有两个尾部斜杠。我不确定其他人如何处理这个问题,但这会破坏 VitePress 中的事情。

是的,vitepress中有这样一个操作 replace(/\//g, '_'),把斜杠转换为_ ,来匹配 VP_HASH_MAP中的内容,从而import 资源文件

brc-dd commented 10 months ago

Yeah, so why do you have a URL like that in first place? If user is entering them, you'll have to do some kind of URL rewriting. But that isn't supported on GitHub pages unless you add a custom domain and use something like cloudflare in front of it.

I don't think we can fix this at VitePress level, a lot of code depends on URL matching the file structure strictly. Not just the replace(/\//g, '_') part, but there are also things just doing slice(1). It'll be hard to figure all of them out and change them so that it doesn't break // in urls.

Liboq commented 10 months ago

是的,那么为什么你首先要使用这样的 URL 呢?如果用户输入它们,你将必须进行某种 URL 重写。但 GitHub 页面不支持这一点点,除非您添加自定义域并在其前面使用类似的 cloudflare的内容。

我不认为我们可以在 VitePress 级别修复这个问题,很多代码依赖于严格匹配文件结构的 URL。不仅仅是replace(/\//g, '_')部分,还有只是做的事情slice(1)。很难弄清楚所有这些并更改它们,这样就不会网址破坏。//

是的,这个是我不小心导航到此URL的,然后我试着从源头找到问题,想着解决此问题^_^,当然一般也不会导航到类似的URL,但是我刚测试了‘https://vitepress.dev/_guide/what-is-vitepress’ 也会出现同样的问题,要是可以在vitepress上修改好就更好了😝 image

Liboq commented 10 months ago

是否可以提前判断导航到404页面

Liboq commented 10 months ago

您给的地址仓库启动会报错,能否提供一个简单的恢复仓库或者在线stackblitz地址吗

仓库现在可以正常使用了🧐

zonemeen commented 10 months ago

这个需求应该不会在VitePress这一层面去支持,如果真的要实现,优先度也不会太高🤔

Liboq commented 10 months ago

这个需求应该不会在VitePress这一方面去支持,如果真的要实现,优先度也不会太高🤔 🤔

好哒,感谢啦

Liboq commented 10 months ago

这个需求应该不会在VitePress这一层面去支持,如果真的要实现,优先度也不会太高🤔

嗨,麻烦看下这个https://vitepress.dev/_guide/markdown 此类导航到了404,但是会重定向到 正确的https://vitepress.dev/guide/markdown, image

但是404页面还是会一直渲染在页面上而在本地dev时并不会重定向 image

brc-dd commented 10 months ago

嗨,麻烦看下这个https://vitepress.dev/_guide/markdown 此类导航到了404,但是会重定向到 正确的https://vitepress.dev/guide/markdown,

refer: https://github.com/vuejs/vitepress/pull/1475

users will see unexpected results if two files have same name after sanitization. Rollup/Vite handle this by appending a number after sanitized filename. But I don't think it will be possible to infer this number at client side. Also, this issue is exceedingly rare unless someone is intentionally trying to mess around.