Question

亲爱的StackOverflow朋友。

我正在尝试为我正在工作的公司解决一个非常复杂的解决方案。我用JavaScript开发了一个电能计算器，它位于我们自己的网络服务器上，作为一个带有完整DOM（html，head，body和大量“.css”的网页和“.js”文件包括在内。）

问题是计算器必须是我们客户网页的一部分（在div中），它从我们的网络服务器加载计算器。当公司网站请求计算器时，它必须带有一个秘密的API密钥，其中包含对我们的域的请求，该请求验证客户并将计算器发回给客户，并且具有客户已支付的正确视图。

我尝试过“IFRAME”并且效果很好但是没有办法在请求中发送“SECRET”api密钥（公司网页需要是.html文件）：

<iframe src="http://localhost/calc/energycalc.php"  
        width="815" 
        height="572" 
        frameborder="0" 
        scrolling="no" 
        style="border-radius: 7px;">
</iframe>

另外，我已经读过要避免使用iframe，所以我正在寻找其他的东西。

现在我正在开发一个求解顺序如下的解决方案：

公司网站 - ＆gt;公司网站api文件夹中的密钥 .php脚本 - ＆gt;我们的网络服务器 - ＆gt;将计算器返回公司.php 脚本 - ＆gt;将计算器返回公司网站。

我尝试了几种jQuery解决方案。这个ajax调用来自公司网站，其中div有一个名为'siteloader'的id，它对api文件夹（也位于公司网站上）进行ajax调用，该文件夹有一个.php脚本：

$.ajax({
    url: 'http://localhost/customer/api/key.php',
    dataType: 'html',
success: function(data) {
    $('#siteloader').html($(data));
    }});

key.php脚本使用密钥作为POST参数执行cURL请求：

$api_key = "9chuPsWJBSpbiphxgxF3ld9pSWQQIEj5dPEkbstj0YReumqQ06"
$url = 'http://localhost/calc/energycalc.php' // our web server
$post_params['key'] = $api_key

$ch = curl_init();
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $post_params);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

$reply = curl_exec($ch);
curl_close($ch);

echo $reply;

这不能正常工作 - 它不会返回任何样式。

请询问是否有需要澄清的事情（可能存在）！

对于如何解决此问题或改进我的解决方案有任何意见的人？

非常感谢任何帮助。

谢谢，大卫

Answer 1

我不太确定我是否遵循了你的逻辑，但让我试着重新说明事情。您正在向客户端服务器上的key.php页面拍摄AJAX请求？那个key.php页面正在向您的远程Web服务器发送一个curl请求？

您的jQuery AJAX调用是否只是向远程服务器发送请求？它会将秘密API密钥传递给服务器并接收您要在客户端页面上放置的模板吗？然后，您的服务器将验证API密钥并采取相应措施。如果API密钥无效，那么您将向jQuery请求发回401（未授权），只显示消息或不执行任何操作（您的选择）。

有很多应用程序以这种方式处理事情（Google Analytics，Disqus，Stackoverflow等）。

更新：您应该查看jQuery.ajax()方法的“数据”选项。它允许您显然将数据（您的API密钥）发送到服务器。您也可以将其嵌入到请求的URL中。

<强>实施例

$.ajax({
  type: "GET",
  url: "/server.php",
  data: { key: "yoursecretkey" }
})
  .done(function( response ) {
    alert( "response back: " + response );
  });

或使用网址的内容：

$.ajax({ type: "GET", url: "/server.php?key=yoursecretkey" });

使用来自外部网站div的API密钥验证请求

1 个答案: