如何解析PHP json_encode生成的链接数据？JS代码无响应求助

首先得说，你的代码逻辑有点偏了——你现在只是解析了一个包含URL的JSON字符串，但并没有真正去请求这个PHP接口获取数据，而且alert对象的方式也不对，所以才没看到预期的内容。咱们一步步来修正：

先搞懂你原代码的问题 #

你写的这段：

var link = '{"url":"http://itspower.net/fullAPI.php"}';
var obj = JSON.parse(link);
alert(obj);

其实是把一个写死的JSON字符串转成了对象，但alert(obj)的时候，JS只会把对象转换成[object Object]这个字符串（如果没弹出，大概率是浏览器弹窗被拦截了）。更重要的是：你根本没去请求那个PHP接口拿数据啊！

正确的做法：用AJAX请求获取接口数据 #

你的需求是从PHP接口拿到json_encode生成的数据，那得先发起请求到这个接口，再解析返回的JSON。下面是可以直接用的代码：

window.onload = function() {
    autoRefreshRadio();
};

function autoRefreshRadio() {
    // 创建一个AJAX请求对象
    const request = new XMLHttpRequest();
    // 设置请求的方式和目标接口地址
    request.open('GET', 'http://itspower.net/fullAPI.php', true);
    // 告诉浏览器我们要接收JSON格式的响应
    request.responseType = 'json';

    // 请求成功后的处理逻辑
    request.onload = function() {
        // 先判断请求是否成功（状态码200-299是成功范围）
        if (request.status >= 200 && request.status < 300) {
            // 这里的response就是接口返回的JSON对象，直接存变量就行
            const apiData = request.response;
            // 用console.log看数据更清楚（按F12打开浏览器控制台查看）
            console.log('拿到的数据：', apiData);
            // 如果要弹窗显示具体内容，比如接口返回的某个字段，比如url
            alert('接口返回的URL：' + apiData.url);
        } else {
            alert('请求失败啦，状态码：' + request.status);
        }
    };

    // 请求出错的处理
    request.onerror = function() {
        alert('网络出问题啦，检查下接口地址或者网络连接～');
    };

    // 发送请求
    request.send();
}

给JS新手的小提示 #

1. 调试的时候尽量用console.log()代替alert()，因为console.log能完整显示对象的所有属性，在浏览器F12的控制台里看非常清楚，不像alert只能显示字符串。
2. 如果运行后还是没拿到数据，先检查浏览器控制台有没有报错：
   • 如果是跨域错误，那需要在PHP接口的代码里加一句header("Access-Control-Allow-Origin: *");（允许所有域名访问）。
   • 如果是JSON解析错误，说明PHP返回的不是合法的JSON，你可以先把request.responseType = 'json'改成request.responseText，然后console.log(request.responseText)看看返回的原始内容是什么。

内容的提问来源于stack exchange，提问作者Aquired