替换页面meta并用nuxt上的全局元链接

发布于 2025-02-13 08:11:22 字数 2201 浏览 0 评论 0原文

为什么元标题的本地配置和描述不覆盖全局配置,

问题是,当我更改页面上的元标记和链接时,它会删除全局的元标记并替换新的meta标签。我希望将这些元和链接添加到全局元和链接中。

在我拥有的元标记和全局链接中,我有一个使网站徽标的一部分在Safari中添加书签时正确的一部分,但是当我将元标记添加到页面上时,照片不再加载,并且我认为问题在于,接下来要替换每个页面上创建的元标记,而不是全局元标记

这是我的nuxt配置代码

 head: {
        title: 'Flyver',
        htmlAttrs: {
          lang: 'en',
        },
        meta: [
          .........
          { charset: 'utf-8' },
          {
            name: 'viewport',
            hid: 'viewport',
            content:
              'width=device-width,initial-scale=1,shrink-to-fit=no,maximum-scale=5,viewport-fit=cover',
          },
          { hid: 'description', name: 'description', content: '' },
          { name: 'format-detection', content: 'telephone=no' },
          {
            hid: 'apple-mobile-web-app-status-bar-style',
            name: 'apple-mobile-web-app-status-bar-style',
            content: 'black-translucent',
          },
          .........
        ],
        link: [
          .........
    
          {
            hid: 'apple-touch-icon',
            rel: 'apple-touch-icon',
            href: '/android-chrome-180x180.png?v=sf54fgh123',
            type: 'image/png',
            sizes: '180x180',
          },
          {
            hid: 'apple-touch-icon1',
            rel: 'apple-touch-icon',
            href: '/apple-touch-icon.png?v=sf54fgh123',
            type: 'image/png',
            sizes: '120x120',
          },
          .........
      },

这是我的索引页

    async fetch() {
      ........
        this.headValue = {
          title: this.pageData?.value?.title,
          link: [
            {
              rel: 'canonical',
              href: `https://flyver.ir`,
            },
          ],
          meta: [
            {
              name: 'description',
              content: this.pageData?.value?.description,
            },
            
            ...this.pageData?.metaTags,
          ],
        };
        ..........
      },
      head() {
        return this.headValue;
      },

预期的是什么? 我希望每个页面创建的元标记将添加到全局元标签

实际发生了什么? 用全局元标记替换新的元标记

Why doesn't the local configuration for meta title and description override the global configuration

The problem is that when I change the meta tags and links on the page, it removes the meta tags that are global and replaces the new meta tags. I want these meta and links to be added to the global meta and links.

In the meta tag and global links that I have, I have a part that makes the logo part of the site correct when adding a bookmark in Safari, but when I add the meta tag to my page, the photo is no longer loaded, and I think the problem is from It is that Next replaces the meta tags that are created on each page instead of the global meta tags

this is my nuxt config code

 head: {
        title: 'Flyver',
        htmlAttrs: {
          lang: 'en',
        },
        meta: [
          .........
          { charset: 'utf-8' },
          {
            name: 'viewport',
            hid: 'viewport',
            content:
              'width=device-width,initial-scale=1,shrink-to-fit=no,maximum-scale=5,viewport-fit=cover',
          },
          { hid: 'description', name: 'description', content: '' },
          { name: 'format-detection', content: 'telephone=no' },
          {
            hid: 'apple-mobile-web-app-status-bar-style',
            name: 'apple-mobile-web-app-status-bar-style',
            content: 'black-translucent',
          },
          .........
        ],
        link: [
          .........
    
          {
            hid: 'apple-touch-icon',
            rel: 'apple-touch-icon',
            href: '/android-chrome-180x180.png?v=sf54fgh123',
            type: 'image/png',
            sizes: '180x180',
          },
          {
            hid: 'apple-touch-icon1',
            rel: 'apple-touch-icon',
            href: '/apple-touch-icon.png?v=sf54fgh123',
            type: 'image/png',
            sizes: '120x120',
          },
          .........
      },

this is my index page

    async fetch() {
      ........
        this.headValue = {
          title: this.pageData?.value?.title,
          link: [
            {
              rel: 'canonical',
              href: `https://flyver.ir`,
            },
          ],
          meta: [
            {
              name: 'description',
              content: this.pageData?.value?.description,
            },
            
            ...this.pageData?.metaTags,
          ],
        };
        ..........
      },
      head() {
        return this.headValue;
      },

What is Expected?
I expect the meta tags that are created per page to be added to the global meta tags

What is actually happening?
Replaces new meta tags with global meta tags

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文