web-dev-qa-db-fra.com

Comment résoudre ce problème: CORB (Cross-Origin Read Blocking) a bloqué la réponse cross-origin

L'avertissement est:

jquery-1.9.1.js: 8526 Le blocage de lecture d'origine croisée (CORB) a bloqué la réponse d'origine croisée https://www.metaweather.com/api/location/search /? query = lo avec le type d'application MIME/json. Voir https://www.chromestatus.com/feature/5629709824032768 pour plus de détails.

Mon code est:

<!DOCTYPE html>
<html>
<head>
  <title> Search API </title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css"> 
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
  </script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"> 
  </script> 
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
   <div class="container">
     <h2>API Search Whether</h2>    
     <div class="row">
        <div class="col-md-6">
            <input type="text" name="name" id="name" class="form-control">
        </div>
        <div class="col-md-2">              
            <button type="button" id="search" class="btn btn-primary btn-lg">Search</button>
        </div>
    </div>
    <br><br><br><br>
    <div class="row">
        <table class="table" border="2px">
            <thead>
                <tr style="color:blue; font-weight:bold;">
                    <td >Domain</td>
                    <td>Suffix</td>
                    <td>Expiry Date</td>
                    <td>Created At</td>
                    <td>Country</td>
                </tr>
            </thead>
            <tbody id="tbody">
            </tbody>
        </table>
    </div>
</div>  
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"> 
</script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script>
<script type="text/javascript">
    $("#search").click(function () 
    {
        $("#tbody").html("");           
        var $this = $(this);
        var loadingText = '<i class="fa fa-circle-o-notch fa-spin"></i>Loading...';
        $("#search").attr("disabled", true);
        if ($(this).html() !== loadingText) {
            $this.data('original-text', $(this).html());
            $this.html(loadingText);
        }   
        var name = $('#name').val();        
        var i;
        $.ajax({
            url: "https://www.metaweather.com/api/location/search/?query="+name,
            dataType:'json',
            headers: function(xhr){
                xhr.setRequestHeader('x-xss-protection' ,'1; mode=block');
                xhr.setRequestHeader('Content-Language' ,'en');
                xhr.setRequestHeader('x-content-type-options', 'nosniff');
                xhr.setRequestHeader('strict-transport- security' , 'max-age=2592000; includeSubDomains');
                xhr.setRequestHeader('Vary' , 'Accept-Language, Cookie');
                xhr.setRequestHeader('Allow' , 'GET, HEAD,OPTIONS');
                xhr.setRequestHeader('x-frame-options' ,'DENY');
                xhr.setRequestHeader('Content-Type' , 'application/json');
                xhr.setRequestHeader('X-Cloud-Trace-Context' , 'f2dd29a5a475c5489584b993c3ce670d');
                xhr.setRequestHeader('Date' , 'Thu, 14 Mar 2019 09:43:04 GMT');
                xhr.setRequestHeader('Server' , 'Google Frontend');
                xhr.setRequestHeader('Content-Length' , '100');
            },
            success: function (result) {
                var f = result;
                var content = '';
                var i;
                for (i = 0; i <= f[i] ; i++) {
                    content += "<tr>";
                    content = content+"<td>"+f[i].title+"</td>";
                    content = content + "</tr>";
                }
                $("#tbody").append(content);
                $this.html($this.data('original-text'));
                $("#search").attr("disabled", false);
            }});      
      });
   </script>
</body>

J'ai essayé les 4 dernières heures mais aucune solution ... Merci d'avance pour l'aide ...

jqueryjsonajaxcross-origin-read-blocking
5
Smit Pipaliya

J'ai également rencontré ce problème dans notre Chrome récemment et l'avons fermée en déplaçant toutes les demandes HTTP vers la page d'arrière-plan, comme conseillé par l'équipe Chrome de . Limiter les demandes d'origine croisée dans les pages d'arrière-plan

Si la page d'arrière-plan d'une extension va simplement chercher et relayer n'importe quelle URL du choix d'un script de contenu (agissant effectivement comme un proxy ouvert), des problèmes de sécurité similaires se produisent. Autrement dit, un processus de rendu compromis peut détourner le script de contenu et demander à la page d'arrière-plan de récupérer et de relayer les URL sensibles du choix de l'attaquant. Au lieu de cela, les pages d'arrière-plan ne doivent récupérer que les données des URL que l'auteur de l'extension a l'intention, qui est idéalement un petit ensemble d'URL qui ne met pas en danger les données sensibles de l'utilisateur.

1
Athman