▼
Streaming live at 10am (PST)

Trouble with custom ajax call and trailing slash on https url

Design help Custom code
#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.png1706×858 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); }