我如何使用php中的数组访问Json文件中的数据并回显到html文件

Question

嗨，我有一个json文件，其中包含一个名为urlPhotos的数组字段。我想在PHP中使用echo方法列出我的html页面的urlPhotos列表

我在json文件中的数据具有这种结构

[{
    "caseKey": "4846ccde-8e2c-4360-9381-9d78c12b1ef6",
    "caseNumber": "177",
    "companyName": "Bach",
    "officeId": 37,
    "urlPhotos": [
        "https://boligsystem.flex.dk/public/569f868e-9.jpg", 
        "https://boligsystem.flex.dk/public/520-80276a.jpg", 
        "https://boligsystem.flex.dk/public/569f86763c9.jpg", 
        "https://boligsystem.flex.dk/public/569f86636fd8.jpg"           
    ],

    "timestamp": "09022018073555"
}
{
    "caseKey": "4846ccde-8e2c-4360-9381-9d78c12baaa",
    "caseNumber": "199",
    "companyName": "Bach",
    "officeId": 37,
    "urlPhotos": [      
        "https://boligsystem.flex.dk/public/569f868e-9.jpg", 
        "https://boligsystem.flex.dk/public/520-80276a.jpg", 
        "https://boligsystem.flex.dk/public/569f86763c9.jpg", 
        "https://boligsystem.flex.dk/public/569f86636fd8.jpg"
        "https://boligsystem.flex.dk/public/569f868e-9.jpg", 
        "https://boligsystem.flex.dk/public/520-80276a.jpg", 
        "https://boligsystem.flex.dk/public/569f86763c9.jpg", 
        "https://boligsystem.flex.dk/public/569f86636fd8.jpg"       
        ],
    "timestamp": "11022018073555"
}]

Answer 1

您可以使用json_decode将json数组解码为普通的php数组，然后使用此数组上的foreach来获取urlPhotos之类的

foreach($arr['urlPhotos'] as $t)
{
    echo $t
}

你可以添加list标记到这个foreach

Answer 2

首先，您必须将json文件内容提取到PHP中。一种方法：

$contents = file_get_contents(<your-file-name>);

然后，您必须将此原始JSON字符串转换为JSON对象。由于json是一个数组，你将得到一个数组：

$jsonArray = json_decode($contents);

然后循环遍历此数组是如何到达urlPhotos：

foreach($jsonArray as $o){
  foreach($o->urlPhotos as $photo){
    echo $photo . "<br>";    
  }
}

上面的代码将循环数组并抓取每个对象。然后在每个对象中你有一个urlPhotos属性，这是一个你可以以任何你想要的方式使用的数组。在这种情况下，我们循环遍历每张照片，正如您在上面评论的那样，我们通过php echo回显其内容。

Answer 3

请参阅下面的脚本。我使用纯javascript和Jquery。但你只能使用javascript。

您的数据格式不正确，每个主要花括号和urlPhotos数组中的逗号之间缺少逗号

$(document).ready(function(){
       $("#clickme").click(function(){
          getPhotoUri(MyUris);
        }); 
    });

var MyUris = [
    {
       "caseKey": "4846ccde-8e2c-4360-9381-9d78c12b1ef6",
       "caseNumber": "177",
       "companyName": "Bach",
       "officeId": 37,
       "urlPhotos": [
           "https://boligsystem.flex.dk/public/569f868e-9.jpg", 
           "https://boligsystem.flex.dk/public/520-80276a.jpg", 
           "https://boligsystem.flex.dk/public/569f86763c9.jpg", 
           "https://boligsystem.flex.dk/public/569f86636fd8.jpg"           
       ],
     "timestamp": "09022018073555"
    }, //here you did not put a comma

   {
     "caseKey": "4846ccde-8e2c-4360-9381-9d78c12baaa",
     "caseNumber": "199",
     "companyName": "Bach",
     "officeId": 37,
     "urlPhotos": [      
        "https://boligsystem.flex.dk/public/569f868e-9.jpg", 
        "https://boligsystem.flex.dk/public/520-80276a.jpg", 
        "https://boligsystem.flex.dk/public/569f86763c9.jpg", 
        "https://boligsystem.flex.dk/public/569f86636fd8.jpg",
        //here you did not put a comma 
        "https://boligsystem.flex.dk/public/569f868e-9.jpg", 
        "https://boligsystem.flex.dk/public/520-80276a.jpg", 
        "https://boligsystem.flex.dk/public/569f86763c9.jpg", 
        "https://boligsystem.flex.dk/public/569f86636fd8.jpg"           
        ],

    "timestamp": "11022018073555"
   }
]

function getPhotoUri(arr){
    for(i=0; i <arr.length; i++ ){
        for(y=0; y < arr[i].urlPhotos.length; y++){
            $("#urlphoto").append(arr[i].urlPhotos[y] + "<br> ");
        }
    }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

<button id="clickme">Get your photo</button> 
    <h2> LIST OF YOUR URL PHOTO.</h2>
    <p id="urlphoto"> </p>