欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

http://shipingzhong.cn/node-admin/22728 22728:1 Access to image from origin 'http://shipingzhong.cn' has been blocked by CORS policy: The request AG chatgpt 有大用 有大大用

http://shipingzhong.cn/node-admin/22728   

22728:1 Access to image at 'http://aaa.bbb-ict.com/sites/default/files/ueditor/1/upload/image/20251114/1763089521692408.png' from origin 'http://shipingzhong.cn' has been blocked by CORS policy: The request client is not a secure context and the resource is in more-private address space `local`.


这个错误是由于浏览器的安全策略(CORS)阻止了跨域资源的访问。具体原因如下:

错误分析:

  1. CORS 策略阻止:浏览器出于安全考虑,默认禁止从一个域名(http://shipingzhong.cn,非 HTTPS)加载另一个域名(http://aaa.bbb-ict.com)的资源(如图片)。

  2. 非安全上下文:你的页面是通过 HTTP(非 HTTPS)协议加载的,而现代浏览器会限制非安全上下文(非 HTTPS)访问某些资源。

  3. 资源地址空间问题:目标资源(图片)的域名可能被浏览器标记为 local(本地或私有地址空间),而你的页面是公开域名,导致权限冲突。


解决方案:

1. 服务端修复(推荐)

  • 启用 CORS 头:在 aaa.bbb-ict.com 的服务端配置中,添加以下响应头:

    http            
    Access-Control-Allow-Origin: * Access-Control-Allow-Headers: * Access-Control-Allow-Methods: *            

           

    或者限制为允许 http://shipingzhong.cn

    http            
    Access-Control-Allow-Origin: http://shipingzhong.cn            

       

  • 强制 HTTPS:将 shipingzhong.cn 升级为 HTTPS(安全上下文),很多现代 API/功能要求 HTTPS。

2. 代理绕过(临时方案)

  • 通过你的后端(如 Node.js/PHP)代理请求图片,避免直接跨域。
    例如:

    php            
    // PHP 代理示例 $image_url = 'http://aaa.bbb-ict.com/.../image.png'; header('Content-Type: image/png'); echo file_get_contents($image_url);            

       

3. 前端临时方案(不推荐)

  • 如果是自有项目,可以尝试以下方法(需权衡安全性):

    html            
    <meta name="referrer" content="no-referrer">            

           

    或使用第三方 CORS 代理服务(如 https://cors-anywhere.herokuapp.com/)。

4. 其他检查

  • 确认图片 URL 是否有效(直接访问 http://aaa.bbb-ict.com/.../image.png 测试)。

  • 如果是内网资源,确保访问权限。


总结:

根本解决需服务端支持 CORS 或升级 HTTPS。如果是测试环境,可临时禁用浏览器安全策略(仅供开发调试,非生产方案)。


普通分类: