Question

假设我拥有2个网站，A和B.我可以访问网站A的源代码但不能访问网站B，尽管它是由我工作的同一个组织开发的，但是由不同的部门开发了与我们分享源代码。

当用户浏览网站A到网站B时，我想在链接回网站A的网站B中插入一些HTML。像facebook，twitter等提供的插件。

我知道我可以通过两种方式做到这一点：

第一种方式：使用javascript 我要求B网站上的开发者添加<div id = "fromWebsiteA" />和我的javascript代码<script src = "websiteA.com/script.js" />标记。在我的javascript代码中，我访问网站B上托管页面的DOM，并在我的div“fromWebsiteA”中创建子元素。这就是大多数社交网站提供的网站发布商想要在其网站上放置 Pin It （Pinterest）或 Digg it 或其他任何按钮。

第二种方式：使用iFrame 我给他们一个iframe，我的内容将在其中加载。喜欢facebook就像插件一样。

我的问题是：

1）我是否正在思考正确的思路？

2）是否有第三种技术？

3）很抱歉，如果我对这最后一个问题听起来很愚蠢，据我所知它涉及安全威胁，但有没有办法让我将HTML插入到站点B而根本不涉及站点B的开发团队？

Answer 1

我认为正确的方法是让网站B开发人员编写一个代码来检查标题中的http_referer，然后相应地显示您的小部件（或者您称之为的任何内容）此外，存储cookie以便在用户浏览网站时可以继续显示小部件是明智的。

另一种方法，您可以添加GET变量，例如?from=websiteA或其他内容，而不是检查http_referer

Answer 2

首先，您必须知道您来自网站A.当您从网站A浏览到网站B时，您必须使用参数（<a href="wwww.example.com?from=websiteA>Go</a>）调整链接或使用表单来实现同样的目标。

要检测/阅读网站B是否来自网站A，您需要插入自定义JS。在这里你应该阅读哈希

var recognizeText = "from=websiteA";
if( location.hash.indexOf( recognizeText ) == -1 ) { return; /*didnt come from websiteA */ }

// We came from website A, I dont know if you want to reset the hash (should the link be visible if you browse through websiteB, all the time..? )
// Then it would be more convenient to add a hash because that you can replace without pagerefreshing (I noticed that setting location.search = "" does refresh)

$("fromWebsiteA").style.display = "block";
$("fromWebsiteA").innerHTML = "<a href='www.websiteA.com'>Go back</a>"

我不会尝试使用iFrame。我不确定您是否可以在iframe中检测到prev页面。

即时将HTML插入另一个网页

2 个答案: