Nginx配置解决跨域CROS跨域请求(同服务器站点互访)

  在添加我的血小板到我的博客上面的时候,发生了这样一件小插曲:当我使用www.lyp123.com访问的时候,她不能显示了!同样的站点为什么会不一样的结果呢?于是果断F12,控制台报错有一个图片png贴图无法加载。里面有cros等字样,上网查了不少资料,解决了这个问题,这里分享给大家,避免大家跳坑。


<!--more-->
最重要的就是这一段代码啦,这个很容易能在网上找到,但是具体怎么使用呢,我们且看下文~
```nginx
          add_header Access-Control-Allow-Origin *;    //如果是域名的话是要带http或者https的,这里不用双引号
          add_header Access-Control-Allow-Headers X-Requested-With;
          add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
```

### 其实呢,方法hin简单 :idea: ,只需要先打开软件管理,然后点击nginx设置,这里有一个**坑坑**一定不要在网站的设置里面添加这段代码,我也不知道为什么。可能是设置到独立的配置文件的话作用是只能控制那个域名访问某个特定的吧,反正这里是不可以。
![Snipaste_2019-04-12_12-38-53.png][1]

### 然后就是把上面那一段代码放入到nginx配置里面的http括号里面,这里是是对http跨域访问请求进行添加头文件,对了这里有一点需要提到的是这里让我对`浏览器`这一工具在互联网世界的作用起到了好奇,原来是浏览器控制着一切的读取以及访问?是浏览器在控制着网络安全? :!: 
![Snipaste_2019-04-12_12-39-57.png][2]

### 最后配置好的结果就是这个样啦,代码里面的*也可以被替换,不过我jio得提不提换意义不大,虽然说可能有一点安全影响,但是自己的域名还能对自己的域名访问攻击么?大家有什么想法欢迎评论留言~

![Snipaste_2019-04-12_12-43-18.png][3]

 


  [1]: https://lyp123.com/usr/uploads/2019/04/1729879046.png
  [2]: https://lyp123.com/usr/uploads/2019/04/3966373658.png
  [3]: https://lyp123.com/usr/uploads/2019/04/2974744389.png

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
配置Nginx服务器解决跨域问题,可以参考以下步骤: 1. 打开Nginx配置文件,通常位于`/etc/nginx/nginx.conf`或`/etc/nginx/conf.d/default.conf`。 2. 在配置文件中找到`server`块,可以使用`server_name`指令来指定服务器名称。 3. 在`location`块中添加以下配置解决跨域问题: ``` location / { add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS'; add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization'; proxy_pass http://localhost:8080/; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } ``` 这些配置将允许所有来源的请求访问服务器,并允许使用GET、POST和OPTIONS方法。同时,还会添加一些常见的请求头信息。 4. 如果你需要支持WebSocket,可以取消注释`proxy_http_version`、`proxy_set_header Upgrade`和`proxy_set_header Connection`这几行配置。 5. 保存配置文件并重启Nginx服务,以使配置生效。 请注意,以上配置仅供参考,具体配置可能因你的实际需求而有所不同。在修改配置文件之前,建议备份原始配置文件以防止意外情况发生。 #### 引用[.reference_title] - *1* [Nginx 轻松解决跨域问题](https://blog.csdn.net/leonnew/article/details/123895626)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [Nginx 解决跨域](https://blog.csdn.net/chenzhao635/article/details/128079241)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值