Question

我一直在努力让基本的JSONP在Dart中工作，而我却陷入困境。阅读this blog post以及此this blog表示我应该使用window.on.message.add(dataReceived);来获取MessageEvent并从事件中检索数据。

Dart抱怨说＆＃34;没有这样的消息＆＃39;消息＆＃39;在活动＆＃34;。另外，我查找了获取MessageEvent的不同方法，但它似乎是完全不相关的东西（WebSockets？），而不是我真正需要的东西。

如果有人能解释发生了什么以及如何在Dart中真正使用JSONP，那就太棒了！

Answer 1

您不需要使用您指向的文章中描述的内容。您可以使用dart:js：

import 'dart:html';
import 'dart:js';

void main() {
  // Create a jsFunction to handle the response.
  context['processData'] = (JsObject jsonDatas) {
    // call with JSON datas
  };

  // make the call
  ScriptElement script = new Element.tag("script");
  script.src = "https://${url}?callback=processData";
  document.body.children.add(script);
}

Answer 2

我最近自己写了blog post，因为我遇到了类似的问题。

我首先介绍了一些先决条件，例如Verifying CORS Compliance和Verifying JSONP Support

我最终注册了更新后的方法：

window.onMessage.listen(dataReceived);

然后我有一个相当简单的方法来动态创建Dart中的脚本标记（我的要求是我必须独占使用Dart并且无法触及网站源文件）：

void _createScriptTag()
{
    String requestString = """function callbackForJsonpApi(s) {
        s.target="dartJsonHandler";
        window.postMessage(JSON.stringify(s), '*');
        }""";
    ScriptElement script = new ScriptElement();
    script.innerHtml = requestString;
    document.body.children.add(script);
}

然后我使用一些简单的逻辑从Dart调用它，为方便起见，我将其包装在方法中。

void getStockQuote(String tickerId)
{   
    String requestString = "http://finance.yahoo.com/webservice/v1/symbols/" + tickerId + "/quote?format=json&callback=callbackForJsonpApi";

    ScriptElement script = new ScriptElement();
    script.src = requestString;
    document.body.children.add(script);
}

如果你正在使用dart:js我发现亚历山大的答案很有用，在提升亚历山大后，我已经更新了我的帖子以包括简化版本：

context['callbackForJsonpApi'] = (JsObject jsonData) 
{
  //Process JSON data here...
};

这显然不需要上面的onMessage和_createScriptTag，并且可以像以前一样调用。

然而，我决定采用这两种方法，因为随着时间的推移我注意到Dart API的变化，如果需要的话可能会有一个好的想法。

Answer 3

语法已更改

window.onMessage.listen(dataReceived);

Dart中的JSONP回调

3 个答案: