2012-01-03 8 views
0

私はWebアプリケーションを開発しています。ここでは、JavaScriptでポップアップウィンドウを作成しました。今、私はこの窓の中に天気予報を作りたいと思っています。天気予報を作成する最も簡単な方法は何ですか?

これを行う最も簡単な方法は何ですか?

私はここのようにそれをやった:Get weather from Yahoo with jQuery

$(".popup-button").click(function(evt){ 
//prevent default link behavior 
    evt.preventDefault(); 

//get id from clicked element 
var id = $(this).attr("id"); 

switch (id) { 
    case "popup-button-wetter": 
     //centering with css 
     centerPopup($("#popup-wrapper-wetter")); 
     //load popup 
     loadPopupadditional($("#popup-wrapper-wetter")); 
     //get weather 
     getWeather() 
     break; 
      ...... 


function getWeather() { 
    $.get("http://weather.yahooapis.com/forecastrss?w=782458&u=c", function(data){ 
        console.log("Data Loaded: " + data); 
       }); 
      } 
    }); 

が、その後、私はこのエラーを得た:

XMLHttpRequestがhttp://weather.yahooapis.com/forecastrss?w=782458&u=cをロードすることはできません。 Originファイル://は、Access-Control-Allow-Originによって許可されていません。

この意味は?

答えて

1

javascriptを使用してクロスドメインのajaxリクエストを行うことはできません。

1

私は遅刻していることは知っていますが、天気予報のページを作成していたときも同じ問題が発生しました。 私はGoogleのAPIを使用していますが、比較的簡単にYahooのAPIのためにこれを書き換えることができる必要があります:

は、PHPファイル内でこのような何かを:

<?php 
$lat = explode(".", $_GET["lat"] * 1000000); //latitude returned by JS geolocation 
$lon = explode(".", $_GET["lon"] * 1000000); //longitude returned by JS geolocation 
$api = simplexml_load_string(utf8_encode(file_get_contents("http://www.google.com/ig/api?weather=,,," . $lat[0] . "," . $lon[0] . "&zoom=10&hl=de"))); 
echo $api->weather->current_conditions->temp_c->attributes()->data; //prints the current temperature in °C 
?> 

その後UTFにHTMLページの文字セットを設定します-8正しくä、Oおよびüなどウムラウトを表示するために<head>タグに

<meta charset="utf-8"> 

を挿入することによって。

Tl; dr:PHPを介してXMLファイルを取得し、ローカルPHPファイルにXMLHttpRequestを送信することによって、クロスドメインAJAXブロックをバイパスすることができます。 ;)

関連する問題