Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Rename getServerProps to getServerSideProps #10722

Merged
merged 1 commit into from Feb 27, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 2 additions & 2 deletions docs/concepts/_data-fetching.md
Expand Up @@ -46,7 +46,7 @@ export default HomePage

[Read more about how Server-Side Rendering works]().

To opt-in to Server-Side Rendering, making every request render HTML on-demand you use the `getServerProps` method.
To opt-in to Server-Side Rendering, making every request render HTML on-demand you use the `getServerSideProps` method.

It allows you to fetch data before rendering starts when a request comes in.

Expand All @@ -56,7 +56,7 @@ Taking the same example as Static Generation, but opted into rendering the page
import fetch from 'isomorphic-unfetch'

// Called when a request comes in.
export async function getServerProps() {
export async function getServerSideProps() {
const res = await fetch('https://api.github.com/repos/zeit/next.js')
const json = await res.json()

Expand Down
2 changes: 1 addition & 1 deletion errors/404-get-initial-props.md
Expand Up @@ -2,7 +2,7 @@

#### Why This Error Occurred

In your `404.js` page you added `getInitialProps` or `getServerProps` which is not allowed as this prevents the page from being static and `404.js` is meant to provide more flexibility for a static 404 page. Having a static 404 page is the most ideal as this page can be served very often and if not static puts extra strain on your server and more invocations for serverless functions which increase the cost of hosting your site unnecessarily.
In your `404.js` page you added `getInitialProps` or `getServerSideProps` which is not allowed as this prevents the page from being static and `404.js` is meant to provide more flexibility for a static 404 page. Having a static 404 page is the most ideal as this page can be served very often and if not static puts extra strain on your server and more invocations for serverless functions which increase the cost of hosting your site unnecessarily.

#### Possible Ways to Fix It

Expand Down
2 changes: 1 addition & 1 deletion examples/with-apollo/lib/apollo.js
Expand Up @@ -11,7 +11,7 @@ let globalApolloClient = null
/**
* Installs the Apollo Client on NextPageContext
* or NextAppContext. Useful if you want to use apolloClient
* inside getStaticProps, getStaticPaths or getServerProps
* inside getStaticProps, getStaticPaths or getServerSideProps
* @param {NextPageContext | NextAppContext} ctx
*/
export const initOnContext = ctx => {
Expand Down
2 changes: 1 addition & 1 deletion packages/next/build/babel/plugins/next-ssg-transform.ts
Expand Up @@ -10,7 +10,7 @@ const pageComponentVar = '__NEXT_COMP'

export const EXPORT_NAME_GET_STATIC_PROPS = 'unstable_getStaticProps'
export const EXPORT_NAME_GET_STATIC_PATHS = 'unstable_getStaticPaths'
export const EXPORT_NAME_GET_SERVER_PROPS = 'unstable_getServerProps'
export const EXPORT_NAME_GET_SERVER_PROPS = 'unstable_getServerSideProps'

const ssgExports = new Set([
EXPORT_NAME_GET_STATIC_PROPS,
Expand Down
4 changes: 2 additions & 2 deletions packages/next/build/utils.ts
Expand Up @@ -202,7 +202,7 @@ export async function printTreeView(
serverless ? '(Lambda)' : '(Server)',
`server-side renders at runtime (uses ${chalk.cyan(
'getInitialProps'
)} or ${chalk.cyan('getServerProps')})`,
)} or ${chalk.cyan('getServerSideProps')})`,
],
[
'○',
Expand Down Expand Up @@ -636,7 +636,7 @@ export async function isPageStatic(
const hasGetInitialProps = !!(Comp as any).getInitialProps
const hasStaticProps = !!mod.unstable_getStaticProps
const hasStaticPaths = !!mod.unstable_getStaticPaths
const hasServerProps = !!mod.unstable_getServerProps
const hasServerProps = !!mod.unstable_getServerSideProps
const hasLegacyStaticParams = !!mod.unstable_getStaticParams

if (hasLegacyStaticParams) {
Expand Down
12 changes: 6 additions & 6 deletions packages/next/build/webpack/loaders/next-serverless-loader.ts
Expand Up @@ -220,7 +220,7 @@ const nextServerlessLoader: loader.Loader = function() {
export const unstable_getStaticProps = ComponentInfo['unstable_getStaticProp' + 's']
export const unstable_getStaticParams = ComponentInfo['unstable_getStaticParam' + 's']
export const unstable_getStaticPaths = ComponentInfo['unstable_getStaticPath' + 's']
export const unstable_getServerProps = ComponentInfo['unstable_getServerProp' + 's']
export const unstable_getServerSideProps = ComponentInfo['unstable_getServerSideProp' + 's']
${dynamicRouteMatcher}
${handleRewrites}
Expand All @@ -242,7 +242,7 @@ const nextServerlessLoader: loader.Loader = function() {
Document,
buildManifest,
unstable_getStaticProps,
unstable_getServerProps,
unstable_getServerSideProps,
unstable_getStaticPaths,
reactLoadableManifest,
canonicalBase: "${canonicalBase}",
Expand Down Expand Up @@ -275,7 +275,7 @@ const nextServerlessLoader: loader.Loader = function() {
${page === '/_error' ? `res.statusCode = 404` : ''}
${
pageIsDynamicRoute
? `const params = fromExport && !unstable_getStaticProps && !unstable_getServerProps ? {} : dynamicRouteMatcher(parsedUrl.pathname) || {};`
? `const params = fromExport && !unstable_getStaticProps && !unstable_getServerSideProps ? {} : dynamicRouteMatcher(parsedUrl.pathname) || {};`
: `const params = {};`
}
${
Expand Down Expand Up @@ -331,7 +331,7 @@ const nextServerlessLoader: loader.Loader = function() {
'Cache-Control',
isPreviewMode
? \`private, no-cache, no-store, max-age=0, must-revalidate\`
: unstable_getServerProps
: unstable_getServerSideProps
? \`no-cache, no-store, must-revalidate\`
: \`s-maxage=\${renderOpts.revalidate}, stale-while-revalidate\`
)
Expand All @@ -352,7 +352,7 @@ const nextServerlessLoader: loader.Loader = function() {
const result = await renderToHTML(req, res, "/_error", parsedUrl.query, Object.assign({}, options, {
unstable_getStaticProps: undefined,
unstable_getStaticPaths: undefined,
unstable_getServerProps: undefined,
unstable_getServerSideProps: undefined,
Component: Error
}))
return result
Expand All @@ -362,7 +362,7 @@ const nextServerlessLoader: loader.Loader = function() {
const result = await renderToHTML(req, res, "/_error", parsedUrl.query, Object.assign({}, options, {
unstable_getStaticProps: undefined,
unstable_getStaticPaths: undefined,
unstable_getServerProps: undefined,
unstable_getServerSideProps: undefined,
Component: Error,
err
}))
Expand Down
6 changes: 3 additions & 3 deletions packages/next/lib/constants.ts
Expand Up @@ -26,8 +26,8 @@ export const PUBLIC_DIR_MIDDLEWARE_CONFLICT = `You can not have a '_next' folder

export const SSG_GET_INITIAL_PROPS_CONFLICT = `You can not use getInitialProps with unstable_getStaticProps. To use SSG, please remove your getInitialProps`

export const SERVER_PROPS_GET_INIT_PROPS_CONFLICT = `You can not use getInitialProps with unstable_getServerProps. Please remove one or the other`
export const SERVER_PROPS_GET_INIT_PROPS_CONFLICT = `You can not use getInitialProps with unstable_getServerSideProps. Please remove one or the other`

export const SERVER_PROPS_SSG_CONFLICT = `You can not use unstable_getStaticProps with unstable_getServerProps. To use SSG, please remove your unstable_getServerProps`
export const SERVER_PROPS_SSG_CONFLICT = `You can not use unstable_getStaticProps with unstable_getServerSideProps. To use SSG, please remove your unstable_getServerSideProps`

export const PAGES_404_GET_INITIAL_PROPS_ERROR = `\`pages/404\` can not have getInitialProps/getServerProps, https://err.sh/zeit/next.js/404-get-initial-props`
export const PAGES_404_GET_INITIAL_PROPS_ERROR = `\`pages/404\` can not have getInitialProps/getServerSideProps, https://err.sh/zeit/next.js/404-get-initial-props`
20 changes: 10 additions & 10 deletions packages/next/next-server/server/load-components.ts
Expand Up @@ -21,13 +21,13 @@ export function interopDefault(mod: any) {
function addComponentPropsId(
Component: any,
getStaticProps: any,
getServerProps: any
getServerSideProps: any
) {
// Mark the component with the SSG or SSP id here since we don't run
// the SSG babel transform for server mode
if (getStaticProps) {
Component[STATIC_PROPS_ID] = true
} else if (getServerProps) {
} else if (getServerSideProps) {
Component[SERVER_PROPS_ID] = true
}
}
Expand Down Expand Up @@ -55,7 +55,7 @@ export type Unstable_getStaticPaths = () => Promise<{
fallback: boolean
}>

type Unstable_getServerProps = (context: {
type Unstable_getServerSideProps = (context: {
params: ParsedUrlQuery | undefined
req: IncomingMessage
res: ServerResponse
Expand All @@ -72,7 +72,7 @@ export type LoadComponentsReturnType = {
App: AppType
unstable_getStaticProps?: Unstable_getStaticProps
unstable_getStaticPaths?: Unstable_getStaticPaths
unstable_getServerProps?: Unstable_getServerProps
unstable_getServerSideProps?: Unstable_getServerSideProps
}

export async function loadComponents(
Expand All @@ -86,21 +86,21 @@ export async function loadComponents(
const {
unstable_getStaticProps,
unstable_getStaticPaths,
unstable_getServerProps,
unstable_getServerSideProps,
} = Component

addComponentPropsId(
Component,
unstable_getStaticProps,
unstable_getServerProps
unstable_getServerSideProps
)

return {
Component,
pageConfig: Component.config || {},
unstable_getStaticProps,
unstable_getStaticPaths,
unstable_getServerProps,
unstable_getServerSideProps,
} as LoadComponentsReturnType
}
const documentPath = join(
Expand Down Expand Up @@ -142,15 +142,15 @@ export async function loadComponents(
])

const {
unstable_getServerProps,
unstable_getServerSideProps,
unstable_getStaticProps,
unstable_getStaticPaths,
} = ComponentMod

addComponentPropsId(
Component,
unstable_getStaticProps,
unstable_getServerProps
unstable_getServerSideProps
)

return {
Expand All @@ -161,7 +161,7 @@ export async function loadComponents(
DocumentMiddleware,
reactLoadableManifest,
pageConfig: ComponentMod.config || {},
unstable_getServerProps,
unstable_getServerSideProps,
unstable_getStaticProps,
unstable_getStaticPaths,
}
Expand Down
2 changes: 1 addition & 1 deletion packages/next/next-server/server/next-server.ts
Expand Up @@ -889,7 +889,7 @@ export default class Server {
typeof components.Component === 'object' &&
typeof (components.Component as any).renderReqToHTML === 'function'
const isSSG = !!components.unstable_getStaticProps
const isServerProps = !!components.unstable_getServerProps
const isServerProps = !!components.unstable_getServerSideProps
const hasStaticPaths = !!components.unstable_getStaticPaths

// Toggle whether or not this is a Data request
Expand Down
20 changes: 10 additions & 10 deletions packages/next/next-server/server/render.tsx
Expand Up @@ -275,7 +275,7 @@ export async function renderToHTML(
ErrorDebug,
unstable_getStaticProps,
unstable_getStaticPaths,
unstable_getServerProps,
unstable_getServerSideProps,
isDataReq,
params,
previewProps,
Expand Down Expand Up @@ -323,7 +323,7 @@ export async function renderToHTML(
!hasPageGetInitialProps &&
defaultAppGetInitialProps &&
!isSpr &&
!unstable_getServerProps
!unstable_getServerSideProps

if (
process.env.NODE_ENV !== 'production' &&
Expand All @@ -349,11 +349,11 @@ export async function renderToHTML(
throw new Error(SSG_GET_INITIAL_PROPS_CONFLICT + ` ${pathname}`)
}

if (hasPageGetInitialProps && unstable_getServerProps) {
if (hasPageGetInitialProps && unstable_getServerSideProps) {
throw new Error(SERVER_PROPS_GET_INIT_PROPS_CONFLICT + ` ${pathname}`)
}

if (unstable_getServerProps && isSpr) {
if (unstable_getServerSideProps && isSpr) {
throw new Error(SERVER_PROPS_SSG_CONFLICT + ` ${pathname}`)
}

Expand Down Expand Up @@ -529,8 +529,8 @@ export async function renderToHTML(
console.error(err)
}

if (unstable_getServerProps && !isFallback) {
const data = await unstable_getServerProps({
if (unstable_getServerSideProps && !isFallback) {
const data = await unstable_getServerSideProps({
params,
query,
req,
Expand All @@ -540,7 +540,7 @@ export async function renderToHTML(
const invalidKeys = Object.keys(data).filter(key => key !== 'props')

if (invalidKeys.length) {
throw new Error(invalidKeysMsg('getServerProps', invalidKeys))
throw new Error(invalidKeysMsg('getServerSideProps', invalidKeys))
}

props.pageProps = data.props
Expand All @@ -549,7 +549,7 @@ export async function renderToHTML(

if (
!isSpr && // we only show this warning for legacy pages
!unstable_getServerProps &&
!unstable_getServerSideProps &&
process.env.NODE_ENV !== 'production' &&
Object.keys(props?.pageProps || {}).includes('url')
) {
Expand All @@ -560,10 +560,10 @@ export async function renderToHTML(
}

// We only need to do this if we want to support calling
// _app's getInitialProps for getServerProps if not this can be removed
// _app's getInitialProps for getServerSideProps if not this can be removed
if (isDataReq) return props

// We don't call getStaticProps or getServerProps while generating
// We don't call getStaticProps or getServerSideProps while generating
// the fallback so make sure to set pageProps to an empty object
if (isFallback) {
props.pageProps = {}
Expand Down
2 changes: 1 addition & 1 deletion packages/next/pages/_app.tsx
Expand Up @@ -48,7 +48,7 @@ export default class App<P = {}, CP = {}, S = {}> extends React.Component<
{...pageProps}
{
// we don't add the legacy URL prop if it's using non-legacy
// methods like getStaticProps and getServerProps
// methods like getStaticProps and getServerSideProps
...(!((Component as any).__N_SSG || (Component as any).__N_SSP)
? { url: createUrl(router) }
: {})
Expand Down
4 changes: 2 additions & 2 deletions test/integration/404-page/test/index.test.js
Expand Up @@ -149,7 +149,7 @@ describe('404 Page Support', () => {
await fs.move(`${pages404}.bak`, pages404)

expect(stderr).toContain(
`\`pages/404\` can not have getInitialProps/getServerProps, https://err.sh/zeit/next.js/404-get-initial-props`
`\`pages/404\` can not have getInitialProps/getServerSideProps, https://err.sh/zeit/next.js/404-get-initial-props`
)
expect(code).toBe(1)
})
Expand Down Expand Up @@ -180,7 +180,7 @@ describe('404 Page Support', () => {
await fs.remove(pages404)
await fs.move(`${pages404}.bak`, pages404)

const error = `\`pages/404\` can not have getInitialProps/getServerProps, https://err.sh/zeit/next.js/404-get-initial-props`
const error = `\`pages/404\` can not have getInitialProps/getServerSideProps, https://err.sh/zeit/next.js/404-get-initial-props`

expect(stderr).toContain(error)
})
Expand Down
Expand Up @@ -3,7 +3,7 @@ import fs from 'fs'
import findUp from 'find-up'

// eslint-disable-next-line camelcase
export async function unstable_getServerProps() {
export async function unstable_getServerSideProps() {
const text = fs
.readFileSync(
findUp.sync('world.txt', {
Expand Down
Expand Up @@ -2,7 +2,7 @@ import React from 'react'
import Link from 'next/link'

// eslint-disable-next-line camelcase
export async function unstable_getServerProps({ query }) {
export async function unstable_getServerSideProps({ query }) {
return {
props: {
post: query.post,
Expand Down
Expand Up @@ -3,7 +3,7 @@ import Link from 'next/link'
import { useRouter } from 'next/router'

// eslint-disable-next-line camelcase
export async function unstable_getServerProps({ params }) {
export async function unstable_getServerSideProps({ params }) {
if (params.post === 'post-10') {
await new Promise(resolve => {
setTimeout(() => resolve(), 1000)
Expand Down
Expand Up @@ -2,7 +2,7 @@ import React from 'react'
import Link from 'next/link'

// eslint-disable-next-line camelcase
export async function unstable_getServerProps() {
export async function unstable_getServerSideProps() {
return {
props: {
slugs: ['post-1', 'post-2'],
Expand Down
Expand Up @@ -3,7 +3,7 @@ import Link from 'next/link'
import { useRouter } from 'next/router'

// eslint-disable-next-line camelcase
export async function unstable_getServerProps({ params }) {
export async function unstable_getServerSideProps({ params }) {
return {
props: {
world: 'world',
Expand Down
@@ -1,7 +1,7 @@
import Link from 'next/link'

// eslint-disable-next-line camelcase
export async function unstable_getServerProps() {
export async function unstable_getServerSideProps() {
return {
props: {
world: 'world',
Expand Down
@@ -1,7 +1,7 @@
import Link from 'next/link'

// eslint-disable-next-line camelcase
export async function unstable_getServerProps() {
export async function unstable_getServerSideProps() {
return {
props: {
world: 'world',
Expand Down
Expand Up @@ -3,7 +3,7 @@ import Link from 'next/link'
import { useRouter } from 'next/router'

// eslint-disable-next-line camelcase
export async function unstable_getServerProps({ params, query }) {
export async function unstable_getServerSideProps({ params, query }) {
return {
world: 'world',
query: query || {},
Expand Down