Checkout ui extension Failed With Shopify Document Guide

Topic summary

A developer is experiencing authentication issues when implementing a checkout UI extension following Shopify’s App Remix documentation.

Technical Problem:

  • Using the documented code results in OPTIONS 204 and GET 401 errors
  • The authenticate.public.checkout method fails with CORS (Cross-Origin Resource Sharing) errors showing “Missing Allow”
  • Standard CORS setup works without Shopify’s public validation, but not with it

Current Status:

  • The developer is uncertain if anyone has successfully implemented public.checkout() authentication
  • They’re questioning whether there’s an alternative approach to using Shopify’s app remix code
  • The issue appears to be a conflict between Shopify’s authentication requirements and CORS configuration

The discussion remains open with no resolution or responses yet.

Summarized with AI on November 14. AI used: claude-sonnet-4-5-20250929.

Using App Remix code failed. It will return OPTIONS 204 and GET 401. The code I use is the same like in app remix document

import { json } from "@remix-run/node";
import { authenticate } from "../shopify.server";

export const loader = async ({ request }) => {
  const { sessionToken, cors } = await authenticate.public.checkout(
    request
  );
    return cors(json({
        point: 500,
        covert_rate: 10,
    }));
};

Unsure if anyone be able to use public.checkout() successfully. It will return CORS Missing Allow.

If I setup CORS normally without using shopify public validate it will work. But is there anyway to use shopify app remix code?