Question

我正在制作网站的html小部件。比方说，它会显示当前的股票指数简而言之，任意网站所有者从我这里获取代码片段并将其包含在他的网页http://website.com/index.html中。当任意用户打开http://website.com/index.html时，我的代码会向我的服务器（provider.com）发送请求，该服务器执行必要的操作并将信息返回给用户的浏览器。当响应到达时，用户将在http://website.com/index.html上看到相关的库存值。

在index.html服务中可以像这样调用

<script type="text/javascript" src="provider.com/service.js"> </script>
<div id="target_area"></div>
<script type="text/javascript">
    service.show("target_area", options);
</script>

现在，问题在于same origin policy：我不能只是将来自website.com的ajax请求发送到provided.com并返回html嵌入客户端的网页。我看到了几个解决方案，我在下面列出，但没有一个能让我满意。我想知道，如果你能提出一些建议，特别是如果你有相关的经验。

1）iframe，简单明了。缺点：必须具有固定尺寸+某些浏览器中出现的愚蠢滚动条。可以使用javascript修复，但所有这些特定于浏览器的修补对我来说听起来都不错。

2）JSONP。问题：无法返回整个html块，必须只返回数据。然后，在浏览器端，我将不得不使用javascript将数据嵌入到index.html中静态放置的html片段中。听起来不太好，因为数据格式不是很简单，甚至可能会在以后改变。

3）使用隐藏的iframe来执行ajax请求。有点棘手，但听起来像是一种方式。

嗯，这是我对这个问题的看法。有没有更好的方法？
顺便说一句，我也尝试检查一些现有的小部件，但没有找到太多有用的信息。

本文中使用的所有域名都是虚构的，任何相似之处纯属巧合：）

更新正如SLaks建议的那样现在可以使用！如果有人对细节感兴趣，那么响应html必须像这样（ruby）进行后处理

body = body.gsub '"', '\\"'
body = body.gsub /\n/, '\\n';
body = body.gsub '/', '\\/';
body = params[:callback] + '("' + body + '");';

之后，您可以将jquery与“dataType：'jsonp'”选项一起使用。

Answer 1

您可以使用JSONP发送包含原始HTML的字符串。

JSONP是最好的选择。

Answer 2

我过去解决这个问题的方法是在website.com上运行一个非常轻量级的代理，该代理将从客户端获取AJAX请求，将其传递给provider.com，并将返回的结果发回来自provider.com。我不确定这是否适合您的环境。

此解决方案的一个优点是您可以在代理中添加值，例如缓存一段时间的答案，加密和/或压缩与provider.com的通信，身份验证和授权等。

与服务器通信的html小部件

2 个答案: