拒绝从Shopify执行脚本

时间:2015-01-29 14:22:57

标签: ajax mime-types shopify

我尝试添加商品进行购物,没有任何页面刷新或重定向:

     $.ajax({
            type: 'POST',
            url: 'https://xxx.myshopify.com/cart/add.json',
            dataType: 'jsonp',
            data: 'quantity=1&id=234234234',
            success: function () {
              // show stuff
            }
          });    

但铬说:

 Resource interpreted as Script but transferred with MIME type text/html: "https://xxx.myshopify.com/cart".
(index):1 Refused to execute script from 'https://xxx.myshopify.com/cart/add.json?callback=jQuery21304121434052940458_1422539760164&quantity=1&id=234234234&_=1422539760165' 
because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

我尝试过其他方式,而不是jsonpjson,但后来我做了一个CORS警告。

有没有办法更改预期的MIME类型?

这很奇怪,因为这样做:

 $.ajax({
        type: 'GET',
        url: 'https://xxx.myshopify.com/cart.json',
        dataType: 'jsonp',
        success: function(data) { 
           // get stuff
        }
    }); 

满足shopify商店数据对象。

我发现没有真正的官方shopify javascript API,看起来他们真的不想在不刷新页面或重定向的情况下远程添加东西到购物车。

要清楚,当我尝试使用他们的例子时:

    <form id="shop" action="http://xxx.myshopify.com/cart/add" method="post" >
        <input type="hidden" name="id" value="234234234" />
          <input type="hidden" name="return_to" value="back" />
           <input type="submit" value="BUY STUFF"  />
    </form>    

它会将页面刷新为/#, 我试过了e.preventDefault,但那并没有提交表格。

他们的iframe嵌入没有任何选项可以不重定向。

看,有一种可能性就是创建一个&#39; mock&#39;网站上的购物车&#39;本地&#39;然后最终在一个请求中发送它,并重定向到商店,以便人们可以完成他们的订单,但必须有更好的方法。

最后我查看了:http://mayert-douglas4935.myshopify.com/pages/api 但问题是,它是在shopify商店内使用的,所以在域内,所以改变所有:

url:&#39; /cart/add.js',

该API的ajax代码行:

url:&#39; https://xxx.myshopify.com/cart/add.js&#39;,

它不会起作用,因为它使用&#39; json&#39;而不是&#39; jsonp&#39;,并且更改它将导致相同的上述MIME类型问题。

任何人都知道一些简单的自定义代码,可以将商品添加到购物车中吗?这几乎是我所需要的。从远程添加到购物车,只是异步请求和响应...

更新 我尝试了/change.json而不是/add.json,现在MIME类型错误已经消失,但是ajax请求会返回错误事件。但是,进行了更改...(并且它会返回一个complete事件,并带有.statusText:'error')所以,我可以使用它来构建我的商店的远程端,但是你可以理解,这不是一个真正的解决方案。

1 个答案:

答案 0 :(得分:0)

以下是如何执行此操作的教程: http://docs.shopify.com/manual/configuration/store-customization/page-specific/cart-page/adding-to-the-cart-from-a-remote-website#javascript

从该页面开始,这是一个代码示例:

<a href="http://your.shopify.url/cart/add" onclick="var f = document.createElement('form'); f.style.display = 'none'; this.parentNode.appendChild(f); f.method = 'POST'; f.action = this.href; var v = document.createElement('input'); v.setAttribute('type', 'hidden'); v.setAttribute('name', 'id'); v.setAttribute('value', 'VARIANT-ID'); f.appendChild(v); var r = document.createElement('input'); r.setAttribute('type', 'hidden'); r.setAttribute('name', 'return_to'); r.setAttribute('value', 'back'); f.appendChild(r); f.submit(); return false;">BUY NOW</a>

这里有一个演示:http://11heavens.com/testing-shopify-add-to-cart-functionality-from-another-website-while-staying-put

修改:为了在没有重定向的情况下执行此操作,您可以使用带有iframe的Shopify app proxy。这是一个演示:http://joshubrown.s3-website-us-east-1.amazonaws.com/add-to-cart.html