Question

我正在尝试制作一个简单的API请求并且失败了。

文档说这是如何发出请求：

POST https://api.yotpo.com/oauth/token
--------------------------------------

{
  "client_id": "### Your client_id ###",
  "client_secret": "### Your client_secret ###",
  "grant_type": "client_credentials"
}

我尝试通过HTML表单提交，只是为了测试：

<head>
    <meta http-equiv="content-type" content="application/json; charset=UTF-8">
</head>


<?php


$json ='{"client_id": "creds",
"client_secret": "secret",
"grant_type": "client_credentials"}';



print_r($_POST);
?>

<form action="https://api.yotpo.com/oauth/token" enctype='application/json' method="POST">

    <input type="hidden" name="post_data" <?php echo 'value="'.htmlspecialchars($json).'"'; ?> />
    <input type="submit">
</form>

有人告诉我，内容类型必须是我设置的application/json。

我是通过PHP测试文件在我的服务器上这样做的，但我真的愿意以任何可能的方式完成这项工作，然后从那里搞清楚。

当我从当前的HTML表单提交时，页面重定向到yotpo页面，并且JSON数据显示为空白：

{"status":{"message":"Couldn't find Account with app_key = ","code":404,"error_type":"Exceptions::RecordNotFound"}}

提交此API身份验证的最简单方法是什么？

Answer 1

将JavaScript函数附加到执行HTTP请求的按钮

我建议您使用JQuery为您提出请求。如果不使用它，则必须为每个浏览器制作单独的代码。

如果您使用JQuery，您将使用类似于此

的代码

var data = '{"client_id": "creds",
"client_secret": "secret",
"grant_type": "client_credentials"}'

$.ajax({
  type: "POST",
  url: "https://api.yotpo.com/oauth/token",
  data: data,
  success: function(){"worked"},
  dataType: "application/json"
});

Answer 2

<强>更新

我应该使用curl和php完成与api的所有交互吗？要么现在使用html / jquery与api进行交互是“安全的”吗？凭证是以安全的方式生成的。

使用客户端来获取此类案例的授权是不安全的。即使在获得token之后，我也不会在客户端使用它们。相反，我会创建一些PHP页面/ api，javascript（ajax或其他）将调用它并完成工作！

返回access_token以JSON格式提供给我。我该怎么用我将使用jquery中的给定访问令牌？我想我会需要json_decode正确吗？

请参阅更新的代码。如果您仍想在jquery中使用token，请按以下步骤操作：

创建php api，/auth执行授权并回显token。
向/auth发送一些请求（发布，获取），该请求将返回token。保存并使用它。

问题是您要将数据发布为post_data。所以在收到结束时，它会像post_data = {...}那样他们没有注意到apiKey。

在公共场合暴露私钥也是不安全的。您可以使用纯PHP cURL请求获得授权。

试试这个：

<?php
$json = array(
    "client_id"=> "creds",
    "client_secret"=> "secret",
    "grant_type"=> "client_credentials"
);
$ch = curl_init( "https://api.yotpo.com/oauth/token" );

# Setup request to send json via POST.
$payload = json_encode( $json );

curl_setopt( $ch, CURLOPT_POSTFIELDS, $payload );

curl_setopt( $ch, CURLOPT_HTTPHEADER, array('Content-Type:application/json'));

# Return response instead of printing.
curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true );

# Send request.
$result = curl_exec($ch);

curl_close($ch);

# Print response.
#echo "<pre>$result</pre>";

# use json_decode method to parse result.
$auth = json_decode($result, true);
echo $auth['access_token']; # Prints token

# For debugging, use var_dump($auth);    

?>

现在你可以创建一个连接文件，它将获得授权密钥，然后所有其他的php文件都可以共享它。

Checkout phpfiddle示例：http://phpfiddle.org/main/code/mpd1-swcn

Answer 3

以下是使用javascript进行操作的完整示例。但请注意Priyesh Kumar的答案！ 将您的客户端密码ID放在HTML中是危险的。除非这是你的内部工具，否则使用PHP而不是javascript。

＆＃13;

   document.getElementById("myform").addEventListener("submit", function (e) {
        // prevent normal submit
        e.preventDefault();
        e.cancelBubble = true;

        // test if JSON is valid
        var validJSON;
        try {
            validJSON = JSON.stringify(JSON.parse(this.elements["post_data"].value));
        }
        catch (e) {
            alert("Invalid json");
            console.log(e);
            return;
        }
        // Mark field as disabled
        var form = this;
        form.elements["submit"].disabled = true;
        form.elements["submit"].value = "Loading...";
        // Send AJAX
        var xhr = new XMLHttpRequest();
        xhr.open("POST", this.action, false);
        xhr.setRequestHeader("Content-Type", "application/json");
        // this runs after load
        xhr.addEventListener("load", function (data) {
            // print result
            document.getElementById("result").innerHTML = "";
            document.getElementById("result").appendChild(new Text(this.responseText));
            // 
            form.elements["submit"].removeAttribute("disabled");
            form.elements["submit"].value = "Submit";
        });


        // this sends JSON
        xhr.send(validJSON);
    });

＆＃13;

<form action="https://api.yotpo.com/oauth/token" id="myform" enctype='application/json' method="POST">

<!-- DO NOT POST YOUR CLIENT SECRET PUBLICLY!
     that's why it's called secret!
-->
    <textarea name="post_data" style="width:100%">
{ "client_id": "creds",
        "client_secret": "secret",
        "grant_type": "client_credentials"
}
    </textarea>
    <input type="submit" name="submit">
</form>
<pre id="result"></pre>

＆＃13;

HTTP + JSON简单的api请求被发送为空白

3 个答案: