2017-10-16 18 views
1

Buyボタンを使用して、meteor jsのWebサイトに接続して買い物をする最良の方法は不明です。 http://shopify.github.io/js-buy-sdk/ - - はShopifyのAPIをinitializieに直接、私はこの例からはありpackage.jsonmeteor jsウェブサイトにshopify buyボタンを追加

}, 
    "dependencies": { 
    "babel-runtime": "^6.26.0", 
    "bcrypt": "^1.0.3", 
    "shopify-buy": "^0.7.1", 
    "shopify-promise": "0.0.5", 
    "simpl-schema": "^0.3.2" 
    }, 

に表示され

meteor npm install --save shopify-buy 
meteor npm install --save shopify-promise 

これらのパッケージを使用してshopify-買うとshopify-約束のNPMパッケージをインポートhttp://shopify.github.io/js-buy-sdk/examples/

<em>After fetching a product with the product ID we use the promise function to generate some markup with the required attributes and content, and add it inside our HTML container element.</em> 

client.fetchProduct('your-product-id').then(function(product) { 

    var html = 
    "<img class='product__image' src='" + product.selectedVariantImage.src + "' >" + 
    "<h2 class='product__title'>" + product.title + "</h2>" + 
    "<a class='product__buy' href='" + 
    product.selectedVariant.checkoutUrl(1) + 
    "'>Buy Now!</a>"; 

    $('#product-1').html(html); 

}); 

しかし、私はデータのみをバック渡す必要があるため、私は流星jsのテンプレートに戻って、このHTMLを渡す方法がわかりません。

上記と同様のJSコードを使用して、各製品にShopifyBuyUrlフィールドとしてShopifyボタンのURLを追加しようとしました。私は上記のコードはShopifyで正常に認証し、shopClientインスタンスを作成することができます

Meteor.startup(function() { 
     var shopifyBuyUrl = require('shopify-buy'); 

     const shopClient = shopifyBuyUrl.buildClient({ 
      api_key: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", 
      accessToken: 'yyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy', 
      domain: 'test1.myshopify.com', 
      appId: '6' 
    }); 
    [ ... then I have code here that loads the product categories array - this array has 6 categories and an array of products within each category ...] 
    [next I try and pre-fill the shopifyBuyUrl value for each product] 

    for (var i=0; i < 6; i++) { 
      // fetch a product using resource id 
      for (var j=0; j < products[i].length; j++) { 
       // shopify product id is hardcoded for now 
       products[i][j].shopifyProductId='12836712587'; 

       shopClient.fetchProduct('12836712587').then(function(product) { 

       products[i][j].shopifyBuyUrl=product.selectedVariant.checkoutUrl(1); 
       }) 
        .catch(function() { 
          console.log('Request failed'); 
        }); 
       } 
      }  

     console.log('Inserting categories into MongoDB ...'); 
     for (var i=0; i < 6; i++) { 
      Categories.insert(
       { 
        img_alt:name[i], 
        img_src:src[i], 
        desc:desc[i], 
        products:products[i], 
       }); 
     } 
} 

サーバー/ startup.jsでこれを行います。 Shopify Buy URLを作成するためのshopify呼び出しが成功する場合があり、'要求に失敗しました'というメッセージのログに失敗することがあります。メッセージ。同一の製品IDを繰り返し使用することに失敗したかどうかは不明です。

上記のようにShopify APIを直接使用するのか、流星ショップパッケージを使用するのか不明なので、https://github.com/froatsnook/meteor-shopifyパッケージをプロジェクトに追加して、このパッケージで認証が機能しました。しかし、このパッケージを使ってShopify Buyを有効にする方法は、パッケージAPI /デモから明らかではありません。

したがって、全体的には、ShopifyをMeteor JSで使用するにはどのような最適な方法が正しいのか分かりません。 froatsnookは行く方法ですか、もはや適用されませんか?理想的には、Shopifyに直接行くのが最も良いようですが、流星とどのように動作するかはわかりません。

Shopify Buy ButtonをMeteor JSプロジェクトに追加する際の助けに感謝します。

答えて

0

修正などの

使用には、このリンクhttps://help.shopify.com/manual/sell-online/buy-button/create-buy-buttonに基づいています。コードはページの本文に埋め込まれています。私は各製品のソースデータにshopify prod idとshopify prodの変数を格納します。流通している製品データの全部または一部を取得したり、流星群のウェブサイトが保存しているMongoDBのデータを利用することが可能です。

products[i][j].shopifyBuyUrl=product.selectedVariant.checkoutUrl(1);を呼び出した結果から購入ボタンのURLを作成することに基づいて、私が最初に試したアプローチがうまくいくかどうかはわかりません。

1

ライブラリを使用する前に必要ですか?このような

何かが行う必要があります。

var ShopifyBuy = require('shopify-buy'); 

それはとても少ない情報を確認するために何が起こっているかを言うのは難しいです。

編集:この

const shopClient = ShopifyBuy.buildClient({ 
    accessToken: 'bf081e860bc9dc1ce0654fdfbc20892d', 
    appId: 6, 
    domain: 'embeds.myshopify.com' 
}); 
+0

私はvarを追加しましたが、私は 'W20171016-21:19:23を取得しました。685(1)? (STDERR)エラー:新しいConfig()はオプション 'accessToken''を必要とします。 – striker77

+0

'var'を 'const'に変更し、アクセストークンを追加しました。ありがとうございました。今すぐ、私の製品注文フォームに購入ボタンを追加するだけです。 server/startup.jsに配列を作成するときに、商品の配列に「Buy Button」URLを追加することを考えています。ここで '1'が何を指しているのかはっきりしていませんが? 'product.selectedVariant.checkoutUrl(1)' – striker77

+0

@ striker77 constへのvarは、動作するかどうかには影響しません。 'product.selectedVariant.checkoutUrl(1)'で何を意味するのかよくわかりません。 私の答えが正しいと選択したことを忘れないでください! :) – bezzoon

関連する問題