如何使用 DuckDuckGo 的搜索自动完成建议

我正在将我的个人搜索建议从 google 转移到 duckduckgo,但我缺少一些简单的方法来让它发挥作用。我正在使用jQuery-UI 的自动完成框架

我的搜索表单

<form action="https://duckduckgo.com/?q=" method="post" id="search">

    <input type="text" name="query" value="" autocomplete="off">

    <button type="submit">Search</button>

</form>

我的查询


$( "#search input[type=text]" ).autocomplete(

{

    delay: 0,

    minLength: 1,

    position: { my: "left top-3" },

    source: function( request, response )

    {

     // var suggestURL = "https://www.google.com/complete/search?client=firefox&q=%QUERY";

        var suggestURL = "https://duckduckgo.com/ac/?q=%QUERY&type=list";


        suggestURL = suggestURL.replace( "%QUERY", request.term );


        $.ajax({

            method: "GET",

            dataType: "jsonp",

            jsonpCallback: "jsonCallback",

            url: suggestURL,

            success: function( data )

            {

                response( data[1] );

            },

            error: function( jqXHR, textStatus, errorThrown )

            {

                console.log( textStatus, errorThrown );

            }

    }

});

对 google 的查询返回:


https://suggestqueries.google.com/complete/search?client=firefox&q=foobar&callback=jsonCallback&_=1600956954436


jsonCallback && jsonCallback(["foobar",["foobar","foobar meaning","foobar google","foobar challenge","foobar2000 skins","foobar2k","foobar2000 themes","foobar2000 download","foobar2000 mac","foobar themes"],[],{"google:suggestsubtypes":[[433],[],[],[],[],[],[],[],[],[]]}])

对 duckduckgo 的查询返回:


https://ac.duckduckgo.com/ac/?q=foobar&type=list&callback=jsonCallback&_=1600956892202


["foobar",["foobar2000","foobar","foobar2000 download","foobar ape","foobar2000 layout","foobar2000 decoder","foobar2000 tak","foobar2000 dsp"]]

两者之间的区别似乎jsonCallback && jsonCallback([data])包含在谷歌查询中,我不明白为什么它们不同或如何解决。


编辑 1


向 js 添加一些错误处理后,我得到的错误是:


parsererror Error: jsonCallback was not called

编辑 2


在深入研究之后,我认为 DDG 的服务器不允许这样做。据我了解,他们的服务器需要发送适当的响应,但我认为他们没有这样做。


小怪兽爱吃肉
浏览 220回答 2
2回答

慕森王

请参阅: https:&nbsp;//duckduckgo.com/api要自己使用它,您可以使用下面列出的语言库之一,或者简单地将“&format=json”(或 xml,如果您愿意)添加到 api 子域中的任何查询 URL,例如https://api.duckduckgo.com/?q=DuckDuckGo&format=json以下是使用要求:在您使用我们的 API 的每个地方为我们和任何潜在来源注明出处。对于来源,您可以链接到来源的相关详细信息页面。对于我们,您可以使用我们的徽标说出来自 DuckDuckGo 的结果(并链接到特定结果页面)。非商业用途,除非您获得我们的电子邮件批准(尽管我们通常可以接受任何不粗略的内容)。使用描述性 t 参数,即将 &t=nameofapp 附加到您的请求中。我们的总体目标是让更多人使用 DuckDuckGo,所以请记住这一点。q: queryformat: output format (json or xml)If format=='json', you can also pass:callback: function to callback (JSONP format)这适用于 JSONP:https ://jsfiddle.net/Twisty/rqdtv9sn/86/这里的问题是,这些不是建议,而且这些建议的 URL&nbsp;https://ac.duckduckgo.com/ac/不想与 CORS 很好地配合。您可以使用 FETCH API 绕过它,但即使请求失败或无法解析,这也只是继续执行 Promise。因此,在 DDG 提供 Suggestion API 之前,您多半是运气不好。此处讨论了一些潜在的其他选项:https ://www.sitepoint.com/jsonp-examples/var script = $("<script />", {&nbsp; &nbsp; src: "https://ac.duckduckgo.com/ac/?q=" + req.term,&nbsp; &nbsp; type: "application/json"&nbsp; });虽然这行得通,但对我们帮助不大,因为我们无法获取其中包含的数据。示例: https:&nbsp;//jsfiddle.net/Twisty/rqdtv9sn/89/浏览器显示响应,但随后您收到解析错误。

MMTTMM

这适用于任何想要使用jQueryUI 的自动完成框架在其服务器上设置 DuckDuckGo 的搜索自动完成建议的人。默认情况下,您不允许使用 JavaScript 跨域抓取/获取数据,因此我不得不在我的服务器上创建一个代理文件来绕过这些限制。在这种情况下,我的挂断是如果您在请求中传递某些变量,谷歌的搜索自动完成建议服务器明确允许这些 CORS 违规。这是让 DuckDuckGo 的搜索自动完成建议在我的网页上运行的代码:索引.php<form action="https://duckduckgo.com/?q=" method="post" id="search">&nbsp; &nbsp; <input type="text" name="query" value="" autocomplete="off">&nbsp; &nbsp; <button type="submit">Search</button></form>javascript.js$( "#search input[type=text]" ).autocomplete({&nbsp; &nbsp; delay: 0,&nbsp; &nbsp; minLength: 1,&nbsp; &nbsp; position: { my: "left top-3" },&nbsp; &nbsp; source: function( request, response )&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; var suggestURL = "https://www.example.com/proxy-duckduckgo.php?q=%QUERY";&nbsp; &nbsp; &nbsp; &nbsp; suggestURL = suggestURL.replace( "%QUERY", request.term );&nbsp; &nbsp; &nbsp; &nbsp; suggestURL = suggestURL.replace( / /g, "+" )&nbsp; &nbsp; &nbsp; &nbsp; $.ajax({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; method: "GET",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; dataType: "json",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; url: suggestURL,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; success: function( data )&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;response( data[1] );&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; error: function( jqXHR, textStatus, errorThrown )&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log( textStatus, errorThrown );&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; }});代理-duckduckgo.php<?php$query = isset( $_GET['q'] ) ? str_replace( ' ', '+', $_GET['q'] ) : 'example';$url = 'https://duckduckgo.com/ac/?q='.$query.'&type=list';$ch = curl_init();curl_setopt( $ch, CURLOPT_URL, $url );curl_setopt( $ch, CURLOPT_RETURNTRANSFER, TRUE );curl_setopt( $ch, CURLOPT_IPRESOLVE, CURL_IPRESOLVE_V4 );$html = curl_exec( $ch );curl_close( $ch );echo $html;
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript