Блог

В настоящее время я планирую разработать веб-приложение с использованием платформы NuxtJS/NextJS с универсальной архитектурой SSR, я сталкиваюсь с трудностями, связанными с SEO , потому что ранее мой проект был написан на .NET, поэтому все URL .html -адреса в конце..

Экс:

• domain.com/hotels (это Кейт)
• domain.com/hotels-5-star.html (это подразделение отелей Cate)

Приведенный выше пример является специфическим для моей проблемы, это означает, что по данным Google, чем короче УРЛ, тем лучше, чтобы мои страницы были укорочены на один «/», однако из-за структуры страницы и 2 уровней иерархии, Кейт и суб Кейт, так что для Google, чтобы отличить этот URL-адрес (суб Кейт), должны включить .html в конце.

Могу ли я использовать NuxtJS/NextJS для создания страниц с тем же URL-адресом, что и выше?, Я провел исследование, но нашел конкретное решение, возможно, мой опыт невелик, поэтому мне нужна помощь экспертов по NuxtJS/NextJS

да, в nuxtjs , вы можете использовать @nuxtjs/router для настройки пути вашего маршрутизатора, как это

nuxt.config.js

 buildModules: [
    '@nuxtjs/router'
]
 

router.js

 import Vue from 'vue';
import VueRouter from 'vue-router';

Vue.use(VueRouter);

const page = path => () => import(`./pages/${path}.vue`).then(m => m.default || m);

const routes = [
    {
        path: '/hotels-:star-star.html',
        name: 'hotels',
        props: true,
        component: page('hotels')
    }
];
export function createRouter(){
    return new VueRouter({
        routes
    });
}
 

страницы/отели.vue

 <template>
    <main>
        {{ star }}
    </main>
</template>

<script>
export default{
    props: {
        star: {
            type: Number
        }
    }
}
</script>
 

Я не эксперт в SEO, но я бы просто использовал 5-star в качестве запроса в domain.com/hotels

Это означало бы, что вы могли бы использовать единую иерархию следующим образом:

domain.com/hotels?rating=5-stars

Что касается использования html-файлов в качестве маршрутизации URL-адресов для сайта, свойство nuxt generate преобразует проект в html-файлы, которые находятся под вашим контролем. Структура основана на том, что вы установили в каталоге страниц

В настоящее время все современные приложения имеют некоторые красивые URL-адреса, похожие domain.com/hotels/
С косой чертой в конце. Не смешивайте и не сочетайте их. Либо положите их везде, либо нигде.
С точки зрения SEO, конечные косые черты не имеют значения, вы можете позволить им.

Современные фреймворки JS отлично справляются с этим, и они знают , что если вы достигнете domain.com/hotels/ , вы на самом деле захотите обслуживать .html (он же .vue ) файл в нем, не нужно его добавлять.

В Nuxt.js, структуры каталогов будут выглядеть следующим образом:

 -- pages
---- hotels.vue
 

или

 -- pages
---- hotels
------ index.vue
 

Что касается этого

чем короче URL-адрес, тем лучше

Не подчеркивайте это слишком сильно, вам также не нужно создавать супер-короткие пути.

Просто сохраняйте семантику и логику. Иметь domain.com/h5s будет очень плохо.
Кроме того, иметь domain.com/hotels/5-stars или domain.com/hotels/?rating=5 -это совершенно нормально.
В принципе, сделайте их каким-то образом читаемыми для конечного пользователя.

PS: имейте в виду, что Next.js >>> Реагируйте и Nuxt.js >>>>>>> VueJS.