【问题标题】:Show weather based on users location根据用户位置显示天气
【发布时间】:2012-08-21 00:21:52
【问题描述】:

我正在使用根据我插入的 Yahoo API URL 更改我的 wordpress 网站背景的代码。有没有办法让它在没有任何数据库的情况下自动显示访客天气?我虽然使用过 Google 的 API,但我是编程新手,不知道如何在我的网站中实现它。请帮忙! 代码可以看这里:http://css-tricks.com/using-weather-data-to-change-your-websites-apperance-through-php-and-css/

因为我是 PHP 新手,所以请彻底 谢谢!

【问题讨论】:

    标签: php wordpress location weather


    【解决方案1】:

    您需要一个 API 用于将访问者 IP 地址映射到位置 (ipapi.co),还需要一个 API 来获取该位置的天气预报 (openweathermap.org)。以下代码用于 php(服务器端):

    # Part 1 (get latitude & longitude)
    $ip = '1.2.3.4';
    $api_1 = 'https://ipapi.co/' . $ip . '/latlong/';
    $location = file_get_contents($api_1);
    $point = explode(",", $location);
    
    # Part 2 (get weather forecast)
    $api_2 = 'http://api.openweathermap.org/data/2.5/weather?lat=' . $point[0] . '&lon=' . $point[1] . '&appid=API_KEY';
    $weather = file_get_contents($api_2);
    

    【讨论】:

    • 你也可以得到扩展预测$api_3 = 'http://api.openweathermap.org/data/2.5/forecast?lat=' . $point[0] . '&lon=' . $point[1] . '&appid=' . $api_key; $forecast = file_get_contents($api_3);
    【解决方案2】:

    这将使用来自Data Science Toolkit 的开源IP2Coordinates service 从其IP 地址获取用户的邮政编码。

    市面上有更准确的地理位置 API,但这个 API 完全免费,而且使用起来非常简单。如果我在生产站点上开发它,我会使用 HTML5 Geolocation 作为我的主要方法,并回退到更好的 IP 地理定位器,例如 Max Mind

    请注意,这仅适用于您网站的美国用户。您可能应该将更详细的数据传递给其他 Yahoo 地点 API 之一,以获取其中一个 WOEID 以供使用(或选择不同的天气 API)。

    这是给你的代码。将其放在示例代码中的 <?php 标记之后。一旦你确定它工作正常,注释掉所有以print开头的行。

    //Get the user's IP address
    $user_ip = $_SERVER['REMOTE_ADDR'];
    //The Data Science Toolkit URL
    $url = 'http://www.datasciencetoolkit.org/ip2coordinates/';
    //Find the user's location from their IP. 
    //*** You need the get_data function from the sample code
    $raw_geocode = json_decode( get_data( $url . $user_ip) );
    //Check if the user is in the US
    if ('US' === $raw_geocode->$user_ip->country_code) {
      //If yes, store their zip code in a variable, and print it
      $zip_code = $raw_geocode->$user_ip->postal_code;
      printf('<p>Your zip code is: %s</p>', $raw_geocode->$user_ip->postal_code);
    } else {
      //If the user isn't in the US, set a sip code that will work.
      $zip_code = '97211';
      //and print an error
      printf('<p>Sorry, this app does not work in %s.</p>', $raw_geocode->$user_ip->country_name);
    }
    
    //Print the raw data for debugging.
    printf('<pre>%s</pre>', print_r($raw_geocode, true));
    

    现在将示例代码中以$data = 开头的行更改为:

    $data = get_data("http://weather.yahooapis.com/forecastrss?p={$zip_code}&u=f");
    

    【讨论】:

    • 我需要替换什么才能使此代码正常工作(或者它是否开箱即用)?抱歉,直到明天我才能获得比赛。非常感谢你的代码,你应该把它发布到 CSS 技巧或其他东西上;我认为这是唯一可以做到这一点的教程之一!
    • 完美运行!!!我所要做的就是删除它打印文本的部分(它弄乱了我的 wp 主题),它就像一个魅力。你有一个网站吗?我很想在页脚中为您添加一个功劳!
    • 感谢您的赞誉。如果您想添加信用,可以使用getwellgabby.org
    • 那个网站是你做的吗?非常好。
    • 我正在将它添加到我的网站(稍后会更新)。我会尽快发布链接!
    【解决方案3】:

    使用ipinfo.ioOpenWeatherMap

    Javascript:

    <script type="text/javascript" src="jquery.simpleopenweather.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $.get("http://ipinfo.io", function (response) {
                $("#weather").attr('data-simpleopenweather-city', response.city).simpleopenweather({template: '<h2>'+'{{temperature}} '+'&deg;'+'C'+'<h2>', units: 'metric'});
            }, "jsonp");
        });
    </script>
    

    HTML:

    <div id="weather" class="simpleopenweather" data-simpleopenweather-city=""></div>
    

    它将显示类似 6.3 ºC

    【讨论】:

      【解决方案4】:
      ***You can get data about the location with use third-party API. for example:http://ip-api.com/.**
      You get your location weather data from OpenWeatherMap service using the ip-api. its help you to get visitor location weather.*
      
      
      
       var getIP = 'http://ip-api.com/json/';
          var openWeatherMap = 'http://api.openweathermap.org/data/2.5/weather'
          $.getJSON(getIP).done(function(location) {
              $.getJSON(openWeatherMap, {
                  lat: location.lat,
                  lon: location.lon,
                  units: 'metric',
                  APPID: 'Your-Openweather-Apikey'
              }).done(function(weather) {
                $('#weather').append(weather.main.temp);
                  console.log(weather);
              })
          })
      

      HTML:

      <div id="weather"> </div>
      

      它显示您当前的天气温度。

      【讨论】:

        猜你喜欢
        • 2018-09-02
        • 1970-01-01
        • 2017-12-27
        • 2015-07-06
        • 1970-01-01
        • 2017-04-03
        • 1970-01-01
        • 2013-12-12
        • 1970-01-01
        相关资源
        最近更新 更多