Создать пользовательский продукт в Shopify

Question

Мне нужно создать пользовательский продукт по адресу Shopify Storefront.

Документация ссылка: http://docs.shopify.com/api/product#create

Я попытался следующий код:

$('#addProduct').click(function() { 
     $.ajax({ 
      url:'https://xxxxxx:yyyyyyyyyy@rmisys.myshopify.com/admin/products.json', 
      type: 'POST', 
      contentType : 'application/json', 
      dataType: 'json', 
      data: { 
        "product": { 
        "title": "Burton Custom Freestlye 151", 
        "body_html": "<strong>Good snowboard!</strong>", 
        "vendor": "Burton", 
        "product_type": "Snowboard", 
        "tags": "Barnes & Noble, John's Fav, \"Big Air\"" 
        } 
       }, 
      success: function(response) { 
       console.log(response); 
      }, 
      error: function(xhr) { 
       console.log(xhr.statusText); 
      } 
     }).done(function(data) { 
      console.log(data); 
     }); 
    }); 

Приведенный выше код показывает следующее сообщение об ошибке в консоли Chrome в то время как Ajax запроса:

ВАРИАНТЫ https://rmisys.myshopify.com/admin/products.json 405 (Не разрешено) jquery-1.10.2.js: 8706 ОПЦИИ https://rmisys.myshopify.com/admin/products.json Нет заголовка «Access-Control-Allow-Origin» o n запрашиваемый ресурс. Происхождение 'http://rmisys.myshopify.com' поэтому не допускается. jquery-1.10.2.js: 8706 XMLHttpRequest не может загрузить https://rmisys.myshopify.com/admin/products.json. В запрошенном ресурсе нет заголовка «Access-Control-Allow-Origin». Происхождение 'http://rmisys.myshopify.com' поэтому не допускается. дизайн-рубашка: 1 ошибка

Answer 1

После долгого поиска я нашел решение.

Проблема Перекрестный ресурс ресурсов (CORS).

http://en.wikipedia.org/wiki/Cross-origin_resource_sharing

Это используется для предотвращения CSRF защиты.

https://docs.djangoproject.com/en/1.4/ref/contrib/csrf/

В большинстве случаев API должны принимать запросы с Same Origin Policy http://en.wikipedia.org/wiki/Same-origin_policy

Так,

Если мы требуем от "HTTP" с помощью хозяина, мы получили следующее сообщение об ошибке по запросу AJAX от Shopify:

No 'Acce Заголовок ss-Control-Allow-Origin присутствует на запрошенном ресурсе.

Решение для перенаправления пользователей на «HTTPS», когда они приходят на наш сайт с помощью «HTTP» протокол.

Я пробовал со следующим дополнительным кодом и успешно добавил пользовательские продукты.

<script> 
window.onload = RedirNonHttps(); 

function RedirNonHttps() { 
    if (location.href.indexOf("https://") == -1) { 
     location.href = location.href.replace("http://", "https://"); 
    } 
} 
</script> 

ПРИМЕЧАНИЕ: Если мы добавим пользовательский продукт от стороны клиента с помощью сценария он не является безопасным, потому что ключи затем публично доступны, пользователи могут делать все, что они хотят с помощью этого ключа API. Поэтому сделайте так, чтобы Secure Auth, а затем клиентский скрипт взаимодействовал с этим Secure Auth.

Надеюсь, что этот ответ дает идеи CORS (перекрестный источник ресурсов) для начинающих.

Answer 2

Просто помните. Если вам удастся выяснить эти тривиальные проблемы с CORS, вы будете публиковать свой магазин таким людям, как я, с вашим ключом API. Я смогу удалить все ваши ресурсы. Я могу заменить ваш инвентарь тем, что я хочу.

Вы не можете использовать Javascript, как это. Это смешно. Создайте защищенное приложение, которое правильно аутентифицируется с помощью oAuth. Затем используйте Javascript, чтобы поговорить с этим приложением. В противном случае у вас проблемы, так как кто-то заставит вас выглядеть глупо.