Nginx 解决跨域请求

简介: 一遇到到下这种问题,大家是不是很头疼,没错,这就是跨域问题,首先我们先说一下什么是跨域?为什么会跨域?什么问题造成的?

一遇到到下这种问题,大家是不是很头疼,没错,这就是跨域问题,首先我们先说一下什么是跨域?为什么会跨域?什么问题造成的?

image.png


跨域简单来说,就是浏览器url地址和访问数据接口的地址端口或域名不一致造成的。


只需要让前端页面和后端程序放到一块使用同一个域名和同一个端口即可解决,正好使用nginx可以解决此问题。


nginx下载地址:https://pan.baidu.com/s/1VbXmRPi_Sjna-jVacjMBFg


提取码: adsu


下载后解压打开,修改conf文件下的nginx.conf文件,找到server

image.png


修改location /,proxy_pass代理到你的后台地址

image.png


添加新的映射

location /web/ {
   index index.html index.htm;
   #你的前端地址
   root C:/Users/tongyao/Desktop;
   error_page 405 =200 $uri;
}

image.png

图中我把前端页面放到一个名为web的文件夹到桌面了,然后保存,点击nginx根目录的nginx.exe双击运行

image.png


然后通过任务管理器查看是否启动成功。

image.png


启动成功之后,然后去浏览器访问:http://localhost/web/login.html


成功!

目录
相关文章
|
应用服务中间件 API nginx
简单配置nginx反向代理,实现跨域请求
简单配置nginx去做反向代理,实现跨域请求 简单介绍nginx的nginx.conf最核心的配置,去做反向代理,实现跨域请求。 更多详细配置,参考nginx官方文档 先介绍几个nginx命令 打开nginx.
6987 0
|
前端开发 应用服务中间件 nginx
|
28天前
|
应用服务中间件 BI nginx
Nginx的location配置详解
【10月更文挑战第16天】Nginx的location配置详解
|
1月前
|
缓存 负载均衡 安全
Nginx常用基本配置总结:从入门到实战的全方位指南
Nginx常用基本配置总结:从入门到实战的全方位指南
256 0
|
1月前
|
应用服务中间件 Linux nginx
Jetson 环境安装(四):jetson nano配置ffmpeg和nginx(亲测)之编译错误汇总
这篇文章是关于在Jetson Nano上配置FFmpeg和Nginx时遇到的编译错误及其解决方案的汇总。
89 4
|
8天前
|
存储 负载均衡 中间件
Nginx反向代理配置详解,图文全面总结,建议收藏
Nginx 是大型架构必备中间件,也是大厂喜欢考察的内容,必知必会。本篇全面详解 Nginx 反向代理及配置,建议收藏。
Nginx反向代理配置详解,图文全面总结,建议收藏
|
20天前
|
应用服务中间件 API nginx
nginx配置反向代理404问题
【10月更文挑战第18天】本文介绍了使用Nginx进行反向代理的配置方法,解决了404错误、跨域问题和302重定向问题。关键配置包括代理路径、请求头设置、跨域头添加以及端口转发设置。通过调整`proxy_set_header`和添加必要的HTTP头,实现了稳定的服务代理和跨域访问。
105 1
nginx配置反向代理404问题
|
5天前
|
应用服务中间件 网络安全 nginx
轻松上手Nginx Proxy Manager:安装、配置与实战
Nginx Proxy Manager (NPM) 是一款基于 Nginx 的反向代理管理工具,提供直观的 Web 界面,方便用户配置和管理反向代理、SSL 证书等。本文档介绍了 NPM 的安装步骤,包括 Docker 和 Docker Compose 的安装、Docker Compose 文件的创建与配置、启动服务、访问 Web 管理界面、基本使用方法以及如何申请和配置 SSL 证书,帮助用户快速上手 NPM。
22 1
|
1月前
|
编解码 Ubuntu 应用服务中间件
Jetson 环境安装(三):jetson nano配置ffmpeg和nginx(亲测)
本文介绍了在NVIDIA Jetson Nano上配置FFmpeg和Nginx的步骤,包括安装、配置和自启动设置。
139 1
Jetson 环境安装(三):jetson nano配置ffmpeg和nginx(亲测)