Hello @Dineshwar ,
When you use fetch to call an API that responds with a 303, the browser automatically follows the redirect behind the scenes, but it doesn’t actually change the URL in the address bar—that’s why you’re not seeing a redirect.
If you want to redirect the customer’s browser, you’ll need to explicitly set window.location.href to the target URL. One way to do this is to make your API call with fetch, get the redirect URL from the response, and then manually set the window location.
For example, if your API returns a JSON response with the redirect URL, you could do something like:
analytics.subscribe(“checkout_completed”, event => {
const urlStr = ‘https://shopify.mywebsite.com/v1/redirectpayment/’;
const url = new URL(urlStr);
const params = url.searchParams;
params.append(“id”, orderId);
fetch(url.toString())
.then(response => response.json())
.then(data => {
// Assuming your API sends back { redirectUrl: “https://targeturl.com” }
if (data.redirectUrl) {
window.location.href = data.redirectUrl;
} else {
console.error(“No redirectUrl in response:”, data);
}
})
.catch(error => {
console.error(“Error fetching redirect URL:”, error);
});
});
If your API doesn’t return JSON and you’re simply getting a 303, you can’t rely on fetch alone to redirect the browser—you must capture the redirect URL and then set window.location.href manually.
Hope that helps clear things up!
Best,
Tracy from Kudosi Reviews