跨域请求获取Solr json检索结果并高亮显示

  Solr提供了json格式的检索结果,然而在跨域的情况下如何调用呢?我们可以利用jquery提供的jsonp的方式获取Solr检索结果。

<script type="text/javascript" src="./resources/js/jquery-1.8.2.min.js"></script>
    <input type="text" size="50" value="" id="keyword" name="keyword" />
    <input type="button" value="搜索" id="search" />
    <div id="result"></div>
    <script type="text/javascript">
        $("#search").click(function() {
            var keyword = $("#keyword").val();
            var solrServer = "http://localhost:8080/solr/solrfirstcore/select";
            $.ajax({
                type : "get",
                url : solrServer,
                data : {
                    wt : "json",
                    q : "search_item:" + keyword,
                    indent : true,
                    "json.wrf" : ‘callback‘,
                    "hl" : "true",
                    "hl.fl" : "title, summary",
                    "hl.simple.pre" : "<font color=\"red\">",
                    "hl.simple.post" : "</font>",
                    "start":"0",
                    "rows":"20"
                },
                dataType : "jsonp",
                //jsonp : "callback",
                jsonpCallback : "callback",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名
                error : function() {
                    $("#result").html("<font color=\"red\">没有您要查询的结果。</font>");
                }
            });
        });

        function callback(data) {
            var responseHeader = data.responseHeader;
            var response = data.response;
            var highlighting = data.highlighting;
            var docs = response.docs;
            var result = new Array();
            result.push("结果数:" + response.numFound + "条,耗时:"
                    + responseHeader.QTime / 1000 + "秒");
            var hlString = "";
            for ( var index in docs) {
                var doc = docs[index];
                var docid = doc.id;
                hl_string = "【ID】:" + doc.id;
                var hdoc = highlighting[docid];
                var title = doc.title;
                var summary = doc.summary;
                if(hdoc.title){
                    title = hdoc.title;
                }
                if(hdoc.summary){
                    summary = hdoc.summary;
                }
                hl_string += ", 【标题】:" + title + ", 【描述】:" + summary;

                result.push("------------------------------------------------------------");
                result.push(hl_string);
            }

            $("#result").html("</br>" + result.join("</br>"));
        }
    </script>
时间: 2024-10-08 13:11:42

跨域请求获取Solr json检索结果并高亮显示的相关文章

ajax跨域请求获取jsonp数据

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><script src="jquery.js"></script><script type="text/javascript">function getIntface(){ //?

jQuery使用ajax跨域请求获取数据

跨域是我在日常面试中经常会问到的问题,这词在前端界出现的频率不低,主要原因还是由于安全限制(同源策略, 即JavaScript或Cookie只能访问同域下的内容),因为我们在日常的项目开发时会不可避免的需要进行跨域操作,所以跨域能力也算是前端工程师的基本功之一. var webMethod = "http://localhost:54473/Service1.asmx/HelloWorld"; jQuery.support.cors = true; //之前没有加这句老是提示no tr

Ajax 跨域请求 jsonp获取json数据

遇到Ajax的跨域请求出问题 找了中解决办法如下: 参考内容:http://justcoding.iteye.com/blog/1366102 由于受到浏览器的限制,该方法不允许跨域通信.如果尝试从不同的域请求数据,会出现安全错误.如果能控制数 据驻留的远程服务器并且每个请求都前往同一域,就可以避免这些安全错误.但是,如果仅停留在自己的服务器上,Web 应用程序还有什么用处呢?如果需要从多个第三方服务器收集数据时,又该怎么办? 理解同源策略 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的

AJAX 跨域请求的解决办法:使用 JSONP获取JSON数据

由于受到浏览器的限制,ajax不允许跨域通信.如果尝试从不同的域请求数据,会出现安全错误.如果能控制数据驻留的远程服务器并且每个请求都前往同一域,就可以避免这些安全错误.但是,如果仅停留在自己的服务器上,Web 应用程序还有什么用处呢?如果需要从多个第三方服务器收集数据时,又该怎么办? 理解同源策略限制 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的文档属性.也就是说,受到请求的 URL 的域必须与当前 Web 页面的域相同.这意味着浏览器隔离来自不同源的内容,以防止它们之间的操作.这个

AJAX跨域请求json数据的实现方法

这篇文章介绍了AJAX跨域请求json数据的实现方法,有需要的朋友可以参考一下 我们都知道,AJAX的一大限制是不允许跨域请求. 不过通过使用JSONP来实现.JSONP是一种通过脚本标记注入的方式,它是可以引用跨域URL的js脚本,不过需要提供一个回调函数(必须在您自己的页面上),因此,你可以自己处理结果. 让我们看看JSONP的是怎么在jQuery,MooTools的,Dojo Toolkit中实现的. jQuery的JSONPjQuery.getJSON方法:Js代码 jQuery.get

jQuery $.ajax跨域-JSONP获取JSON数据(转载)

Asynchronous JavaScript and XML (Ajax ) 是驱动新一代 Web 站点(流行术语为 Web 2.0 站点)的关键技术.Ajax 允许在不干扰 Web 应用程序的显示和行为的情况下在后台进行数据检索.使用 XMLHttpRequest 函数获取数据,它是一种 API,允许客户端 JavaScript 通过 HTTP 连接到远程服务器.Ajax 也是许多 mashup 的驱动力,它可将来自多个地方的内容集成为单一 Web 应用程序. 不过,由于受到浏览器的限制,该

JSON跨域请求

轻松搞定JSONP跨域请求 一.同源策略 要理解跨域,先要了解一下"同源策略".所谓同源是指,域名,协议,端口相同.所谓"同源策略",简单的说就是基于安全考虑,当前域不能访问其他域的东西. 一些常见的是否同源示例可参照下表: 在同源策略下,在某个服务器下的页面是无法获取到该服务器以外的数据的.例如我们在自己的网站通过ajax去获取豆瓣上https://developers.douban.com/wiki/?title=api_v2提供的接口数据.这里我们以搜索图书为

在vue中使用axios实现跨域请求并且设置返回的数据的格式是json格式,不是jsonp格式

在vue中使用axios实现跨域请求 需求分析:在项目中需要抓取qq音乐的歌曲列表的数据,由于要请求数据的地址url=https://c.y.qq.com/splcloud/fcgi-bin/fcg_get_diss_by_tag.fcg.从qq音乐的官网上可以看到该请求的请求头中的referer中的域名是y.qq.com(发送请求页面的域名),而host的域名是c.y.qq.com(被请求页面的域名),由于两者不一样,所以不能通过前端直接发送请求给qq服务器去拿数据.这时候需要服务器做一个代理

.Net Core 3.0 Api json web token 中间件签权验证和 CORS 中间件处理跨域请求

第一步:在Nuget上安装"Microsoft.AspNet.WebApi.Cors"包,并对api controller使用[EnableCors]特性以及Microsoft.AspNetCore.Authentication.JwtBearer包 第二步:创建.netcore API项目 /控制器:AuthenticateController using System; using System.Collections.Generic; using System.Linq; usi