nginx报跨域怎么办?get还跨域?

无论是ajax get请求,还是link方式:

<link rel="preload" as="font" crossorigin href="https://*****/***.ttf">

都发现报跨域,这是什么问题?

这台服务器换过IP,换IP后,导致服务器上某些程序异常,大部分都卸载重装了,nginx也重装了,以前也没遇到这种问题。
不知道是nginx缺少什么配置,还是换IP导致的服务器环境有问题了?
有没有大神知道如何解决?

阅读 768
avatarAI BotBETA

首先,要明确什么是"跨域"。在Web环境中,由于浏览器的同源策略,来自不同源的资源不能共享。这里的"同源"指的是协议、域名、端口完全相同。所以,当浏览器尝试获取其他源的资源时,就会发生"跨域"。

跨域问题常见于AJAX请求和HTML链接。对于AJAX请求,可以使用XMLHttpRequestwithCredentials属性来发送带有身份验证信息的请求,或者使用CORS(跨源资源共享)策略来允许跨域请求。

对于HTML链接,可以使用crossorigin属性来指定跨域策略。例如,你的代码:

<link rel="preload" as="font" crossorigin href="https://*****/***.ttf">

这里的crossorigin属性就是用来处理跨域问题的。如果这个属性没有指定,那么默认情况下,加载的资源会被限制在本源。也就是说,如果这个链接是在一个不是https://*****/***.ttf的源上加载的,那么它就不能加载这个字体。

现在的问题是,你的nginx报了跨域。这可能是因为nginx没有正确地配置CORS策略。你可以尝试在nginx的配置文件中添加以下内容:

location ~* \.(eot|ttf|woff|woff2)$ {
    add_header Access-Control-Allow-Origin "*";
    add_header Access-Control-Allow-Methods "GET";
}

这段配置会允许所有来源的字体文件进行跨域请求。当然,你也可以将*替换为特定的源。

另外,你说服务器换过IP后出现了这个问题。这可能是因为一些设置或者配置在换IP的过程中被改变了。如果服务器上的应用程序有依赖于IP的硬编码,那么当IP改变时,这些应用程序可能会出问题。所以,如果可能的话,最好是在服务器换IP后,检查并更新所有硬编码的IP。

最后,如果以上方法都不能解决问题,那么可能需要进一步检查服务器的环境。可以尝试查看服务器的错误日志,或者尝试在不同的浏览器或者网络环境下测试这个问题,看看是否有所改善。

1 个回答

你需要nginx配置一下跨域

location / {
    # 允许跨域的请求,可以自定义变量$http_origin,*表示所有
    add_header 'Access-Control-Allow-Origin' *;
    # 允许携带cookie请求
    add_header 'Access-Control-Allow-Credentials' 'true';
    # 允许跨域请求的方法:GET,POST,OPTIONS,PUT
    add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS,PUT';
    # 允许请求时携带的头部信息,*表示所有
    add_header 'Access-Control-Allow-Headers' *;
    # 允许发送按段获取资源的请求
    add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
    # 一定要有!!!否则Post请求无法进行跨域!
    # 在发送Post跨域请求前,会以Options方式发送预检请求,服务器接受时才会正式请求
    if ($request_method = 'OPTIONS') {
        add_header 'Access-Control-Max-Age' 1728000;
        add_header 'Content-Type' 'text/plain; charset=utf-8';
        add_header 'Content-Length' 0;
        # 对于Options方式的请求返回204,表示接受跨域请求
        return 204;
    }
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏