Далее. js Link prefetch вызывает 404 ошибки в продакшене - PullRequest
Новая
       5

Далее. js Link prefetch вызывает 404 ошибки в продакшене

0 голосов
/ 21 июня 2020

Я разрабатываю блог с помощью Next. JS. В этом блоге у меня есть страница, на которой я представляю все свои статьи.

Визуализированный компонент выглядит так: 

<div>
    {articles.map((article, index) => {
        const path = `/magazine/${article.id}/${encodeURIComponent(
            article.formatted_name
        )}`;

        return (
            <Link key={article.id} href={path} as={path} prefetch>
                <a>
                    <CardArticle article={article} index={index} />
                </a>
            </Link>
        );
    })}
</div>

Ссылки работают нормально, и в режиме разработки есть вообще никакой ошибки. Однако после сборки ссылки по-прежнему работают нормально, но предварительная выборка из ссылок не работает, когда я нахожусь на странице с представленным списком статей:

404 ошибки во время предварительной выборки

Обратите внимание, если уместно: список статей, полученных с помощью вызова API в getServerSideProps.

Кто-нибудь знает, почему мой <Link> не выполняет предварительную выборку, но все равно работает в противном случае?

1 Ответ

2 голосов
/ 21 июня 2020

Я считаю, что проблема в том, что вы неправильно используете href и as. Согласно docs , href должен быть вашей динамической c ссылкой в ​​каталоге страниц (например, /magazine/[id]/[name] - изменение для вашего варианта использования), а as является правильным.

...