【问题标题】:Javascript: can I make two websites interact via javascript?Javascript:我可以让两个网站通过 javascript 交互吗?
【发布时间】:2018-02-09 23:59:41
【问题描述】:

这是一个简化的示例: 我使用了两本在线词典,但每一本都只有一组我需要的功能。然而,点击两者并在两个地方输入单词是很痛苦的。 我想编写自己的 javascript 网页,从两个站点加载元素,即单词的输入字段,然后在同一页面上显示两个站点的结果。

我的脚本需要从一页中读取元素,并使用该数据 操作其他页面。

当我尝试对此进行研究时,我遇到了相同的来源政策,但显然 chrome 有一种解决方法。我的问题是这是否可以通过浏览器和 javascript 实现,或者我是否必须研究一种完全不同的技术,例如 Python 和网络抓取。

【问题讨论】:

  • 如果您不控制这些网站并且如果它是用于特定用途,一个合理的解决方案是开发一个浏览器扩展来做到这一点。
  • 哪些网站?我去看看。我已经有了一个简单的想法。

标签: javascript same-origin-policy


【解决方案1】:

如果只是同时查询两个网站的同一个词,你可以让你的网页有两个iframes,并设置它们的src属性如下:

$("#search").click(function () {
    var term = $("#term").val();
    $("#dictionary").attr("src", "http://www.dictionary.com/browse/" + term);
    $("#free").attr("src", "https://www.thefreedictionary.com/" + term);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input id="term" type="text" placeholder="search dictionaries">
<input id="search" type="button" value="Search"><br>
<iframe id="dictionary" src="about:blank" style="width:45vw;height:500px;"></iframe>
<iframe id="free" src="about:blank" style="width:45vw;height:500px"></iframe>

网站的 URL 是他们的 API。在他们的网站上进行搜索后,只需查看地址栏,了解如何自己构建它。

奖金

我自己使用类似这样的不同网站,但通过自定义命令在浏览器中自动打开多个选项卡(您也可以通过 Javascript 来完成)。

我在 linux 上使用如下命令(在.bashrc 中声明):

function d {
    firefox "http://www.dictionary.com/browse/$1+$2+$3+$4+$5"&exit
}

这意味着,即使没有打开 firefox,我也可以打开终端(使用键盘快捷键)并输入 d test 以启动 firefox 并在字典中搜索 test。如果 Firefox 已经在运行,它将被带到前台,并且网站将在新标签页中打开。

在 Windows 中,您可以添加批处理文件 (*.bat) 或命令文件 (*.cmd) 来做同样的事情。在c:\windows 中,您可以创建一个名为d.cmd 的文件:

start "" "http://www.dictionary.com/browse/%1+%2+%3+%4+%5"

然后使用键盘快捷键Win+R打开运行对话框并输入d test

运行对话框曾经位于开始菜单中,他们可能已将其隐藏在您的 Windows 版本中。

【讨论】:

  • 谢谢,太好了。我有一个更复杂的问题,那就是我需要自动完成。网站 1 有一个自动完成的输入字段,所以我需要让我的脚本以某种方式从中获取数据并将其传输到输入字段网站 2。理想情况下,所有这些都在一个页面上,所以我正在尝试弄清楚是否有可能以某种方式从站点 1 我自己的 HTML 中获取输入字段,然后将两个站点的结果放到同一页面上。这是 1:dictionary.tovnah.com 和 2:kheng.info/search
  • 更正:“从站点 1 获取输入字段并将其放入我自己的 HTML 中”。现在我想我可以做 3 个 iframe,但理想情况下我想把结果放在一个页面中,这样我就可以重新格式化它以垂直并排显示。是否可以不使用 iframe ?
  • 我怀疑该网站是否允许开放访问他们的自动完成 API,并且由于 (Same Origin Policy),您无法访问 iframe 提取任何数据。但是,如果您获得包含所有单词的字典文件,则可以实现自己的自动完成。
  • 您认为我可以将结果文档加载到 javascript 变量中并显示加载的 DOM 中的一些元素吗?问题是具有自动完成功能的第一页是网站 1 的 HTML,我可以在加载的页面上运行 javascript,还是必须编写浏览器扩展程序?
  • 对不起,如果不清楚,我想在我的浏览器中加载网站一。然后运行一些 javascript 将结果加载到两个变量中,并在隐藏大部分原始网页的同时显示其中的一些。我可以在浏览器中加载的网站上运行 javascript 并操作它的 DOM,还是必须编写浏览器扩展来执行此操作?
【解决方案2】:

是的,如果字典具有可以与之交互的端点,则可以使用 JS 执行此操作。 (或者至少那将是最简单的)。他们中的大多数人都这样做。您通常只需 google dictionary name + API

如果您有权访问它,您可以触发 2 个请求以获取数据,然后您可以在页面返回后将其显示在您的页面上。

【讨论】:

  • 我明白了,谢谢,但这些网站没有 API,因为它是一种罕见的语言和小型网站。我必须自己处理 DOM。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-02-02
  • 1970-01-01
相关资源
最近更新 更多