github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2024-11-25 11:16:31 -05:00
Code Issues Projects Releases Packages Wiki Activity

Revert "fix(frontend): replace expected-origin-boundary with middleware"

Browse source 
This reverts commit 982bc4ba

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
This commit is contained in:
Tilman Vatteroth 2023-09-10 15:11:59 +02:00
parent a5b7c1c62f
commit 11a47b6087
4 changed files with 73 additions and 86 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
frontend/src/app/(editor)/layout.tsx
View file

@ -9,6 +9,7 @@ import { BaseUrlContextProvider } from '../../components/common/base-url/base-ur
import { FrontendConfigContextProvider } from '../../components/common/frontend-config-context/frontend-config-context-provider' import { FrontendConfigContextProvider } from '../../components/common/frontend-config-context/frontend-config-context-provider'
import { MotdModal } from '../../components/global-dialogs/motd-modal/motd-modal' import { MotdModal } from '../../components/global-dialogs/motd-modal/motd-modal'
import { DarkMode } from '../../components/layout/dark-mode/dark-mode' import { DarkMode } from '../../components/layout/dark-mode/dark-mode'
import { ExpectedOriginBoundary } from '../../components/layout/expected-origin-boundary'
import { UiNotificationBoundary } from '../../components/notifications/ui-notification-boundary' import { UiNotificationBoundary } from '../../components/notifications/ui-notification-boundary'
import { StoreProvider } from '../../redux/store-provider' import { StoreProvider } from '../../redux/store-provider'
import { baseUrlFromEnvExtractor } from '../../utils/base-url-from-env-extractor' import { baseUrlFromEnvExtractor } from '../../utils/base-url-from-env-extractor'
@ -34,29 +35,29 @@ export default async function RootLayout({ children, appBar }: RootLayoutProps)
<link color='#b51f08' href='/icons/safari-pinned-tab.svg' rel='mask-icon' /> <link color='#b51f08' href='/icons/safari-pinned-tab.svg' rel='mask-icon' />
</head> </head>
<body> <body>
<BaseUrlContextProvider baseUrls={baseUrls}> <ExpectedOriginBoundary expectedOrigin={baseUrls.editor}>
<FrontendConfigContextProvider config={frontendConfig}> <BaseUrlContextProvider baseUrls={baseUrls}>
<StoreProvider> <FrontendConfigContextProvider config={frontendConfig}>
<ApplicationLoader> <StoreProvider>
<DarkMode /> <ApplicationLoader>
<MotdModal /> <DarkMode />
<UiNotificationBoundary> <MotdModal />
<div className={'d-flex flex-column vh-100'}> <UiNotificationBoundary>
{appBar} <div className={'d-flex flex-column vh-100'}>
{children} {appBar}
</div> {children}
</UiNotificationBoundary> </div>
</ApplicationLoader> </UiNotificationBoundary>
</StoreProvider> </ApplicationLoader>
</FrontendConfigContextProvider> </StoreProvider>
</BaseUrlContextProvider> </FrontendConfigContextProvider>
</BaseUrlContextProvider>
</ExpectedOriginBoundary>
</body> </body>
</html> </html>
) )
} }
export const dynamic = 'force-dynamic'
export const metadata: Metadata = { export const metadata: Metadata = {
themeColor: '#b51f08', themeColor: '#b51f08',
applicationName: 'HedgeDoc', applicationName: 'HedgeDoc',

19
frontend/src/app/(render)/layout.tsx
View file

@ -7,6 +7,7 @@ import '../../../global-styles/index.scss'
import { ApplicationLoader } from '../../components/application-loader/application-loader' import { ApplicationLoader } from '../../components/application-loader/application-loader'
import { BaseUrlContextProvider } from '../../components/common/base-url/base-url-context-provider' import { BaseUrlContextProvider } from '../../components/common/base-url/base-url-context-provider'
import { FrontendConfigContextProvider } from '../../components/common/frontend-config-context/frontend-config-context-provider' import { FrontendConfigContextProvider } from '../../components/common/frontend-config-context/frontend-config-context-provider'
import { ExpectedOriginBoundary } from '../../components/layout/expected-origin-boundary'
import { StoreProvider } from '../../redux/store-provider' import { StoreProvider } from '../../redux/store-provider'
import { baseUrlFromEnvExtractor } from '../../utils/base-url-from-env-extractor' import { baseUrlFromEnvExtractor } from '../../utils/base-url-from-env-extractor'
import React from 'react' import React from 'react'
@ -19,16 +20,16 @@ export default async function RootLayout({ children }: { children: React.ReactNo
return ( return (
<html lang='en'> <html lang='en'>
<body> <body>
<BaseUrlContextProvider baseUrls={baseUrls}> <ExpectedOriginBoundary expectedOrigin={baseUrls.renderer}>
<FrontendConfigContextProvider config={frontendConfig}> <BaseUrlContextProvider baseUrls={baseUrls}>
<StoreProvider> <FrontendConfigContextProvider config={frontendConfig}>
<ApplicationLoader>{children}</ApplicationLoader> <StoreProvider>
</StoreProvider> <ApplicationLoader>{children}</ApplicationLoader>
</FrontendConfigContextProvider> </StoreProvider>
</BaseUrlContextProvider> </FrontendConfigContextProvider>
</BaseUrlContextProvider>
</ExpectedOriginBoundary>
</body> </body>
</html> </html>
) )
} }
export const dynamic = 'force-dynamic'

44
frontend/src/components/layout/expected-origin-boundary.tsx Normal file
View file

@ -0,0 +1,44 @@
/*
* SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { headers } from 'next/headers'
import type { PropsWithChildren } from 'react'
import React from 'react'
export interface ExpectedOriginBoundaryProps extends PropsWithChildren {
expectedOrigin: string
}
/**
* Determines the host and protocol of the current request by checking the host or x-forwarded-host header.
*
* @return the calculated request origin or {@code undefined} if no host header has been found
*/
export const buildOriginFromHeaders = (): string | undefined => {
const currentHeader = headers()
const host = currentHeader.get('x-forwarded-host') ?? currentHeader.get('host')
if (host === null) {
return undefined
}
const protocol = currentHeader.get('x-forwarded-proto')?.split(',')[0] ?? 'http'
return `${protocol}://${host}`
}
/**
* This boundary lets the given children pass if the current request origin is matching the expected origin for this route.
* Otherwise, an error message is shown instead.
*
* @param children the children to show if the origin passes
* @param expectedOrigin The origin that should match the request's origin
*/
export const ExpectedOriginBoundary: React.FC<ExpectedOriginBoundaryProps> = ({ children, expectedOrigin }) => {
const currentOrigin = buildOriginFromHeaders()
if (new URL(expectedOrigin).origin !== currentOrigin) {
return <span>{`You can't open this page using this URL. For this endpoint "${expectedOrigin}" is expected.`}</span>
}
return children
}

59
frontend/src/middleware.ts
View file

@ -1,59 +0,0 @@
/*
* SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file)
*
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'
import { baseUrlFromEnvExtractor } from './utils/base-url-from-env-extractor'
/**
* Next.js middleware that checks if the expected and the current origin align.
*
* @param request The current request to check
*/
export function middleware(request: NextRequest) {
const currentOrigin = determineOriginFromHeaders(request.headers)
const expectedOrigin = determineExpectedOrigin(request)
if (currentOrigin === expectedOrigin) {
return
}
return new NextResponse(
`You can't open this page using this URL. For this endpoint "${expectedOrigin}" is expected.`,
{
status: 400,
headers: { 'content-type': 'text/plain' }
}
)
}
/**
* Determines the host and protocol of the current request by checking the host or x-forwarded-host header.
*
* @param headers The request headers provided by Next.js
*/
const determineOriginFromHeaders = (headers: Headers): string | undefined => {
const host = headers.get('x-forwarded-host') ?? headers.get('host')
if (host === null) {
return undefined
}
const protocol = headers.get('x-forwarded-proto')?.split(',')[0] ?? 'http'
return `${protocol}://${host}`
}
/**
* Uses the current route to determine the expected origin.
*
* @param request The current request
*/
const determineExpectedOrigin = (request: NextRequest): string => {
return new URL(
request.nextUrl.pathname === '/render'
? baseUrlFromEnvExtractor.extractBaseUrls().renderer
: baseUrlFromEnvExtractor.extractBaseUrls().editor
).origin
}