diff --git a/.changeset/witty-books-jam.md b/.changeset/witty-books-jam.md new file mode 100644 index 00000000000..1757e1b16e1 --- /dev/null +++ b/.changeset/witty-books-jam.md @@ -0,0 +1,11 @@ +--- +'@clerk/clerk-sdk-node': patch +'@clerk/nextjs': patch +'@clerk/remix': patch +'@clerk/backend': patch +--- + +Allow `clerkJSVersion` to be passed when loading interstitial. Support for +- Nextjs +- Remix +- Node diff --git a/packages/backend/src/tokens/interstitial.ts b/packages/backend/src/tokens/interstitial.ts index 0956107cdbf..c6198262ab8 100644 --- a/packages/backend/src/tokens/interstitial.ts +++ b/packages/backend/src/tokens/interstitial.ts @@ -16,6 +16,11 @@ export type LoadInterstitialOptions = { apiUrl: string; frontendApi: string; publishableKey: string; + clerkJSUrl?: string; + clerkJSVersion?: string; + /** + * @deprecated + */ pkgVersion?: string; debugData?: DebugRequestSate; isSatellite?: boolean; @@ -47,6 +52,8 @@ export function loadInterstitialFromLocal(options: Omit { +const getScriptUrl = ( + frontendApi: string, + { pkgVersion, clerkJSVersion }: { pkgVersion?: string; clerkJSVersion?: string }, +) => { const noSchemeFrontendApi = frontendApi.replace(/http(s)?:\/\//, ''); const major = getClerkJsMajorVersionOrTag(frontendApi, pkgVersion); - return `https://${noSchemeFrontendApi}/npm/@clerk/clerk-js@${major}/dist/clerk.browser.js`; + return `https://${noSchemeFrontendApi}/npm/@clerk/clerk-js@${clerkJSVersion || major}/dist/clerk.browser.js`; }; diff --git a/packages/nextjs/src/server/__tests__/__snapshots__/exports.test.ts.snap b/packages/nextjs/src/server/__tests__/__snapshots__/exports.test.ts.snap index 7ed1eab59ea..a8a78d291d6 100644 --- a/packages/nextjs/src/server/__tests__/__snapshots__/exports.test.ts.snap +++ b/packages/nextjs/src/server/__tests__/__snapshots__/exports.test.ts.snap @@ -7,6 +7,8 @@ exports[`/server public exports should not include a breaking change 1`] = ` "API_VERSION", "AllowlistIdentifier", "AuthStatus", + "CLERK_JS_URL", + "CLERK_JS_VERSION", "Clerk", "Client", "DOMAIN", diff --git a/packages/nextjs/src/server/authenticateRequest.ts b/packages/nextjs/src/server/authenticateRequest.ts index 30e332f5bf4..05ff4e1c1e3 100644 --- a/packages/nextjs/src/server/authenticateRequest.ts +++ b/packages/nextjs/src/server/authenticateRequest.ts @@ -5,10 +5,11 @@ import { NextResponse } from 'next/server'; import type { RequestState } from './clerkClient'; import { API_KEY, + CLERK_JS_URL, + CLERK_JS_VERSION, clerkClient, debugRequestState, FRONTEND_API, - JS_VERSION, PUBLISHABLE_KEY, SECRET_KEY, } from './clerkClient'; @@ -56,10 +57,11 @@ export const handleInterstitialState = (requestState: RequestState, opts: WithAu clerkClient.localInterstitial({ frontendApi: opts.frontendApi || FRONTEND_API, publishableKey: opts.publishableKey || PUBLISHABLE_KEY, - pkgVersion: JS_VERSION, - proxyUrl: requestState.proxyUrl as any, + clerkJSUrl: CLERK_JS_URL, + clerkJSVersion: CLERK_JS_VERSION, + proxyUrl: requestState.proxyUrl, isSatellite: requestState.isSatellite, - domain: requestState.domain as any, + domain: requestState.domain, debugData: debugRequestState(requestState), signInUrl: requestState.signInUrl, }), diff --git a/packages/nextjs/src/server/clerkClient.ts b/packages/nextjs/src/server/clerkClient.ts index 3e4771fb0bc..97212bfc27d 100644 --- a/packages/nextjs/src/server/clerkClient.ts +++ b/packages/nextjs/src/server/clerkClient.ts @@ -1,6 +1,11 @@ import { Clerk } from '@clerk/backend'; +/** + * @deprecated + */ export const JS_VERSION = process.env.CLERK_JS_VERSION || ''; +export const CLERK_JS_VERSION = process.env.NEXT_PUBLIC_CLERK_JS_VERSION || ''; +export const CLERK_JS_URL = process.env.NEXT_PUBLIC_CLERK_JS || ''; export const API_URL = process.env.CLERK_API_URL || 'https://api.clerk.dev'; export const API_VERSION = process.env.CLERK_API_VERSION || 'v1'; export const API_KEY = process.env.CLERK_API_KEY || ''; diff --git a/packages/nextjs/src/server/withClerkMiddleware.ts b/packages/nextjs/src/server/withClerkMiddleware.ts index 2716d2f2d88..498fb1a0938 100644 --- a/packages/nextjs/src/server/withClerkMiddleware.ts +++ b/packages/nextjs/src/server/withClerkMiddleware.ts @@ -4,7 +4,16 @@ import type { NextMiddleware } from 'next/dist/server/web/types'; import type { NextFetchEvent, NextRequest } from 'next/server'; import { NextResponse } from 'next/server'; -import { API_KEY, API_URL, clerkClient, FRONTEND_API, JS_VERSION, PUBLISHABLE_KEY, SECRET_KEY } from './clerkClient'; +import { + API_KEY, + API_URL, + CLERK_JS_URL, + CLERK_JS_VERSION, + clerkClient, + FRONTEND_API, + PUBLISHABLE_KEY, + SECRET_KEY, +} from './clerkClient'; import type { WithAuthOptions } from './types'; import { decorateRequest, getCookie, handleMultiDomainAndProxy, setCustomAttributeOnRequest } from './utils'; @@ -71,7 +80,8 @@ export const withClerkMiddleware: WithClerkMiddleware = (...args: unknown[]) => apiUrl: API_URL, frontendApi: opts.frontendApi || FRONTEND_API, publishableKey: opts.publishableKey || PUBLISHABLE_KEY, - pkgVersion: JS_VERSION, + clerkJSUrl: CLERK_JS_URL, + clerkJSVersion: CLERK_JS_VERSION, proxyUrl: requestState.proxyUrl as any, isSatellite: requestState.isSatellite, domain: requestState.domain as any, diff --git a/packages/nextjs/src/ssr/withServerSideAuth.ts b/packages/nextjs/src/ssr/withServerSideAuth.ts index c2b6a830702..e6d710314fd 100644 --- a/packages/nextjs/src/ssr/withServerSideAuth.ts +++ b/packages/nextjs/src/ssr/withServerSideAuth.ts @@ -5,6 +5,8 @@ import type { GetServerSidePropsContext, GetServerSidePropsResult } from 'next'; import { API_URL, + CLERK_JS_URL, + CLERK_JS_VERSION, clerkClient, FRONTEND_API, JS_VERSION, @@ -63,6 +65,8 @@ export const withServerSideAuth: WithServerSideAuth = (cbOrOptions: any, options publishableKey: PUBLISHABLE_KEY, frontendApi: FRONTEND_API, pkgVersion: JS_VERSION, + clerkJSUrl: CLERK_JS_URL, + clerkJSVersion: CLERK_JS_VERSION, proxyUrl: requestState.proxyUrl as any, isSatellite: requestState.isSatellite, domain: requestState.domain as any, diff --git a/packages/nextjs/src/utils/mergeNextClerkPropsWithEnv.ts b/packages/nextjs/src/utils/mergeNextClerkPropsWithEnv.ts index 06aecd2d308..de7fb643256 100644 --- a/packages/nextjs/src/utils/mergeNextClerkPropsWithEnv.ts +++ b/packages/nextjs/src/utils/mergeNextClerkPropsWithEnv.ts @@ -6,6 +6,7 @@ export const mergeNextClerkPropsWithEnv = (props: Omit { @@ -66,6 +68,8 @@ export function ClerkProvider({ children, ...rest }: RemixClerkProviderProps): J domain={__domain as any} isSatellite={__isSatellite} signInUrl={__signInUrl} + clerkJSUrl={__clerkJSUrl} + clerkJSVersion={__clerkJSVersion} {...restProps} > {children} diff --git a/packages/remix/src/client/types.ts b/packages/remix/src/client/types.ts index 8901ac20db8..3a65a3c7fd0 100644 --- a/packages/remix/src/client/types.ts +++ b/packages/remix/src/client/types.ts @@ -12,6 +12,8 @@ export type ClerkState = { __isSatellite: boolean; __signInUrl: string | undefined; __clerk_debug: any; + __clerkJSUrl: string | undefined; + __clerkJSVersion: string | undefined; }; }; diff --git a/packages/remix/src/ssr/utils.ts b/packages/remix/src/ssr/utils.ts index 5f90cb378a9..cbc8c1bc4f6 100644 --- a/packages/remix/src/ssr/utils.ts +++ b/packages/remix/src/ssr/utils.ts @@ -3,6 +3,7 @@ import { constants, debugRequestState, loadInterstitialFromLocal } from '@clerk/ import { json } from '@remix-run/server-runtime'; import cookie from 'cookie'; +import { getEnvVariable } from '../utils'; import type { LoaderFunctionArgs, LoaderFunctionArgsWithAuth } from './types'; /** @@ -75,6 +76,10 @@ export const unknownResponse = (requestState: RequestState) => { }; export const interstitialJsonResponse = (requestState: RequestState, opts: { loader: 'root' | 'nested' }) => { + console.log('HEEEE', { + clerkJSUrl: getEnvVariable('CLERK_JS'), + clerkJSVersion: getEnvVariable('CLERK_JS_VERSION'), + }); return json( wrapWithClerkState({ __loader: opts.loader, @@ -84,6 +89,8 @@ export const interstitialJsonResponse = (requestState: RequestState, opts: { loa publishableKey: requestState.publishableKey, // TODO: This needs to be the version of clerk/remix not clerk/react // pkgVersion: LIB_VERSION, + clerkJSUrl: getEnvVariable('CLERK_JS'), + clerkJSVersion: getEnvVariable('CLERK_JS_VERSION'), proxyUrl: requestState.proxyUrl, isSatellite: requestState.isSatellite, domain: requestState.domain, @@ -108,6 +115,8 @@ export const injectRequestStateIntoResponse = async (response: Response, request __isSatellite: requestState.isSatellite, __signInUrl: requestState.signInUrl, __clerk_debug: debugRequestState(requestState), + __clerkJSUrl: getEnvVariable('CLERK_JS'), + __clerkJSVersion: getEnvVariable('CLERK_JS_VERSION'), }); // set the correct content-type header in case the user returned a `Response` directly // without setting the header, instead of using the `json()` helper diff --git a/packages/sdk-node/src/authenticateRequest.ts b/packages/sdk-node/src/authenticateRequest.ts index e612a875fd3..8eb37d4c9e7 100644 --- a/packages/sdk-node/src/authenticateRequest.ts +++ b/packages/sdk-node/src/authenticateRequest.ts @@ -20,6 +20,7 @@ export async function loadInterstitial({ clerkClient: ClerkClient; requestState: RequestState; }) { + const { clerkJSVersion, clerkJSUrl } = loadClientEnv(); /** * When publishable key or frontendApi is present utilize the localInterstitial method * and avoid the extra network call @@ -32,6 +33,8 @@ export async function loadInterstitial({ signInUrl: requestState.signInUrl, isSatellite: requestState.isSatellite, domain: requestState.domain, + clerkJSVersion, + clerkJSUrl, }); } return await clerkClient.remotePrivateInterstitial(); diff --git a/packages/sdk-node/src/clerkClient.ts b/packages/sdk-node/src/clerkClient.ts index 20bc5729cae..3b3e27a278e 100644 --- a/packages/sdk-node/src/clerkClient.ts +++ b/packages/sdk-node/src/clerkClient.ts @@ -8,6 +8,8 @@ export const loadClientEnv = () => { return { publishableKey: process.env.CLERK_PUBLISHABLE_KEY || '', frontendApi: process.env.CLERK_FRONTEND_API || '', + clerkJSUrl: process.env.CLERK_JS || '', + clerkJSVersion: process.env.CLERK_JS_VERSION || '', }; }; @@ -23,6 +25,7 @@ export const loadApiEnv = () => { isSatellite: process.env.CLERK_IS_SATELLITE === 'true', }; }; + /** * This needs to be a *named* function in order to support the older * new Clerk() syntax for v4 compatibility.