get要求を許可するにはどうすればよいですか？403禁止されたエラー

Question

私は自分のイメージディレクトリにajaxリクエストをしています。これはlocalhostでもうまくいきますが、オンラインにすると403（禁止）エラーが発生します。取得リクエストを許可するにはどうすればよいですか？

$.ajax({  
     url: url, 
     success: function(data) { 
     var parser = new DOMParser(), 
      doc = parser.parseFromString(data, 'text/html'); 
     var rows = doc.querySelector('table').querySelectorAll('tr'); 
     for (var i=0;i<rows.length;i++) { 
      if (rows[i].children[2]) { 
       var img = rows[i].children[2].children[0].getAttribute("href"); 
       if(img.match(/\.(jpeg|jpg|gif|png)$/) != null){ 
        var html = '<li id="" style="background-image: url('+img+')"></li>';    
        $('#nikoSlider ul').append(html) 
       } else { console.log("This is not a valid image type: " + img) } 
      } 
     } 
     nikoSlider(); 
     } 
    }); 

は、私は、PHPファイルにheader('Access-Control-Allow-Origin: *');のようなものを使用することができます。

Answer 1

urlの形式はhttp://primaryman.com/pare/assets/images/{{COLLECTION}}/slider/で、ディレクトリへのパスです。あなたのコメントによれば、AJAXを使ってディレクトリにアクセスすることはできません。

必要なすべてのイメージパスのjsonエンコードされた配列を返す中間的なPHPスクリプトを作成します。その後、AJAXの成功コールバックで、画像を繰り返してDOMに追加します。 COLLECTIONのパスの一部が可変なので、どのパスが使用されていても常にこのPHPスクリプトを呼び出す方法が必要です。あなたのAJAX呼び出しでurlを変更して、PHPスクリプトを直接呼び出し、必要なコレクションにフィードすることをお勧めします。たとえば、あなたがroyceやsummitコレクションにアクセスしようとしているならば、あなたは、PHPスクリプトで

url: '/path/to/slider_images.php?collection=royce //<- or collection=summit 

を使用することになり、あなたが最初に要求したURLのパスを見つけることができると：

$path = "/pare/assets/images/$_GET[collection]/slider/" 

あなたが、その後することができますそれを使用して一致するディレクトリ内のすべての画像ファイルを取得し（画像拡張子を持つファイルのみを選択することを忘れないでください）、$imagesアレイに入れて、ブラウザに戻してください：

echo json_encode($images); 

This solution（先にリンクしたもの）には、すぐに始めるための良いコードがあります。

Answer 2

@パトリックアドバイスありがとう、私はあなたの答えが役に立つと思った。私はこれが私が最適ではないと確信していますが、この特定のプロジェクトのためにうまく動作するようなもので行くことになった。

<?php 

$filenameArray = array(); 
$summit = array(); 
$royce = array(); 
$soundview = array(); 
$merrit = array(); 
$hillcroft = array(); 


$all = array(); 


$handle = opendir(dirname(realpath(__FILE__)).'/assets/images/summit/slider/'); 
    while($file = readdir($handle)){ 
     if($file !== '.' && $file !== '..'){ 
     array_push($filenameArray, "assets/images/summit/slider/$file"); 
     array_push($summit, "assets/images/summit/slider/$file"); 

     } 
    } 
array_push($all, $summit); 


$handle = opendir(dirname(realpath(__FILE__)).'/assets/images/royce/slider/'); 
    while($file = readdir($handle)){ 
     if($file !== '.' && $file !== '..'){ 
     array_push($filenameArray, "assets/images/royce/slider/$file"); 
     array_push($royce, "assets/images/royce/slider/$file"); 

     } 
    } 
array_push($all, $royce); 

$handle = opendir(dirname(realpath(__FILE__)).'/assets/images/soundview/slider/'); 
    while($file = readdir($handle)){ 
     if($file !== '.' && $file !== '..'){ 
     array_push($filenameArray, "assets/images/soundview/slider/$file"); 
      array_push($soundview, "assets/images/soundview/slider/$file"); 

     } 
    } 
array_push($all, $soundview); 

$handle = opendir(dirname(realpath(__FILE__)).'/assets/images/merrit-station/slider/'); 
    while($file = readdir($handle)){ 
     if($file !== '.' && $file !== '..'){ 
      array_push($filenameArray, "assets/images/merrit-station/slider/$file"); 
      array_push($merrit, "assets/images/merrit-station/slider/$file"); 

    } 
    } 
array_push($all, $merrit); 

$handle = opendir(dirname(realpath(__FILE__)).'/assets/images/hillcroft-danbury/slider/'); 
    while($file = readdir($handle)){ 
     if($file !== '.' && $file !== '..'){ 
     array_push($filenameArray, "assets/images/hillcroft-danbury/slider/$file"); 
       array_push($hillcroft, "assets/images/hillcroft-danbury/slider/$file"); 

     } 
    } 
array_push($all, $hillcroft); 

echo json_encode($all); 


?>  

そして、私のJS：私は403 Forbidden error while making an ajax request

allow.phpから重く借り

$(document).ready(function(){/* Loop thru images folder */ 

    var page = ['summit','royce','soundview','merrit-station','hillcroft-danburmer'].indexOf(window.location.href.split('/').pop()) 
    console.log(page); 


    var url = "allow.php"; 
    $.ajax({  
     url: url, 
      dataType: "json", 

     success: function(data) { 
      console.log(data); 
      console.log(data); 
      $.each(data[page], function(i,filename) { 
       console.log(filename); 
     var img = filename; 
     var arr = img.split('/'); 
     console.log(arr[arr.length-3]) 

     if(img.match(/\.(jpeg|jpg|gif|png)$/) != null && arr[arr.length-3] == window.location.href.split('/').pop()){ 
      var html = '<li id="" style="background-image: url('+img+')"></li>';    
      $('#nikoSlider ul').append(html) 
      console.log(html); 
     } else { console.log("This is not a valid image type: " + img) } 


     }) 


     nikoSlider(); 
     } 
    }); 
//rows[i].children[2] $(rows[i].children[2]).find('attr', 'href').context.textContent $(rows[i].children[2]).text() rows[i].children[2].querySelector('a')['href'] 
})