400 (Bad Request) for Http Post requests to Proxy App?

Technical Q&A
1

I had these proxy apps functioning properly last year, however with the following setup I keep getting Bad Request errors:

$.ajax({
type: 'POST',
url: 'https://my-shopify-domain.com/apps/member-area?handler=UpdateCollectorInfo',
headers: {
'X-Shopify-Access-Token': accessToken,
'Content-Type': 'application/json'
},
data: JSON.stringify(formData),
success: function (response) {
if (response.success) {
$('#UserFeedbackMessage').text(response.message).css('color', 'green').show();
} else {
$('#UserFeedbackMessage').text(response.message).css('color', 'red').show();
}
},
error: function (xhr, status, error) {
console.error("Error updating collector info:", error);
console.log("XHR:", xhr);
console.log("Status:", status);
console.log("Response Text:", xhr.responseText);
$('#UserFeedbackMessage').text("An error occurred while updating your profile.").css('color', 'red').show();
}
});

I have been trying to resolve this for weeks, and for some reason I have yet to find a solution in the forums, docs, or youtube.

2

I don’t know if it’s relevant to your specific testing, but I discovered today that the App Proxy subpath cannot be updated for existing installations of the app. Once you install an app, you lock the subpath of the app proxy, meaning that if you then change that in the Partners App Dashboard, it only works for new installs. I mention it because I was getting a lot of 400 Bad Request responses until I reinstalled my test app.

I also posted this response to your Stack Overflow question in case you see it there.