▼
Streaming live at 10am (PST)

Trouble with custom ajax call and trailing slash on https url

#1

Hi, first time posting!

We've created a little search feature for our client (inhaus.webflow.io), and for some reason, when we switched all of the urls to HTTPS, we ran into the following issue:

Mixed Content: The page at 'https://inhaus.webflow.io/product-category/laminate' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://inhaus.webflow.io/search-results'. This request has been blocked; the content must be served over HTTPS.

Our JS has the following, and works perfectly fine if served over HTTP:

function getSearchableItems(callback) {
$.ajax({
url: 'https://inhaus.webflow.io/search-results/',
type: 'get',
success: function(data) {
$(data).find('.w-dyn-item [data-href]').toArray().forEach(function(item) {
searchableProducts.push($(item).attr('id').replace('-',' '));
searchableProductsInfo[$(item).attr('id')] = item;
});
callback();
}
});
}

Any ideas would be highly appreciated, unfortunately I need to use HTTPS for various other reasons.

#2

@DigitalPanda Looks like you found a bug - we're looking into it!

In the meantime, try this small change - remove the trailing slash in your url setting, so it should be something like this:

url: 'https://inhaus.webflow.io/search-results',

Let us know if that works...

#3

@callmevlad Оппа, спасибо!

thanks for the quick reply.

#4
#5

@callmevlad just wondering if you had an etr for this?

Also, does unlisted mean that the problem is in development?

thanks,

Илья

#6
#7

Oops, I accidentally marked as unlisted while trying to change the category :grimacing:

We're working on a fix, but no ETA yet.

#8

lol ok thanks. want to make sure that I am meeting my client expectations.

#9

Curious though - your last message indicated that removing the trailing slash / fixed the issue for you (or at least from what I inferred from the Russian portion :stuck_out_tongue:) - can you confirm that is indeed the case?

#10

unfortunately not, i was just elated that my ability to find the weirdest bugs in software is still strong.

#11

@DigitalPanda I think that particular HTTPS -> HTTP redirect issue is resolved when you remove the trailing slash, since I'm seeing requests complete fine in DevTools:

image.png1706x858 145 KB

I'm not quite sure that the entire response can be wrapped in jQuery like that and traversed - so I suspect it might be a bug in how you're handling the response once it comes back.

#12

Its now working after we updated the wrapper to:

function getSearchableItems(callback) {
var data = null;
var xhr = new XMLHttpRequest();
xhr.withCredentials = true;
xhr.addEventListener("readystatechange", function () {
if (this.readyState === 4) {
$(this.responseText).find('.w-dyn-item [data-href]').toArray().forEach(function(item) {
searchableProducts.push($(item).attr('id').replace('-',' '));
searchableProductsInfo[$(item).attr('id')] = item;
});
callback();
}
});
xhr.open("GET", "https://inhaus.webflow.io/search-results");
xhr.send(data);
}