NextJS- 如何处理重定向，同时我的策略 returns 出错

Question

我正在尝试获取在浏览器中输入的 URL，以便在我的 NextJS 自定义服务器中进行一些重定向。这个错误只出现在开发模式下，生产模式下不会出现，所以是正常的吗？对 devmode 做一些修改来处理这个问题？

我试过使用路径名对象。可悲的是，当我第一次在地址栏中输入 URL 时，我的路径名首先是 returns:

/_next/static/chunks/0.js

我试过 req.rawHeaders。但是我的控制台 returns 在第 15 次试用之前什么都没有:

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js :

req.rawHeaders path in next.server.js : /pathTargeted // work ! but a little bit in late ..

我也尝试过 req.headers.referer 但即使如此，第一个路径 returns 也不是我在 URL 中输入的路径。

结果是我陷入了404错误。那么如何避免这种情况并始终获取在浏览器中输入的真实地址呢？这正是我的问题。

这是我的 reactjs 片段：

import React, {Component} from "react"; 
import style from "./BlogHubTemplate.module.css";

import storeWrapper from "../../HOC/storeWrapper/storeWrapper"
import {connect} from 'react-redux';

import Router from 'next/router'


class BlogHubTemplate extends Component { 

    redirectPost = (postCategory, postTitle) => { 
        Router.replace(`/${postCategory}/${postTitle}`) 
    }

这里是我的自定义 next.server js:

app.prepare().then(() => {
 createServer((req, res) => {
 // Be sure to pass `true` as the second argument to `url.parse`.
 // This tells it to parse the query portion of the URL.
 const parsedUrl = parse(req.url, true)
 const { pathname, query } = parsedUrl; 

 console.log("req.headers in next.server.js : ", req.headers.referer.substr(22))
 console.log("req.rawHeaders path in next.server.js : ", req.rawHeaders[11].substr(22))

任何提示都很好，谢谢

Answer 1

这不是 next.js 问题

只需在每个使用 window.location.pathname

的地方添加 decodeURIComponent

28 行代码https://github.com/Hocoh/redirect_next/blob/master/ui/pages/post.js#L29

而不是：

  var postFullPath = window.location.pathname.substr(1) ;

应该是：

  var postFullPath = decodeURIComponent(window.location.pathname).substr(1) ;

38 行代码https://github.com/Hocoh/redirect_next/blob/master/ui/pages/blog.js#L38

而不是：

var pageTargeted = window.location.pathname.substr(11) ;

应该是：

var pageTargeted = decodeURIComponent(window.location.pathname).substr(11) ;

13 行代码

https://github.com/Hocoh/redirect_next/blob/master/ui/components/BlogHubTemplate/utils/Pagination/Pagination.js#L13

而不是

   window.location.pathname = `blog/page/${pageTargeted}`

应该是：

  Router.push(decodeURIComponent(`blog/page/${pageTargeted}`))

10 行代码

https://github.com/Hocoh/redirect_next/blob/master/ui/components/BlogHubTemplate/utils/Pagination/PaginationMain/PaginationMain.js#L10

而不是：

window.location.pathname = `blog/page/${pageTargeted}`

应该是：

  Router.push(decodeURIComponent(`blog/page/${pageTargeted}`))

代码第 31 行

https://github.com/Hocoh/redirect_next/blob/master/ui/components/BlogHubTemplate/BlogHubTemplate.js#L31

而不是：

Router.replace(`/${postCategory}/${postTitle}`);

应该是：

Router.push(decodeURIComponent(`/${postCategory}/${postTitle}`));

并将decodeURIComponent添加到另一个文件

NextJS- 如何处理重定向，同时我的策略 returns 出错

NextJS- How handle redirect, meanwhile my strategy returns an error

reactjs

next.js