Introduce proper url routing for next-export which supports query strings.
This commit is contained in:
parent
90991f176c
commit
e78c2f44dc
3 changed files with 26 additions and 12 deletions
|
@ -3,7 +3,7 @@
|
||||||
import { resolve, format, parse } from 'url'
|
import { resolve, format, parse } from 'url'
|
||||||
import React, { Component, Children } from 'react'
|
import React, { Component, Children } from 'react'
|
||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
import Router from './router'
|
import Router, { _rewriteUrlForNextExport } from './router'
|
||||||
import { warn, execOnce, getLocationOrigin } from './utils'
|
import { warn, execOnce, getLocationOrigin } from './utils'
|
||||||
|
|
||||||
export default class Link extends Component {
|
export default class Link extends Component {
|
||||||
|
@ -126,13 +126,11 @@ export default class Link extends Component {
|
||||||
|
|
||||||
// Add the ending slash to the paths. So, we can serve the
|
// Add the ending slash to the paths. So, we can serve the
|
||||||
// "<page>/index.html" directly.
|
// "<page>/index.html" directly.
|
||||||
const endsWithSlash = /\/$/.test(props.href)
|
|
||||||
if (
|
if (
|
||||||
typeof __NEXT_DATA__ !== 'undefined' &&
|
typeof __NEXT_DATA__ !== 'undefined' &&
|
||||||
__NEXT_DATA__.nextExport &&
|
__NEXT_DATA__.nextExport
|
||||||
!endsWithSlash
|
|
||||||
) {
|
) {
|
||||||
props.href = `${props.href}/`
|
props.href = _rewriteUrlForNextExport(props.href)
|
||||||
}
|
}
|
||||||
|
|
||||||
return React.cloneElement(child, props)
|
return React.cloneElement(child, props)
|
||||||
|
|
|
@ -85,3 +85,23 @@ export function _notifyBuildIdMismatch (nextRoute) {
|
||||||
window.location.href = nextRoute
|
window.location.href = nextRoute
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function _rewriteUrlForNextExport (url) {
|
||||||
|
// If there are no query strings
|
||||||
|
if (!/\?/.test(url)) {
|
||||||
|
return rewritePath(url)
|
||||||
|
}
|
||||||
|
|
||||||
|
const [path, qs] = url.split('?')
|
||||||
|
|
||||||
|
const newPath = rewritePath(path)
|
||||||
|
return `${newPath}?${qs}`
|
||||||
|
|
||||||
|
function rewritePath (path) {
|
||||||
|
// If ends with slash simply return that path
|
||||||
|
if (/\/$/.test(path)) {
|
||||||
|
return path
|
||||||
|
}
|
||||||
|
return `${path}/`
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -5,7 +5,7 @@ import mitt from 'mitt'
|
||||||
import shallowEquals from '../shallow-equals'
|
import shallowEquals from '../shallow-equals'
|
||||||
import PQueue from '../p-queue'
|
import PQueue from '../p-queue'
|
||||||
import { loadGetInitialProps, getURL } from '../utils'
|
import { loadGetInitialProps, getURL } from '../utils'
|
||||||
import { _notifyBuildIdMismatch } from './'
|
import { _notifyBuildIdMismatch, _rewriteUrlForNextExport } from './'
|
||||||
|
|
||||||
export default class Router {
|
export default class Router {
|
||||||
constructor (pathname, query, as, { pageLoader, Component, ErrorComponent, err } = {}) {
|
constructor (pathname, query, as, { pageLoader, Component, ErrorComponent, err } = {}) {
|
||||||
|
@ -124,12 +124,8 @@ export default class Router {
|
||||||
|
|
||||||
// Add the ending slash to the paths. So, we can serve the
|
// Add the ending slash to the paths. So, we can serve the
|
||||||
// "<page>/index.html" directly for the SSR page.
|
// "<page>/index.html" directly for the SSR page.
|
||||||
const asEndsWithSlash = /\/$/.test(as)
|
if (__NEXT_DATA__.nextExport) {
|
||||||
if (
|
as = _rewriteUrlForNextExport(as)
|
||||||
__NEXT_DATA__.nextExport &&
|
|
||||||
!asEndsWithSlash
|
|
||||||
) {
|
|
||||||
as = `${as}/`
|
|
||||||
}
|
}
|
||||||
|
|
||||||
this.abortComponentLoad(as)
|
this.abortComponentLoad(as)
|
||||||
|
|
Loading…
Reference in a new issue