时间戳

首页 > 解决方案 > 带有 Jquery 和 Ajax 的 Apache 服务器上的图像的 CORS 策略

jquery - 带有 Jquery 和 Ajax 的 Apache 服务器上的图像的 CORS 策略

问题描述

又是一天，又是一个 cors-policy 问题。这是我第一次遇到图像的 Cors Policy 问题。我已经遇到了一千次 cors 策略的问题，使用 PHP 作为服务器端，使用 Ajax 和 Jquery 作为前端，但是对于图像我从来没有遇到过问题，我真的不明白如何解决这个问题。

服务器端这是我的 .htaccess （并且非常适合休息请求）：

<IfModule mod_rewrite.c>
    RewriteEngine On
    #RewriteBase /
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule (.*) index.php/$1

    RewriteCond %{HTTPS} off
    RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

</IfModule>

# CORS POLICY HERE
<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
    Header set Access-Control-Allow-Headers: "*"
    Header set Access-Control-Allow-Methods: "*"
</IfModule>

<IfModule !mod_rewrite.c>
    ErrorDocument 404 /index.php
</IfModule>

然后这就是我通过 JS 发送我的休息请求的方式：

$.ajax({
    //url:"https://ayco.app/storage/profile_pics/users/andreacorriga.png",
    url: "https://ayco.app", 
    type: "GET",
    headers: {
        "Access-Control-Allow-Origin": "*",  
    },
    crossDomain: true,
    success: async function(data){
        console.log(base64encode(data))
        alert("success")
    },  // success
    error: function(xhr, status){
        alert("error")
    } // error
})

在 JS 示例中，我留下了两个 url（其中一个被注释掉）供您尝试。具有基本 url 的那个可以完美运行，因为 cors 策略设置正确。当我尝试访问图像时，我遇到了通常的问题：

Access to XMLHttpRequest at 'https://ayco.app/storage/profile_pics/users/andreacorriga.png' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我做错了吗？这是服务器端问题还是客户端问题？任何解决方案？

标签： jquerycors

解决方案

推荐阅读