如何从另一个域（跨域）获取由php脚本生成的html

Question

i am wondering how can get the HTML code which is generated by a cross-domain php script?

Normally if i'm on the same domain , i would use Ajax as follows:

$.ajax({
    type: 'GET',
    url: 'user.php',
    data: 'user_id=user_id', //assuming user_id value was already set.
    success: function(html)
    {
        $('#info').empty().html(html);
    }  
});

But i am now working on a different domain than my server domain. Which means i use JSON to send data back and to my server php scripts. However , i know that JSON only send data but not a complete HTML CODE(or am i missing out some point here?)

So , how can i get the html code generated by a cross-domain php script(server) to my web page(another domain).

Answer 1

using javascript you can do the same as if it was JSON, it's called JSONP the P is with padding .

Or you can call it JSON with callback:

// Request Page

myCallback("Some string or Object to parse to your site");

// Your Page

window["myCallback"] = function(string_or_object) {
    // Here you can do everything with the parsed data
}

Create a script-tag and include the request page. Make sure to define your callback before including the script-tag

or you can use jQuery's ajax method with dataType set to jsonp :

$.ajax({
    "url": "requst_page.php",
    "dataType": "jsonp",
    "success": function(string_or_object) {
        // Here you can do everything with the parsed data
    }
})

Look at http://remysharp.com/2007/10/08/what-is-jsonp/

EDIT TO COMMENT:

JSON is right an object normally starts with braces {} .

Demo JSON:

{
    "myString": "myValue",
    "myOtherString": ["My", "Other", "Value", "This", "Is", "An", "Array"]
}

But using the same method as JSONP you can parse an string instead of the weird looking thing starting and ending with {} .

as myCallback in my example 1: myCallback("HERE I PASS A STRING INSTEAD OF AN OBJECT") . See the "" . "STRING GOES IN HERE"

if it was JSON and taken usage of my DEMO JSON it would look like this:

myCallback({
    "myString": "myValue",
    "myOtherString": ["My", "Other", "Value", "This", "Is", "An", "Array"]
})

Answer 2

JS:

$.ajax({
    type: 'GET',
    url: 'curl.php',
    data: 'user_id=user_id', //assuming user_id value was already set.
    success: function(html)
    {
        $('#info').empty().html(html);
    }  
});

curl.php;

function get_data($url){
  $ch = curl_init();
  $timeout = 5;
  curl_setopt($ch,CURLOPT_URL,$url);
  curl_setopt($ch,CURLOPT_RETURNTRANSFER,1);
  curl_setopt($ch,CURLOPT_CONNECTTIMEOUT,$timeout);
  $data = curl_exec($ch);
  curl_close($ch);
  return $data;
}
$user_id = $_GET['user_id'];
$url= "http://www.example.com/user.php?user_id=".$user_id;
echo get_data($url);

Answer 3

This can be done through jsonp. Following is an example.

$.ajax({
   url: "example.com/respond.php",
   data: {id: id},
   dataType: "jsonp",
   jsonp : "callback",
   jsonpCallback: "jsonpcallback"
}); 

respond.php

<?php
header("content-type: application/json"); 

if (isset($_GET['id'])) $rtnjsonobj->id = $_GET['id']; 
$rtnjsonobj->message = "This is the message from cross domain";


echo $_GET['callback']. '('. json_encode($rtnjsonobj) . ')';    
?>

Answer 4

You can set up a proxy on your domain and use CURL to get the json from other domain. You then send request to this proxy.

Alternately you would need to set up the other domain to process request as jsonp in order to be able to access directly with ajax

Answer 5

您必须使用JSONP或告诉其他站点的网站所有者添加Access-Control-Allow-Origin标头。

Answer 6

I also get same problem when access cross domain using ajax. Then I solve it by make the ajax call to same domain. Then on that php script I apply following code block. This will get the content from cros domain and out put the same to ajax call.

$content = file_get_contents('http://crossdomain.com');
    echo $content;