Отправка значения data-api-key для Snipcart w / vue meta в сложном виде - PullRequest
1 голос
/ 07 января 2020

Я делаю сайт электронной коммерции с грифом и снипкартой. Проблема в том, что когда я проверяю извлечение из снипкарты, он не работает. В документации к сниппарту сказано, что нужно добавить строку

<div id="snipcart" data-api-key="myapikey" hidden></div>

, которую я добавил в файл default. vue в моей папке layouts . Но когда я проверяю элемент после сборки, я вижу в DOM

<div id="snipcart" class="snipcart"></div>

Атрибут data-api-key не отображается. Использование vue -меты для ввода данных API-ключа в разметку в main. js для [snipcart's [example] [1] дает тот же результат:

head.script.push({
    type: 'text/javascript',
    src: 'https://cdn.snipcart.com/scripts/v3.0.4/snipcart.js',
    body: true,

    // snipcart's attributes
    id: 'snipcart',
    'data-api-key': 'apiKey',
  });

Snipcart Журналы показывают это:

2020-01-08 10:52:51 

INF>["req6fd695fe", "acc69393_test"] Impossible validate items for order 'fd0f6d92-b422-4b2c-8a50-a955b4eeceaa'. Please make sure the URL is valid, we suggest you take a look at our Security documentation http://docs.snipcart.com/getting-started/security) for more information. 

Любая помощь в получении сниппкарты с работой очень важна.

Обновление: - Следуйте инструкциям и настройте разметку и панель управления как следует развертывание для netlify @ https://ecommerce-gridsome.netlify.com

 <button
class="snipcart-add-item"
:data-item-id="product.id"
:data-item-name="product.title"
:data-item-description="excerpt"
:data-item-image="image.url"
:data-item-price="product.fields.Unit_cost"
:data-item-url="'https://ecommerce-gridsome.netlify.com' + $props.product.path"

> Тем не менее получить ошибку в журнале:

2020-01-10 13:56:57 

INF>["reqec389060", "acc69393_test"] Found 1 snipcart-add-item elements with ids [reckl3dcep4sbpWRi]
2020-01-10 13:56:57 

INF>["reqec389060", "acc69393_test"] Validating item with id 'reckl3dcep4sbpWRi' located at https://ecommerce-gridsome.netlify.com/products/nebula-chair/' on domain 'ecommerce-gridsome.netlify.com'.
2020-01-10 13:56:57 

INF>["reqec389060", "acc69393_test"] Found 1 snipcart-add-item elements with ids [recfEnH5eESHpWzLT]
2020-01-10 13:56:57 

INF>["reqec389060", "acc69393_test"] Validating item with id 'recfEnH5eESHpWzLT' located at https://ecommerce-gridsome.netlify.com/products/compel-bookcase/' on domain 'ecommerce-gridsome.netlify.com'.
2020-01-10 13:56:52 

INF>["req4a317e07", "acc69393_test"] Found 1 snipcart-add-item elements with ids [reckl3dcep4sbpWRi]
2020-01-10 13:56:52 

INF>["req4a317e07", "acc69393_test"] Validating item with id 'reckl3dcep4sbpWRi' located at https://ecommerce-gridsome.netlify.com/products/nebula-chair/' on domain 'ecommerce-gridsome.netlify.com'.
2020-01-10 13:56:52 

INF>["req4a317e07", "acc69393_test"] Found 1 snipcart-add-item elements with ids [recfEnH5eESHpWzLT]
2020-01-10 13:56:52 

INF>["req4a317e07", "acc69393_test"] Validating item with id 'recfEnH5eESHpWzLT' located at https://ecommerce-gridsome.netlify.com/products/compel-bookcase/' on domain 'ecommerce-gridsome.netlify.com'. 

1 Ответ

2 голосов
/ 08 января 2020

Если корзина открывается, это означает, что ваш API-ключ правильный.

Snipcart полностью заменяет div, поэтому вы больше не видите ваш API-ключ после загрузки корзины.

Сообщение журнала указывает на ошибку сканирования. Вы должны убедиться, что ваш домен настроен на панели мониторинга, а определение продукта доступно в источнике страницы при его загрузке. Сканер Snipcart не выполняет Javascript, но Gridsome предоставляет предварительно обработанные страницы, так что все в порядке.

...