ansero_example.html 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. <html>
  2. <head>
  3. <title>Search</title>
  4. <style>
  5. body {
  6. background: #f0f0f0
  7. }
  8. input#what {
  9. width: 80%
  10. }
  11. span.srch_sect {
  12. color: #2f4f4f
  13. }
  14. a.srch_link {
  15. color: #4b0082
  16. }
  17. span.srch_url {
  18. color: #20b2aa
  19. }
  20. a[onclick] {
  21. cursor: pointer
  22. }
  23. </style>
  24. <script>
  25. // read API document
  26. let apiurl = '( API URL )/_/ansero.php';
  27. let favurl = '( API URL )/_/favicon.php?f=';
  28. let mylang = 'en-US'; // e.g. 'fr'
  29. let hide_domain = []; // e.g. ['google.com', 'google.fr']
  30. let hide_fqdn = []; // e.g. ['en.wikipedia.org']
  31. let removeMITMsites = false;
  32. function searchFor(key) {
  33. document.getElementById('what').value = key;
  34. search();
  35. }
  36. function search() {
  37. let answer = '',
  38. keyword = document.getElementById('what').value;
  39. if (keyword.length < 2) {
  40. return false;
  41. }
  42. fetch(apiurl, {
  43. method: 'POST',
  44. mode: 'cors',
  45. headers: {
  46. 'Content-Type': 'application/x-www-form-urlencoded'
  47. },
  48. body: 't=json' + (removeMITMsites ? '&m' : '') + '&l=' + mylang + '&q=' + encodeURI(keyword)
  49. }).then(r => r.json()).then(r => {
  50. if (r.info.desc != undefined) {
  51. answer += '<span class="srch_sect">';
  52. answer += '' + r.info.desc + '<br>';
  53. answer += '<a href="' + r.info.url + '" class="srch_link">' + r.info.title + '</a>';
  54. answer += '</span><br><br>';
  55. }
  56. if (r.sgst.length > 0) {
  57. answer += '<span class="srch_sect">Search other: <br>';
  58. r.sgst.forEach(x => {
  59. answer += '[<a class="srch_link" onclick="searchFor(\'' + x + '\');return false;">' + x + '</a>]<br>';
  60. });
  61. answer += '</span><br><br>';
  62. }
  63. if (r.crct.length > 0) {
  64. answer += '<span class="srch_sect">Maybe: ';
  65. answer += '[<a class="srch_link" onclick="searchFor(\'' + r.crct[0] + '\');return false;">' + r.crct[0] + '</a>]<br>';
  66. answer += '</span><br><br>';
  67. }
  68. r.res.forEach(x => {
  69. if (!hide_fqdn.includes(x.fqdn) && !hide_domain.includes(x.dom)) {
  70. answer += '<span class="srch_sect">';
  71. if (x.mitm == 0 && x.url.startsWith('https:')) {
  72. answer += '<img src="' + favurl + x.fqdn + '"> ';
  73. }
  74. answer += '<a href="' + x.url + '" class="srch_link">' + (x.mitm == 1 ? '[MITM!!] ' : '') + x.title + '</a><br>';
  75. answer += '' + x.desc + '<br>';
  76. answer += '<span class="srch_url">' + x.url + '</span></span>';
  77. answer += '<br><br>';
  78. }
  79. });
  80. document.getElementById('resultarea').innerHTML = answer;
  81. }).catch(e => console.log(e));
  82. return false;
  83. }
  84. </script>
  85. </head>
  86. <body>
  87. <form action="#" onsubmit="return search()">
  88. <input type="text" id="what" placeholder="Search for..." minlength="2" required>
  89. <input type="submit" value="Search">
  90. </form>
  91. <br>
  92. <br>
  93. <span id="resultarea"></span>
  94. </body>
  95. </html>