PHP Ajax JavaScript JSON implements methods for getting weather information

Source: Internet
Author: User
This article mainly introduces the PHP Ajax JavaScript JSON to achieve weather information to get the relevant information, interested in the small partners can refer to

To add a weather forecast function on your website is a very common requirement, and it is not very difficult to realize it. Here are a few simple ways to introduce today.

Use of third-party services

There is a simple way, with the help of http://www.tianqi.com/plugin/ Weather Services on the Internet, we can customize our display shape to achieve the ability to add weather forecasts.

Here is a simple small example:


Copy the Code code as follows:

<iframe width= "420" scrolling= "no" height= "frameborder=" 0 "allowtransparency=" true "src=" http://i.tianqi.com/ Index.php?c=code&id=12&icon=1&num=5 "></iframe>

Indirect way

It is indirect to get the weather information, it is because for us personally, it is impossible to launch satellites by themselves, or to maintain the large amount of the weather forecast services. We do this by using data interfaces provided by other websites.

Ideas

Because of the characteristics of Ajax itself determines not to cross-domain request, so we need to use PHP to try the function of the agent. Specific ideas are as follows:

Client opens our web page based on PHP to obtain client IP using a third-party service to obtain the IP corresponding to the city code call weather interface, according to the city code to obtain the weather information the client obtains the data returned by the server and displays it on the page.

Service to use

Here is a list of common interfaces we use
• IP to the city: "Http://ip.taobao.com/service/getIpInfo.php?ip=XXX"
• View the corresponding city code: http://blog.csdn.net/anbowing/article/details/21936293
• Access the weather interface for data: "http://www.weather.com.cn/adat/sk/". $city _id. " html

Here are a few good interface sites.
• Weather API Interface Daquan

Implementation code

The implementation of the code is divided into three steps. The logic before us to write.
• Get the city that corresponds to the client IP

<?phpheader ("Content-type:text/json;charset=utf-8");//Ajax's own characteristics determine that it cannot cross-domain requests, so use PHP's proxy mode to achieve the collapse and request//$url = ' http:// Www.weather.com.cn/adat/sk/101010100.html ';//1. Get text content information, 2 get URL corresponding Data//$data = file_get_contents ($url);//echo $data ;/////////////////////////////////////idea one//ip-->> City----->>> City Code----->>>> Weather Information// Get the city information for the IP, as well as the encoding http://ip.taobao.com/service.getIpInfo.php?ip=60.205.8.179//get weather information by encoding HTTP// www.weather.com.cn/adat/sk/encoding. Html$client_ip = "60.205.8.179";//$_server[' remote_addr ']; $url = "http:// Ip.taobao.com/service/getipinfo.php?ip= "." $client _ip "; $result = file_get_contents ($url); Echo $result;/////////////////////////////////////idea two?>

At the client, we can see

<script> function Getcitycode () {  var xhr = new XMLHttpRequest ();  Xhr.onreadystatechange = function () {   if (xhr.readystate==4) {    //alert (xhr.responsetext);     Eval (' var citycode= ' +xhr.responsetext);    alert (citycode.data.city);   }  }  Xhr.open (' Get ', './getcityid.php ');  Xhr.send (NULL); }</script>

• Request the city code from the server and pass it to the weather interface.

<?php$city_id = $_get[' city '];//print_r ($GET); Invoking the database code logic, finding the corresponding city codes only needs to be alerted to the city tables we have stored. And the city-coded table basically does not change, we can use it stably. $weather _url = "http://www.weather.com.cn/adat/sk/". $city _id. " HTML "; $weather = file_get_contents ($weather _url); Echo $weather;? >

Full front-end code

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">

Summarize

It is not difficult to add a weather forecast feature on your website. There may be a simpler way, even if it's a process.

The above is the entire content of this article, I hope to be able to help you learn.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.