Ошибка при создании общедоступного приложения Shopify: ngrok.io отказался подключиться

Я хочу общедоступное, а НЕ встроенное приложение Shopify. Это приложение представляет собой канал продаж, который импортирует товары из магазинов Shopify на мой веб-сайт электронной коммерции. Продукты магазинов, устанавливающих приложение, будут указаны на моем веб-сайте электронной коммерции.

Я сделал первые шаги для установки приложения и импорта продуктов на свой веб-сайт электронной коммерции.

Теперь, когда пользователь щелкает значок приложения, я хочу, чтобы он был перенаправлен на следующую страницу, на которой отображается список импортированных продуктов:

https://my-commerce.com/products?storeurl=perisn-handcrafts.myshopify.com

Если приведенные выше ссылки возвращают список продуктов, как показано ниже, список продуктов будет отображаться в консоли Shopify Admin:

<table data-toggle="table">
    <thead>
        <tr>
            <th>UniqueThirdPartyProductCode</th>
            <th>Title</th>
            <th>Price</th>
            <th>ImageUrl</th>
            <th>CombinedCategoryViewModel</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>39-4477334519894</td>
            <td>Blue</td>
            <td>550.00</td>
            <td></td>
            <td>"todo"</td>
        </tr>

        /* more data... */

    </tbody>
</table>

введите здесь описание изображения

Но если я помещаю таблицу в макет страницы, которая добавляет к результату теги <html>, <head> и <body>, то результат не отображается ... например, если мое приложение возвращает следующий HTML-код:

<html>
<head></head>
<body>
    <table data-toggle="table">
    /* 
     * content of the table 
     */
    </table>
</body>

Я бы получил такой результат:

введите здесь описание изображения

Я не уверен, почему получаю эту ошибку:

ngrok.io отказался подключаться

Также похоже, что мое приложение встроено в консоль администратора Shopify, можно ли создать общедоступное приложение, которое не встроено?


shopify shopify-app
person Hooman Bahreini    schedule 23.01.2020    source источник
comment
Отображаемая вами ошибка больше связана с соединением ngrok или вашим HTTP-ответом (который может быть кодом ошибки). Я бы посоветовал сначала проверить вывод ngrok на вашем компьютере, так как это может привести вас в наилучшем направлении (убедитесь, что вы видите поступающие запросы)   -  person Eyal H    schedule 23.01.2020

Ответы (1)


arrow_upward
1
arrow_downward

Обновленный ответ

Приложение My Shopify - это канал продаж, и Shopify требует, чтобы все каналы продаж были встроены в консоль администратора (Я усвоил это на собственном горьком опыте)

Чтобы сделать приложение встроенным в консоль администратора Shopify, нам нужно удалить заголовок X-Frame-Options из ответа. Мое приложение, разработанное в ASP.NET MVC, и я добавил следующий код в Global.asax, чтобы удалить указанный заголовок (обратите внимание, что удаление X-Frame-Options делает наш веб-сайт доступным для clickjacking, поэтому удалите заголовок только для этой цели):

Global.asax

protected void Application_PreSendRequestHeaders()
{
    var routeValues = HttpContext.Current.Request.RequestContext.RouteData.Values;
    if (routeValues.ContainsKey("controller"))
    {
        // make sure you only remove the header for a very specific use case
        if (string.Equals((string)routeValues["controller"], "EmbeddedShopifyController", StringComparison.InvariantCultureIgnoreCase))
        {
            Response.Headers.Remove("X-Frame-Options");
        }
    }
}

Оригинальный ответ

Причина этой ошибки заключалась в том, что я настроил свое приложение для встраивания. Чтобы проверить, встроено ли ваше приложение, перейдите на страницу партнеров Shopify:

Приложения - ›Расширения -› Встроенное приложение

введите описание изображения здесь

Нажмите кнопку Управление встроенным приложением, и здесь вы увидите, настроено ли приложение для встраивания или нет. Вы можете включить / отключить этот параметр.

В моем случае я отключил конфигурацию встроенного приложения, и теперь мое приложение работает нормально.

person Hooman Bahreini    schedule 24.01.2020