通過組件傳遞的ajax請求燼元

Question

我只想從組件的燼元服務中獲取json請求的值。 這是我的代碼

預測，weather.js（服務）

import Ember from 'ember'; 
    export default Ember.Service.extend({ 
     findWeatherCurrent:function (lat,lng) { 
     return Ember.$.getJSON('https://api.darksky.net/forecast/22b106924ed7e3bcde76608f7f064585/'+ lat +','+lng+'?exclude=minutely,hourly,daily,flags&units=si'); 
     }, 
     findWeatherDaily:function (lat,lng) { 
     return Ember.$.getJSON('https://api.darksky.net/forecast/22b106924ed7e3bcde76608f7f064585/'+ lat +','+lng+'?exclude=minutely,hourly,currently,flags&units=si'); 
     }, 
     findWeatherHourly:function (lat,lng) { 
     return Ember.$.getJSON('https://api.darksky.net/forecast/22b106924ed7e3bcde76608f7f064585/'+ lat +','+lng+'?exclude=minutely,daily,currently,flags&units=si'); 
     } 
    }); 

天氣display.js（組件）

import Ember from 'ember'; 

export default Ember.Component.extend({ 
    forecastWeather:Ember.inject.service(), 
    willRender(){ 
    let lat = this.get('lat'); 
    let lng = this.get('lng'); 
    this.get('forecastWeather').findWeatherCurrent(lat,lng).then(data => { 
     this.set('currents', data); 
     console.log(data); 
    }); 
    } 
}); 

jsonRespon

{ 

    "latitude": 37.8267, 
    "longitude": -122.4233, 
    "timezone": "America/Los_Angeles", 
    "offset": -7, 
    "currently": { 
     "time": 1489488513, 
     "summary": "Clear", 
     "icon": "clear-night", 
     "nearestStormDistance": 47, 
     "nearestStormBearing": 87, 
     "precipIntensity": 0, 
     "precipProbability": 0, 
     "temperature": 13.54, 
     "apparentTemperature": 13.54, 
     "dewPoint": 8.59, 
     "humidity": 0.72, 
     "windSpeed": 0.87, 
     "windBearing": 46, 
     "visibility": 12.46, 
     "cloudCover": 0.08, 
     "pressure": 1016.58, 
     "ozone": 279.62 
    } 

} 

天氣display.hbs

<p id="word_on_change" class="font_black font-white word">{{currents.currently.windSpeed}}</p> 

我只是想傳遞一個風速值從JSON哈佛商學院的模板，但它不工作。 誰能解決這個:(

Answer 1

要處理的$.getJSON其重要結果知道你jQuery版本，其中一個在jQuery 3最重要的變化是，jQuery.Deferred is now Promises/A+兼容。

可能你使用的是jQuery版本預3.0，這意味着你必須在Deferred變換爲Promise可與Ember.RSVP.resolve()完成。

然而，這是不是你的問題！

您的實際問題

我第一次建立一個twiddle with your code。考慮下次自己做這件事;-)。 在那裏你看到控制檯中的錯誤：

XMLHttpRequest無法加載https://api.darksky.net/forecast/22b106924ed7e3bcde76608f7f064585/46.9483,7.4515?exclude=minutely,hourly,daily,flags&units=si。請求的資源上沒有「Access-Control-Allow-Origin」標題。因此不允許原產地'null'訪問。

這是因爲darksky有disabled CORS for their API。這意味着你無法直接從瀏覽器JavaScript中訪問API。

您必須請求您自己的Web服務器，然後可以對darksky API執行請求。

請check the references about CORS。

但請求返回的開發工具200 OK或HTTP調試

是。這就是CORS的工作原理。數據已成功返回到瀏覽器的應用程序，但由於CORS標題丟失瀏覽器不允許您的網站訪問響應。這是一個重要的安全功能。