NextJS-如何处理重定向,同时我的策略返回错误

Question

我正在尝试获取在浏览器中输入的URL,以便在我的NextJS自定义服务器中进行重定向.此错误仅在开发模式下发生,在生产模式下不发生,所以它是否正常？在devmode上做一些修改来处理它？

我试图使用pathname对象.可悲的是,当我第一次在地址栏中输入URL时,我的路径名首先返回:

/_next/static/chunks/0.js

我试过req.rawHeaders.但是直到第15次试验我的控制台才会返回任何内容

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:

next.server.js中的req.rawHeaders路径:/ pathTargeted //工作!但是有点迟到..

我也尝试过req.headers.referer但是,即使第一个路径返回的不是我在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 问题

只需decodeURIComponent在您使用的每个地方添加即可window.location.pathname

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/Hcoh/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 到另一个文件