通过 AJAX 调用 BigCommerce API 时出现 401 错误答案

【问题标题】：Getting 401 error while calling BigCommerce API through AJAX通过 AJAX 调用 BigCommerce API 时出现 401 错误
【发布时间】：2016-06-28 16:19:03
【问题描述】：

我们希望通过 jQuery/AJAX 调用 API 来实现快速搜索结果的最小购买量。我们正在尝试调用 API 但没有得到响应。我们收到以下错误消息：

NetworkError: 401 Unauthorized - https://mystore.mybigcommerce.com/api/v2/products/product_id

以下是我们在 quicksearch.js 文件中添加的代码。

var key = 'API key';
var auth = 'Basic ' + btoa('username:'+key);
var url = 'https://mystore.mybigcommerce.com/api/v2/products/product_id';

$.ajax({
    url : url,
    method : 'GET',
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    async: false,
    crossDomain: true,
    beforeSend : function(req) {
        req.setRequestHeader('Authorization', auth);
    },
    success: function(result) {
        alert('done');
        console.log(result);
    },
    error: function (request, textStatus, errorThrown) {
        console.log(request.responseText);
        console.log(textStatus);
        console.log(errorThrown);
    }
});

谁能指导解决这个错误？

【问题讨论】：

API 无法识别您的身份验证令牌。您需要检查您是否正确生成和传递它。
您还应该删除 async: false，因为这是难以置信不好的做法。
@RoryMcCrossan。谢谢你。我已经删除了“async：false”并重新检查了 Auth。仍然得到同样的错误。 401 错误的描述是：-“跨源请求被阻止：同源策略不允许读取store-zxu7pi.mybigcommerce.com/api/v2/products/86 的远程资源。（原因：CORS 标头“Access-Control-Allow-Origin”缺失）”。能否请您进一步指导？

标签： jquery ajax api e-commerce bigcommerce

【解决方案1】：

您可以在实时服务器上创建单独的 PHP 应用程序来调用 Big-commerce API。

您可以从 BigCommerce 商店 - 管理面板 -> 高级设置 -> 旧 API 设置创建您的旧 API 帐户，并可以获得 API url、用户名、令牌。

您可以实现以下代码来获取最小购买数量。

文件名为 getproductinfo.php。

    <?php
    header("Access-Control-Allow-Origin: *");
    header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');

    $product_id = $_GET['prod_id'];

    $username='username';
    $password='API token';
    $URL='https://mystoreurl.mybigcommerce.com/api/v2/products/'.$product_id;

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL,$URL);
    curl_setopt($ch, CURLOPT_TIMEOUT, 30); //timeout after 30 seconds
    curl_setopt( $ch, CURLOPT_HTTPHEADER, array('Content-Type:UTF-8','Accept: application/json'));
    curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);
    curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_ANY);
    curl_setopt($ch, CURLOPT_USERPWD, "$username:$password");
    $status_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);   //get status code
    $result=curl_exec ($ch);
    curl_close ($ch); 


    $data = json_decode($result,true);
    $minimimOrder = $data['order_quantity_minimum'];
    echo $minimimOrder;die();

    ?>

响应（最低购买量）-->您可以使用以下代码作为 result 在 quicksearch.js 文件中获取。

 var url = 'http://liveserveripaddress/foldername/getproductinfo.php';
        $.ajax({
            url : url,
            type : 'GET',
            data : {prod_id:productid},
            dataType: "json",
            crossDomain: true,

            success: function(result) {
                console.log(result);
                },
            error: function (request, textStatus, errorThrown) {
                console.log(request.responseText);
                console.log(textStatus);
                console.log(errorThrown);
            }
        });

【讨论】：

旧版身份验证已被 BC API 的新 OAuth 实施弃用
我在一个页面中使用 api 在控制台中使用 ajax 遇到了同样的问题 errorRequest Failed: error, quick-order:666:5 Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at api.bigcommerce.com/stores/j4ip6cs857/v2/…。（原因：缺少 CORS 标头“Access-Control-Allow-Origin”）。[了解更多] 跨域请求被阻止：同源策略不允许读取位于 api.bigcommerce.com/stores/j4ip6cs857/v2/… 的远程资源。（原因：CORS 请求未成功）。
旧版 API 设置并可以获取未在演示商店中创建的 API url、用户名、令牌？？

【解决方案2】：

我们不支持 CORS。尝试在浏览器中直接从 javascript 调用 API 是非常不安全的。这会公开一个 API 令牌，使某人能够通过基本身份验证访问存储中可用的任何数据。这将包括 PII。

如果您确实需要从 API 调用信息，请使用安全的网络服务，该服务会向您的脚本返回非常具体的值，而不是直接调用它。

Is BigCommerce API supports CORS?

【讨论】：

谢谢@Alyss。这有帮助:)