2017-10-13 88 views
0

我想按照這個文件約django and graphql如何使用getql方法與graphql一起使用ajax?

https://www.techiediaries.com/django-graphql-tutorial/graphene/

我只有一半的地方,我們可以做的graphql視圖測試,使我們的查詢。

然後我停下來,試圖做一些前端工作,使阿賈克斯

查詢在讀

https://blog.graph.cool/how-to-use-graphql-with-jquery-51786f0a59cb

即使在博客,它使用post。我相信使用get不應該有太大的不同。

所以我試圖使query成一個字符串,然後JSON.stringify他們在把它傳遞到後端django但我不斷收到錯誤

這是錯誤我

XMLHttpRequest cannot load localhost:8000/graphql/?{"query":"query { allProducts {id sku title description } }"}. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

這是html + jquery

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title></title> 
</head> 
<body> 
    <button class="graphql-test">CLICK</button> 
</body> 
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script> 
    <script> 
     $(function(){ 
      $('.graphql-test').on('click', function(e){ 
       e.preventDefault(); 


       var query = "query { allProducts {id sku title description } }"; 

       $.ajax({ 
        method: 'get', 
        url: 'localhost:8000/graphql/', 
        data: JSON.stringify({"query": query}), 
        contentType: 'application/json', 
        success: function(data){ 
         console.log(data); 
        }, 
        error: function(data){ 
         console.log(data); 
        } 

       }) 
      }) 
     }); 
    </script> 
</html> 
+0

沒有我的回答下面爲您解決? –

+0

@MikeGorski沒有運氣:( – Dora

回答

2

看起來你需要改變你的ajax調用來包含完整的URL。

變化

url: 'localhost:8000/graphql/' 

url: 'http://localhost:8000/graphql/' 
+0

我只是試圖...沒有運氣:( – Dora

+0

讓我去雖然:D另一個愚蠢的錯誤,我有這就是爲什麼它不工作 – Dora

相關問題