2016-12-30 5 views
0

私はnode.js(+ express)を使ってapiをビルドしようとしました。 Firefoxはそれを表示しますが、p5.jsからloadJSONをロードしようとすると奇妙なエラーが表示されます。ここ は(:modulus: create api with node.jsこれに基づいて):Node.jsのコードがあるnode.jsでapiを作る

express = require("express"); 
app = express(); 
app.listen(4000); 

var quotes = [ 
    { author : 'Audrey Hepburn', text : "Nothing is impossible, the word itself says 'I'm possible'!"}, 
    { author : 'Walt Disney', text : "You may not realize it when it happens, but a kick in the teeth may be the best thing in the world for you"}, 
    { author : 'Unknown', text : "Even the greatest was once a beginner. Don't be afraid to take that first step."}, 
    { author : 'Neale Donald Walsch', text : "You are afraid to die, and you're afraid to live. What a way to exist."} 
]; 


app.get('/', function(req, res){ 
    res.json(quotes); 
}) 

p5.js:

function setup() { 
    loadJSON("http://localhost:4000/", getJson, error1); 
} 

function getJson(data) { 
    console.log("json get"); 
    console.log(data) 
} 

function error1(err) { 
    console.log("Error: "); 
    console.log(err); 
} 

エラー:

"Error: " 
{ 
    "statusText": "", 
    "status": 0, 
    "responseURL": "", 
    "response": "", 
    "responseType": "", 
    "responseXML": null, 
    "responseText": "", 
    "upload": { 
    "ontimeout": null, 
    "onprogress": null, 
    "onloadstart": null, 
    "onloadend": null, 
    "onload": null, 
    "onerror": null, 
    "onabort": null 
    }, 
    "withCredentials": false, 
    "readyState": 4, 
    "timeout": 0, 
    "ontimeout": null, 
    "onprogress": null, 
    "onloadstart": null, 
    "onloadend": null, 
    "onload": null, 
    "onerror": null, 
    "onabort": null 
} 

私は 'JSONP' を使用して試してみましたが、それはこれを示す:

5209: Uncaught TypeError: Cannot read property 'responseText' of undefined 

私はnode.js v4.2.2とp5.js v0.5.4を2016年10月1日に持っています。

+1

ブラウザからAPIにアクセスする際に、クロスオリジンの問題があると思います。ブラウザのコンソールに表示されるエラーは何ですか?もしそうなら、サーバー上でクロスオリジンアクセスを許可するか、同じWebサーバーからWebページをロードすることで修正できます(apiを同じ起点にする)。 – jfriend00

+0

jfriendと同じように、JavaScriptコンソールとネットワークタブでエラーをチェックする必要があります。また、P5.jsのものは、問題とは関係がないので、取り除きたいかもしれません。基本的なJavaScriptを使用するだけで、人々はあなたの質問を少しは理解しやすくなります。 –

+0

@ jfriend00 firefoxでp5.jsのファイルを実行しましたが、コンソールに新しいエラー(クロスオリジンアクセス)が見つかりました。それを私が直した。私はこれを答えとして掲示するべきだと思います。 –

答えて

1

ブラウザからAPIにアクセスすると、クロス起点の問題が発生している可能性があります。

ブラウザコンソールにはどのようなエラーがありますか?もしそうなら、サーバー上でクロスオリジンアクセスを許可するか、同じWebサーバーからWebページをロードすることで修正できます(apiを同じ起点にする)。