try pulling an image even if docker login fails (#11360)

* try pulling an image even if docker login fails

* fixups

* Update .changeset/open-donkeys-behave.md

Co-authored-by: Edmund Hung <edmund@cloudflare.com>

---------

Co-authored-by: Edmund Hung <edmund@cloudflare.com>

Author: emily-shen

.changeset/open-donkeys-behave.md

@@ -0,0 +1,13 @@
+---
+"@cloudflare/vite-plugin": minor
+"@cloudflare/containers-shared": minor
+"wrangler": minor
+---
+
+Containers: Allow users to directly authenticate external image registries in local dev
+
+Previously, we always queried the API for stored registry credentials and used those to pull images. This means that if you are using an external registry (ECR, dockerhub) then you have to configure registry credentials remotely before running local dev.
+
+Now you can directly authenticate with your external registry provider (using `docker login` etc.), and Wrangler or Vite will be able to pull the image specified in the `contaienrs.image` field in your config file.
+
+The Cloudflare-managed registry (registry.cloudflare.com) currently still does not work with the Vite plugin.

packages/containers-shared/src/build.ts

@@ -5,12 +5,12 @@ import type {
 	BuildArgs,
 	ContainerDevOptions,
 	ImageURIConfig,
-	Logger,
+	WranglerLogger,
 } from "./types";
 
 export async function constructBuildCommand(
 	options: BuildArgs,
-	logger?: Logger
+	logger?: WranglerLogger
 ) {
 	const platform = options.platform ?? "linux/amd64";
 	const buildCmd = [

packages/containers-shared/src/client/core/OpenAPI.ts

@@ -1,6 +1,6 @@
 /* istanbul ignore file */
 /* tslint:disable */
-import type { Logger } from "../../types";
+import type { WranglerLogger } from "../../types";
 import type { ApiRequestOptions } from "./ApiRequestOptions";
 
 type Resolver<T> = (options: ApiRequestOptions) => Promise<T>;
@@ -16,7 +16,7 @@ export type OpenAPIConfig = {
 	PASSWORD?: string | Resolver<string>;
 	HEADERS?: Headers | Resolver<Headers>;
 	ENCODE_PATH?: (path: string) => string;
-	LOGGER?: Logger | undefined;
+	LOGGER?: WranglerLogger | undefined;
 };
 
 export const OpenAPI: OpenAPIConfig = {

packages/containers-shared/src/images.ts

@@ -10,14 +10,45 @@ import {
 	runDockerCmd,
 	verifyDockerInstalled,
 } from "./utils";
-import type { ContainerDevOptions, DockerfileConfig } from "./types";
+import type {
+	ContainerDevOptions,
+	DockerfileConfig,
+	ViteLogger,
+	WranglerLogger,
+} from "./types";
 
 export async function pullImage(
 	dockerPath: string,
-	options: Exclude<ContainerDevOptions, DockerfileConfig>
+	options: Exclude<ContainerDevOptions, DockerfileConfig>,
+	logger: WranglerLogger | ViteLogger,
+	isVite: boolean
 ): Promise<{ abort: () => void; ready: Promise<void> }> {
 	const domain = new URL(`http://${options.image_uri}`).hostname;
-	await dockerLoginImageRegistry(dockerPath, domain);
+
+	const isExternalRegistry = domain !== getCloudflareContainerRegistry();
+	try {
+		// this will fail in two cases:
+		// 1. this is being called from the vite plugin (doesn't have the appropriate auth context)
+		// 2. the user has not run `wrangler containers registries configure` yet to set up credentials
+		await dockerLoginImageRegistry(dockerPath, domain);
+	} catch (e) {
+		if (!isExternalRegistry) {
+			if (isVite) {
+				throw new UserError(
+					`Using images from the Cloudflare-managed registry is not currently supported with the Vite plugin.\n` +
+						`You should use a Dockerfile or a supported external registry and authenticate to that registry separately using \`docker login\` or similar.\n` +
+						`Supported external registries are currently: ${Object.values(ExternalRegistryKind).join(", ")}.`
+				);
+			}
+			throw e;
+		}
+		logger?.warn(
+			"Unable to retrieve configured registry credentials from Cloudflare." +
+				"\nUnless this is a public image, you will need to run `wrangler containers registries configure` before deploying." +
+				"\nAttempting to pull image anyway..."
+		);
+	}
+
 	const pull = runDockerCmd(dockerPath, [
 		"pull",
 		options.image_uri,
@@ -64,7 +95,9 @@ export async function prepareContainerImagesForDev(args: {
 	onContainerImagePreparationEnd: (args: {
 		containerOptions: ContainerDevOptions;
 	}) => void;
-}) {
+	logger: WranglerLogger | ViteLogger;
+	isVite: boolean;
+}): Promise<void> {
 	const {
 		dockerPath,
 		containerOptions,
@@ -94,7 +127,12 @@ export async function prepareContainerImagesForDev(args: {
 				containerOptions: options,
 			});
 		} else {
-			const pull = await pullImage(dockerPath, options);
+			const pull = await pullImage(
+				dockerPath,
+				options,
+				args.logger,
+				args.isVite
+			);
 			onContainerImagePreparationStart({
 				containerOptions: options,
 				abort: () => {

packages/containers-shared/src/types.ts

@@ -5,14 +5,19 @@ import type {
 } from "./client";
 import type { ApplicationAffinityHardwareGeneration } from "./client/models/ApplicationAffinityHardwareGeneration";
 
-export interface Logger {
+export interface WranglerLogger {
 	debug: (...args: unknown[]) => void;
 	debugWithSanitization: (label: string, ...args: unknown[]) => void;
 	log: (...args: unknown[]) => void;
 	info: (...args: unknown[]) => void;
 	warn: (...args: unknown[]) => void;
 	error: (...args: unknown[]) => void;
 }
+export interface ViteLogger {
+	info: (msg: string) => void;
+	warn: (msg: string) => void;
+	error: (msg: string) => void;
+}
 
 export type BuildArgs = {
 	/** image tag in the format `name:tag`, where tag is optional */

packages/vite-plugin-cloudflare/src/plugins/dev.ts

@@ -206,6 +206,8 @@ export const devPlugin = createPlugin("dev", (ctx) => {
 						containerOptions: [...containerTagToOptionsMap.values()],
 						onContainerImagePreparationStart: () => {},
 						onContainerImagePreparationEnd: () => {},
+						logger: viteDevServer.config.logger,
+						isVite: true,
 					});
 
 					containerImageTags = new Set(containerTagToOptionsMap.keys());

packages/vite-plugin-cloudflare/src/plugins/preview.ts

@@ -47,6 +47,8 @@ export const previewPlugin = createPlugin("preview", (ctx) => {
 					containerOptions: [...containerTagToOptionsMap.values()],
 					onContainerImagePreparationStart: () => {},
 					onContainerImagePreparationEnd: () => {},
+					logger: vitePreviewServer.config.logger,
+					isVite: true,
 				});
 
 				const containerImageTags = new Set(containerTagToOptionsMap.keys());

packages/wrangler/src/api/startDevWorker/LocalRuntimeController.ts

@@ -273,6 +273,8 @@ export class LocalRuntimeController extends RuntimeController {
 					onContainerImagePreparationEnd: () => {
 						this.containerBeingBuilt = undefined;
 					},
+					logger: logger,
+					isVite: false,
 				});
 				if (this.containerBeingBuilt) {
 					this.containerBeingBuilt.abortRequested = false;

packages/wrangler/src/api/startDevWorker/MultiworkerRuntimeController.ts

@@ -169,6 +169,8 @@ export class MultiworkerRuntimeController extends LocalRuntimeController {
 					onContainerImagePreparationEnd: () => {
 						this.containerBeingBuilt = undefined;
 					},
+					logger: logger,
+					isVite: false,
 				});
 				if (this.containerBeingBuilt) {
 					this.containerBeingBuilt.abortRequested = false;