使用bigcommerce API MVC，沒有“ Access-Control-Allow-Origin”標頭存在錯誤

Question

我正在使用大型商務API來獲取訂單清單，我嘗試了很多解決方案。

這是我面臨的錯誤..

api.bigcommerce.com/stores/4jwabif3gj/v2/orders.json?search=false&nd=1541740677952&rows=20&page=1&sidx=&sord=asc:1無法加載資源：服務器的響應狀態為401（未經授權）索引：1從來源' http：// localhost：62797 '在' https://api.bigcommerce.com/stores/4jwabif3gj/v2/orders.json?search=false&nd=1541740677952&rows=20&page=1&sidx=&sord=asc '訪問XMLHttpRequest已被CORS政策阻止：對預檢請求的響應未通過訪問控制檢查：所請求的資源上沒有“ Access-Control-Allow-Origin”標頭。

HTML

<table id="JqGrid"></table>
<div id="JqGridPager"></div>

jQuery的

<script type="text/javascript">

    jQuery(document).ready(function ($) {

        var $grid = $("#JqGrid");
        $grid.jqGrid({
            url: 'https://api.bigcommerce.com/stores/4jwabif3gj/v2/orders.json',
            ajaxGridOptions: { xhrFields: { withCredentials: true } }, 
            dataType: 'json',
            colNames: ['id', 'date_created', 'date_modified', 'date_shipped', 'status'],

            colModel: [
                { name: 'id', index: 'id', width: 10 },
                { name: 'date_created', index: 'date_created', width: 50, sorttype: 'date', datefmt: 'Y-m-d' },
                { name: 'date_modified', index: 'date_modified', width: 50, sorttype: 'date', datefmt: 'Y-m-d' },
                { name: 'date_shipped', index: 'date_shipped', width: 50, sorttype: 'date', datefmt: 'Y-m-d' },
                { name: 'status', index: 'status', width: 50 },
            ],
            caption: "Order list",
            pager: "#JqGridPager",
            loadBeforeSend: function (jqXHR) {
                jqXHR.setRequestHeader("X-Auth-Token", 'modebafppdxh9sd90zffehu9wwgpj3d', "X-Auth-Client", '535bnhhfkqblu7ebg1aq9r6kue1lgv6');
            },
            //ajaxGridOptions: {

            //    beforeSend: function (xhr) {
            //        xhr.setRequestHeader("X-Auth-Token", "modebafppdxh9sd90zffehu9wwgpj3d", "X-Auth-Client", "535bnhhfkqblu7ebg1aq9r6kue1lgv6");

            //    }
            //},
            viewrecords: true,
            width: 1100,
            height: 400
        });
        $grid.jqGrid('navGrid', '#JqGridPager', { edit: false, add: false, del: false })
    });
</script>

Answer 1

根據StackOverflow上的答案以及BigCommerce支持論壇上的該線程 ，BigCommerce API不支持CORS。 這似乎是一個安全問題，通常不建議從客戶端發出API請求。

從BigCommerce API訪問信息的推薦方法是通過從安全的第三方服務器對該API進行調用，然后從您的Web應用程序查詢該第三方服務器。

Answer 2

根據您嘗試訪問的信息，可以使用“服務器到服務器”請求或Storefront API。

根據您的用例，最好使用Server to Server API。 文檔中概述了兩者之間的區別。 這應該可以幫助您確定哪個更適合您的應用程序。

要僅返回訂單列表，可以在此處使用此API端點。 要在店面捕獲訂單數據，可以在此處使用此端點。