允许我的网站的消费者将动态数据合并到他们的网站的最佳技术

时间:2009-02-15 12:31:37

标签: javascript

我要问的是,将我在我的网站上提供的数据消费/整合到他们自己的网站中的最佳方式(即新手网络开发人员最简单的方式)是什么。

我有一个用asp.net/sql server后端编写的网站。

我的客户希望能够将选择的数据(例如数据表和一些长度不同且每个用户不同的图像)合并到他们的网站中,以便数据看起来像它属于他们,并由他们打上烙印(理想情况下,数据会以默认的css格式传递给他们,但他们可以根据需要自定义)。当我网站上的数据发生变化时,他们网站上的数据需要更改。

我希望我的数据用户能够访问我的网站,登录,然后能够从我的网站“复制”自定义脚本/代码,将其粘贴到他们的网站中,然后让它工作,无论如何他们的网站是用什么编写的(即纯HTML,php,asp.net或其他)。

我假设某种javascript脚本是最好的方法,但我不知道如何让用户完全简单以及脚本可能包含的内容(javascript不是我强大的)点)。即我可以在客户网站上获取javascript,在我的服务器上调用asp.net脚本,然后将HTML流回到他们的网站..

我确信在其他地方必须有这样做的例子,有人能指出我正确的方向吗?

编辑:让我试着更好地举例说明我要做的事情

我的应用程序不是一个房地产应用程序,但我们假设它(假装realtor.com是MLS数据库)。现在这个国家的每个房地产经纪人都有他们自己的网站,他们用各种语言编写,所以我不能假设数据的消费者,也不能假设他们有任何编程专业知识。

如果我是realtor.com的所有者,我希望每个房地产经纪人能够来到我的网站,复制一段代码(就像我说的,也许是一些javascript,但我不确定),回到他们的网站并将其粘贴到他们的页面来源,然后当他们的一个用户访问“Joesrealty.com”并点击“显示所有待售物业”时,脚本/代码/页面实际上会通过执行从我的网站下载html在我的网站(realtor.com)上的东西,并检索该代理商有待出售的所有属性的列表(如附带图片的表格)。

我知道我在一个大牌网站上看到了一个伟大的实现,但是对于我的生活,我不记得我在哪里看到它,并且从来没有想过要去尝试看看他们使用了什么技术。 / p>

5 个答案:

答案 0 :(得分:5)

  

我的客户希望能够将选择的数据(...)合并到他们的网站中,以便数据看起来像属于他们,并且由他们打上品牌

许多网站都通过javascript代码片段提供此功能,例如: TechnicalJobs.ie

用户将一些javascript代码粘贴到他们的页面中。此代码回调您的网站以提取最新数据,然后将其显示在客户的网站上。

示例

我们可以发回一个没有样式的新小部件列表,并允许用户设置CSS样式以调整其网站上的显示。

在您的页面上,告诉用户将以下javascript复制到他们的页面中:

<script src="http://www.yoursite.com/widgets.asp?action=getNewWidgets"
   type="text/javascript"></script>

<script type="text/javascript">
   showWidgets('widget-container', 'widget-list');
</script>

在您的网站上,widgets.asp将负责从您的数据库中查找有关新窗口小部件的数据。它会将数据拉到一起,然后以JSON-encoded格式输出。逻辑全部用ASP或您选择的语言处理,并以下面列出的格式输出。 此页面还将返回showWidgets方法,该方法处理转换数据以在用户网站上显示。

widgets.asp的最终输出应该类似于:

// Widget product data 
var widgets = [
     {
       "url":"http:\/\/www.yoursite.com\/widgets\/foo-widget",
       "title":"Brand new Foo Widget, available now!"
     },
     {
       // More widget details..
     }
];

// Function to display list of widgets on calling page    
function showWidgets(container_div, style)
{
    // Start building the html for the list
    var html = "<ul class='" + style + "'>";

    // Loop through all of the widgets we have, ading to list
    for (i = 0; i < widgets.length; i++)
    {
        html += "<li><a target='_blank' href='" + widgets[i].url + "'>";
        html += widgets[i].title;
        html += "</a></li>";
    }
    html += "</ul>";

    // We have the html, now write to the container     
    // If the user hasn't created this already, we'll make it      
    if (document.getElementById(container_div))
    {
        document.getElementById(container_div).innerHTML = html;    
    }
    else
    {
        // Target div wasn't made by user, create it inline
        document.write("<div id='" + container_div + "'>");
        document.write(html);
        document.write("</div>");
    }
}

一旦用户将您的js代码嵌入到他们的页面中,widgets.asp的输出将负责写出最近的数据。您可以指定样式等,或者将这一切留给最终用户根据其网站的其余部分进行样式设置。

答案 1 :(得分:1)

您的要求列表似乎相当广泛。

我打算建议构建某种RESTful Web服务,通​​过该服务,用户可以以最合适的格式使用您的数据。如果它们具有解析它的能力,则可以是XML或JSON,或者如果他们只想在其页面中嵌入iframe,则可以返回纯HTML。

看一下雅虎的一些Web服务,并了解他们如何做事:

http://developer.yahoo.com/

答案 2 :(得分:1)

任何类型的Web服务都需要在消费者方面进行编程,因此这不是您的选择。 你要做的通常是用Javascript完成的。看看亚马逊为关联网站提供的内容,Technorati,......还有很多其他的例子。

它的工作方式 - 您的客户端包含来自您网站的javascript文件,该文件随后将作为浏览器中页面呈现的一部分执行,您可以将内容包含在生成的输出流中。 了解您必须提供脚本非常重要。浏览器因潜在的安全风险而阻止跨站点脚本。 例如,为了包含亚马逊的搜索小部件,您只需将以下代码放入页面中(为清楚起见,我删除了查询字符串参数):

<SCRIPT charset="utf-8" type="text/javascript" 
        src="http://ws.amazon.com/widgets/q?...">
</SCRIPT> 
<NOSCRIPT>
<A HREF="http://ws.amazon.com/widgets/q?...">
        Amazon.com Widgets</A>
</NOSCRIPT>

如果浏览器未启用Java脚本,则仅显示链接。您可以在其周围包装DIV标记以控制窗口小部件的大小。 您唯一的其他选择是<IFRAME>

答案 3 :(得分:0)

您可以公开他们可以调用的Web服务。在asp.net中创建Web服务非常简单。

您可以为要公开的不同数据元素创建方法,客户可以使用方法中提供的任何参数调用服务,以便根据需要进一步过滤数据。

答案 4 :(得分:0)

创建一个可以根据参数或content-accept-header以不同格式生成响应的URL;我推荐HTML,XML和JSON。想要使用IFRAME或拥有Javascript的客户端的HTML为想要在输出数据之前处理数据的客户端执行document.write,XML和JSON,使用客户端Javascript或使用他们正在使用的任何语言的服务器端。您可以为您的客户创建一个Javascript,用于获取HTML并执行document.write以及包含一些默认的CSS。