将字符串安全地传递给JS

Question

如何在没有用户能够事先看到它的情况下（例如在源代码中）收到JS中的字符串（可能通过警报）？您可能从Geocaching Checkers中了解到这一点，他们如何确保真正的坐标在源代码或任何地方都能被看到？我有一个Web服务器和一些基本的JS和HTML理解，我读过PHP和AJAX，但我还没有找到我的问题的解决方案。我的目标是仅在用户在我的网站上完成一个条件时才显示信息，并且它至关重要。我尝试使用单独的PHP文件：

<?php
    $koords =  "N 53° 13.869 E 10° 22.716";
?>

但是如何在JS中接收这个变量并且用户可以看到php文件？

Answer 1

在您的浏览器（JS）中，具有JS知识的人总是可以看到它。

您唯一能做的就是设置一个服务器，评估您的用户是否满足完成挑战的条件。一旦服务器将挑战识别为已完成，它就会将您的秘密发送回客户端，以便可以在那里向用户显示。如何设置该服务器以及使用何种语言或框架/工具（例如PHP）取决于您的背景以及您将托管网站的环境。

添加一些细节：您将希望在JS中以某种方式向服务器发送用户输入（例如PHP）中的Http请求。如果它是简单的内容，您可以使用&parameter=foo将其添加到网址本身，否则您可能会发送帖子请求并将您的数据作为JSON正文发送。然后，您需要评估PHP中的参数，如果它符合挑战的要求，您将使用您的秘密回复您的回复中的客户端，或者如果没有，请再次尝试使用此消息。

Answer 2

好的，这就是我做的，帮助任何看到这个的人。这种方法很容易“破解”，所以不要用它来隐藏真实的敏感数据，它更容易在源代码中看到什么阻塞。我创建了一个看起来像这样的PHP

<?php

$secret =  "data";
$givesecret = $_GET['givesecret'];

if ($givesecret>0) {
    echo $secret;
}
?>

然后，当我想要秘密信息时，我让我的JS通过XHR调用PHP

var rndvar = 0;
//something is done in a loop
rndvar++;
//now something is completed and i want to reveal the secret
var xhr = new XMLHttpRequest();
            xhr.open("GET", "containssecret.php?givesecret="+rndvar);
            xhr.onreadystatechange = function()
            {
                if(xhr.readyState == 4 && xhr.status == 200) {
                    alert(xhr.responseText);
                }
            }
xhr.send();

非常基本，明显的缺点当然是我可以调用https://www.mywebsite.org/containssecret.php?givesecret=5，它会立即给出秘密，所以目标是将所有内容命名为不太明显，并且不清楚PHP中的标准是什么（这里是int大于零）。但是如果你知道一些编码，它总是有可能找到它，这只是一种简单的混淆方法，而且它只对普通用户相对安全。为了我的目的，这很好:-D