node.js - 如何从 Gatsby 中的数组正确创建重定向

Question

我正在使用 Gatsby 和 WordPress。我正在尝试使用 Gatsby 重定向 API 重定向一些 URL。我编写查询以获取对象，然后使用 Map 方法从该对象创建我们需要的项目数组。然后我运行一个 for Each 方法以从该数组中获取单个数据，但它在运行开发服务器时失败。

这样做的正确方法是什么？

const { createRedirect } = actions;
  
  const yoastRedirects = graphql(`
  {
    wp {
      seo {
        redirects {
          format
          origin
          target
          type
        }
      }
    }
  }
  `)
  const redirectOriginUrls = yoastRedirects.wp.seo.redirects.map(redirect=>(redirect.origin))
  const redirectTargetUrls = yoastRedirects.wp.seo.redirects.map(redirect=>(
    redirect.target
  ))
  
  redirectOriginUrls.forEach(redirectOriginUrl=>(
    redirectTargetUrls.forEach(redirectTargetUrl=>(
      createRedirect({
        fromPath: `/${redirectOriginUrl}`, 
        toPath: `/${redirectTargetUrl}`, 
        isPermanent: true
      })
    ))
  ))
  

Answer 1

The createRedirect API needs to recieve a structure like:

exports.createPages = ({ graphql, actions }) => {
  const { createRedirect } = actions
  createRedirect({ fromPath: '/old-url', toPath: '/new-url', isPermanent: true })
  createRedirect({ fromPath: '/url', toPath: '/zn-CH/url', Language: 'zn' })
  createRedirect({ fromPath: '/not_so-pretty_url', toPath: '/pretty/url', statusCode: 200 })

  // Create pages
}

In your case, you are not entering to the correct fetched data. Assuming that the loops are properly done, you must do:

 let redirectOriginUrls=[];
 let redirectTargetUrls=[];

  yoastRedirects.data.wp.seo.redirects.map(redirect=>{
    return redirectOriginUrls.push(redirect.origin)
  });

  yoastRedirects.data.wp.seo.redirects.map(redirect=>{
    return redirectTargetUrls.push(redirect.target)
  })

Instead of:

  const redirectOriginUrls = yoastRedirects.wp.seo.redirects.map(redirect=>(redirect.origin))
  const redirectTargetUrls = yoastRedirects.wp.seo.redirects.map(redirect=>(
    redirect.target
  ))

Notice the .data addition in the nested object.

In addition, keep in mind that the createRedirect API will only work only when having a hosting infrastructure behind, like AWS or Netlify, both have plugins integration with Gatsby. This will generate meta redirect HTML files for redirecting on any static file host.