All geek questions in one place

How do they do it? Modal bookmarklet and instant cleansing?

I want the user to open a popup from the bookmarklet, but the page loads as a jquery modal, which means there are no ugly browser borders.

See an example here, how does Amazon do this?

http://www.amazon.co.uk/wishlist/get-button

In addition, they obviously clear the page to get information, but the page loading is almost instantaneous, do they cache every page that the user somehow reads? How else will they achieve this? I tried simple-html-dom, but this is far from instant

This is using Amazon JS:

javascript:(function(){var w=window,l=w.location,d=w.document,s=d.createElement('script'),e=encodeURIComponent,o='object',n='AUWLBookenGB',u='https://www.amazon.co.uk/wishlist/add',r='readyState',T=setTimeout,a='setAttribute',g=function(){d[r]&&d[r]!='complete'?T(g,200):!w[n]?(s[a]('charset','UTF-8'),s[a]('src',u+'.js?loc='+e(l)+'&b='+n),d.body.appendChild(s),f()):f()},f=function(){!w[n]?T(f,200):w[n].showPopover()};typeof s!=o?l.href=u+'?u='+e(l)+'&t='+e(d.title):g()}())

Decorated and manually deobfused:

 javascript:(function() { var w = window, l = w.location, d = w.document, s = d.createElement('script'), e = encodeURIComponent, o = 'object', n = 'AUWLBookenGB', u = 'https://www.amazon.co.uk/wishlist/add', r = 'readyState', T = setTimeout, a = 'setAttribute', g = function() { if (d[r] && d[r] != 'complete') { T(g, 200); } else if(!w[n]) { s[a]('charset', 'UTF-8'); s[a]('src', u + '.js?loc=' + e(l) + '&b=' + n); d.body.appendChild(s); f(); } else { f(); } }, f = function() { if (!w[n]) { T(f, 200); } else { w[n].showPopover(); } }; if (typeof s != o) { l.href = u + '?u=' + e(l) + '&t=' + e(d.title); } else { g(); } }())
+4
source share
3 answers

I have a little de-confusing code, see post questions.

The script requests a script from the amazon website with the following URL:

 https://www.amazon.co.uk/wishlist/add.js?loc=<CURRENT URL>&b=AUWLBookenGB

Inside the response code ( add.js example ), the <table> element is dynamically created and populated, and then inserted into the page.

The "magic" happens on the server side where the script is generated. All necessary data is supplied with an embedded JS file.

+1
source

This javascript code creates a <script> to load the js file (needed to create a popup wish list) on the page you are on.

 http://www.amazon.co.uk/wishlist/add.js?loc=your-page-url&b=AUWLBookenGB:1703

The above URL does not take much time to upload the js file to the page, which ultimately creates a popup. Finally, it hits the Amazon server to load the popup dynamically by visiting the following URL.

 https://www.amazon.co.uk/wishlist/add?u=your-page-url&t=your-page-title

The secret is how fast you can download the content you need to create a popup so that it loads instantly.

+1
source

This code is a little hard to read, but this is basically what it does:

  • create <script> in the current document (the page you are currently viewing) and set the source for it https://www.amazon.co.uk/wishlist/add.js

  • The script executes and actually creates an AUWLBookenGB object for the global scope

  • then the showPopover(); method showPopover(); runs with w[n].showPopover(); which actually matches `window.AUWLBookenGB.showPopover ();

The showPopover() method is responsible for displaying a popup window.

0
source

Source: https://habr.com/ru/post/1398467/

More articles:


All Articles