ios – fecth API can not load as a consequence of entry management checks when downloading a json file

I’ve a Nextjs 14 software and the requests are made on the identical origin. I expertise some odd habits when downloading json information in safari(IOS). I’m utilizing swr and it re-fetches routinely when the obtain is beginning. Requests made by swr fail with this error:

Fetch API can not load url as a consequence of entry management checks.

That is the fetcher utilized by swr:

export const fetcher = async (...args: Parameters) => {
    attempt {
        console.log("DEBUG_A");
        const response = await fetchWithNoCache(...args);
        console.log("DEBUG_B", {standing: response.standing, okay: response.okay});
        if ( !response.okay ) {
            let errorMessage = Dictionary.failedToFetchData;

            attempt {
                errorMessage = (await response.json()).consequence;
            } catch (error) {
                console.log("DEBUG_C", {error});
            }
            throw new CustomHttpRequestError(errorMessage);
        }
        console.log("DEBUG_D");
        return response.json();
    } catch (error) {
        console.log("DEBUG_E", error);
        throw error;
    }
}

export const fetchWithNoCache = (...args: Parameters) => {
    let [url, options] = args;
    console.log("DEBUG_1", {url, choices});
    const headers = choices?.headers ?? {};
    choices = {
        ...choices,
        cache: 'no-cache',
        headers: {
            ...headers,
        }
    };
    console.log("DEBUG_2");
    return fetch(url, choices);
}

That is the Subsequent.js route handler:

export async perform GET(request: Request, { params }: { params: { id: string } }) {
    const session = await validateRequest();
    if ( !session.legitimate ) {
        return new NextResponse(null, { standing: 401 });
    }
    const { id } = params;
    attempt {
        const service = createStyleService('route:types');
        const information = await service.get(id);
        const filename = createStyleFilename(information, 'json')
        const stream = createReadableStreamFromJSON(JSON.parse(information.data_draft));
        return new Response(stream, {
          standing: 200,
          headers: new Headers({
            "content-disposition": `attachment; filename=${filename}`,
            "content-type": 'software/json',
            "cache-control": "no-store, no-cache, must-revalidate",
            "pragma": "no-cache",
        })});
    } catch (error: any) {
        const standing = (error instanceof InvalidInputError) ? 400 : 500;
        return new Response(null, { standing });
    }
}

The code used to fetch the info contained in the element:

const { information, error, isLoading } = useSWR(getStylesUrl(), fetcher);

    useEffect(() => {
        if (error) {
            console.log('error', error)

            ...
        }
    }, [error])

The obtain is carried out when clicking on an html aspect:

    Obtain JSON

The problem solely seems when downloading JSONs on Safari (IOS). Different file codecs don’t trigger the fetch requests carried out by swr to fail. I’ve tried to change the requests headers, however I feel it is perhaps associated to how safari handles JSON downloads on IOS.
How can I repair these requests?

From the logs you may see how the requests fail the primary time however the second time they work, in all probability when the obtain is completed: