webOS / Ares: читать JSON из URL, назначать метке - PullRequest
Новая
       6

webOS / Ares: читать JSON из URL, назначать метке

1 голос
/ 08 августа 2011

Я использовал инструмент webOS Ares , чтобы создать относительно простое приложение.Он отображает изображение, а под изображением находятся две метки.Один из них статический, а другой ярлык должен обновляться новой информацией, касаясь изображения.

Когда я нажимаю на изображение, я хочу получить объект JSON через URL (http://jonathanstark.com/card/api/latest). ТипичныйВозвращаемый JSON выглядит следующим образом: 

{"balance":{"amount":"0","amount_formatted":"$0.00","balance_id":"28087","created_at":"2011-08-09T12:17:02-0700","message":"My balance is $0.00 as of Aug 9th at 3:17pm EDT (America\/New_York)"}}

Я хочу разобрать поле JSON "amount_formatted" и присвоить результат динамической метке (называемой cardBalance в main-chrome.js). Я знаю, чтоJSON должен возвращать один объект в соответствии с API.

Если все пойдет хорошо, я создам дополнительную метку и преобразую / назначу поле «creation_at» для дополнительной метки, но я хочу пройтись до запуска.

У меня возникли проблемы с использованием AJAX для получения JSON, синтаксического анализа JSON и назначения строки для одной из меток.

После того, как я это заработаю, я планирую увидетьесли я могу загрузить этот результат при загрузке приложения, вместо того, чтобы сначала потребовать от пользователя нажатия.

Пока что это мой код в файле main-assistant.js. jCard - это изображение. Код: 

function MainAssistant(argFromPusher) {}

MainAssistant.prototype = {
    setup: function() {
        Ares.setupSceneAssistant(this);
    },
    cleanup: function() {
        Ares.cleanupSceneAssistant(this);
    },
    giveCoffeeTap: function(inSender, event) {
        window.location = "http://jonathanstark.com/card/#give-a-coffee";
    },
    jcardImageTap: function(inSender, event) {
        //get "amount_formatted" in JSON from http://jonathanstark.com/card/api/latest
        //and assign it to the "updatedBalance" label.
        // I need to use Ajax.Request here.
        Mojo.Log.info("Requesting latest card balance from Jonathan's Card");
        var balanceRequest = new Ajax.Request("http://jonathanstark.com/card/api/latest", {
            method: 'get',
            evalJSON: 'false',
            onSuccess: this.balanceRequestSuccess.bind(this),
            onFailure: this.balanceRequestFailure.bind(this)
        });
        //After I can get the balance working, also get "created_at", parse it, and reformat it in the local time prefs.
    },
    //Test
    balanceRequestSuccess: function(balanceResponse) {
        //Chrome says that the page is returning X-JSON.
    balanceJSON = balanceResponse.headerJSON;
        var balanceAmtFromWeb = balanceJSON.getElementsByTagName("amount_formatted");
        Mojo.Log.info(balanceAmtFromWeb[0]);
        //The label I wish to update is named "updatedBalance" in main-chrome.js
        updatedBalance.label = balanceAmtFromWeb[0];
    },
    balanceRequestFailure: function(balanceResponse) {
        Mojo.Log.info("Failed to get the card balance:  " + balanceResponse.getAllHeaders());
        Mojo.Log.info(balanceResponse.responseText);
        Mojo.Controller.errorDialog("Failed to load the latest card balance.");
    },
    //End test
    btnGiveCoffeeTap: function(inSender, event) {
        window.location = "http://jonathanstark.com/card/#give-a-coffee";
    }
};

Вот снимок экрана приложения, работающего в браузере Chrome: Ares

В браузере я получаю некоторые дополнительные ошибки, которых не было в программе просмотра журнала Ares: 

XMLHttpRequest cannot load http://jonathanstark.com/card/api/latest. Origin https://ares.palm.com is not allowed by Access-Control-Allow-Origin.

и 

Refused to get unsafe header "X-JSON"

Любая помощь приветствуется.

1 Ответ

1 голос
/ 09 августа 2011

Ajax - правильный инструмент для работы.Поскольку webOS поставляется с библиотекой Prototype, попробуйте использовать эту функцию Ajax.Request для выполнения этой работы.Чтобы увидеть некоторые примеры этого, вы можете проверить исходный код написанного мной приложения для WebOS Plogger, которое обращается к Blogger на webOS с помощью вызовов Ajax.В частности, источник моего post-list-assistant , вероятно, является наиболее чистым для понимания.

Ajax - это именно то, что вам нужно для получения данных, даже еслииногда это кажется излишним, поскольку это один из немногих способов получить асинхронное поведение в JavaScript.В противном случае вы получите код, который вешает интерфейс во время ожидания ответа от сервера (JavaScript является однопоточным).

...