我按照此示例在我的网站上包含 SkyScanner 小部件：
http://business.skyscanner.net/portal/en-GB/Documentation/Widgets
由于某种原因，我只是得到一个空的 div - 这可能与密钥有关吗？当我单击从 SkyScanner 获得的小组件密钥的激活链接时，我看到一个页面，内容如下：
描述：服务器发生应用程序错误。此应用程序的当前自定义错误设置阻止远程查看应用程序错误的详细信息（出于安全原因）。但是，可以通过本地服务器计算机上运行的浏览器查看它。
详细信息：启用此特定错误消息的详细信息 可在远程计算机上查看，请在其中创建标签 位于根目录的“web.config”配置文件 当前的网络应用程序。这个标签应该有它的 “模式”属性设置为“关闭”。
我使用以下代码创建了一个 web.config 文件：
<!-- Web.Config Configuration File -->
<configuration>
<system.web>
<customErrors mode="Off"/>
</system.web>
</configuration>
我查看了 Chrome 上的“检查元素”并收到错误
未捕获的类型错误：对象#没有方法“write” api.ashx?key=[KEY]:1
这是JS：
var API_KEY = 'b7290ac3-1f9f-4575-88a7-89fed0c61f7f',
MAIN_URL = 'http://api.skyscanner.net/api.ashx?key=' + API_KEY;
function main(){
console.log('loaded module');
var snippet = new skyscanner.snippets.SearchPanelControl();
snippet.setCurrency('GBP');
snippet.setDeparture('uk');
snippet.draw(document.getElementById('snippet_searchpanel'));
};
function newWrite(str) {
$(str).appendTo('body');
}
var oldWrite = document.write;
document.write = newWrite;
function onMainSkyscannerScriptLoad(e) {
console.log('loaded main script');
skyscanner.loadAndWait('snippets', '1', {'nocss' : true}, main);
}
$('button').click(function() {
console.log('getting main script');
$.getScript(MAIN_URL, onMainSkyscannerScriptLoad);
});
我还用它来个性化小部件：
skyscanner.load("snippets","2");
function main(){
var snippet = new skyscanner.snippets.SearchPanelControl();
snippet.setShape("box300x250");
snippet.setCulture("en-GB");
snippet.setCurrency("USD");
snippet.setColourScheme("classicbluelight");
snippet.setProduct("flights","1");
snippet.setProduct("hotels","2");
snippet.setProduct("carhire","3");
snippet.draw(document.getElementById("snippet_searchpanel"));
}
skyscanner.setOnLoadCallback(main);
这里是 Skyscanner B2B 支持工程师。你还在为这个烦恼吗？
为了获得最快的回复，请在此处联系我们：http://business.skyscanner.net/portal/en-GB/Home/Contact
首先要检查的是该文件是否位于 Web 服务器上（本地主机即可），而不是从桌面（或一般本地磁盘）加载。这是因为某些 Skyscanner JS 代码使用 //api.skyscanner.net 等 URL 查找其他文件。换句话说，将文件保存到桌面并从那里打开它将不起作用（将显示为空 div）。这是绘制小部件的最基本示例。您可以尝试将其放入文件中并通过服务器访问它吗？如果它有效，我们可以在它的基础上进行构建:)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" >
<head>
<script type="text/javascript" src="//api.skyscanner.net/api.ashx?key=b7290ac3-1f9f-4575-88a7-89fed0c61f7f"></script>
<script type="text/javascript">
skyscanner.load("snippets","2");
function main(){
var snippet = new skyscanner.snippets.SearchPanelControl();
snippet.setShape("box300x250");
snippet.setCulture("en-GB");
snippet.setCurrency("USD");
snippet.setProduct("flights","1");
snippet.setProduct("hotels","2");
snippet.setProduct("carhire","3");
snippet.draw(document.getElementById("snippet_searchpanel"));
}
skyscanner.setOnLoadCallback(main);
</script>
</head>
<body>
<div id="snippet_searchpanel" style="width: auto; height:auto;"></div>
</body>
</html>