本地Nginx解决跨域问题

一、背景说明

在本地调试Web应用的时候，总是受浏览器同源策略的影响，无法在localhost域访问外部网络地址。如果服务端配置了运行所有源策略就能正常访问。但往往处于安全因素考虑，运维同学往往不可能这样配置。

通常用vue开发的同学，在这样的情况下，只需要在项目中.config文件添加proxy节点，配置本地代理即可把所有请求从localhost转发到真实的服务地址上，即满足了同源访问，又可灵活切换环境。

然而，像使用KMP中wasmJs发布web应用时，当前并没有本地代理的方式。这时候，使用Nginx配置代理就能把项目访问改为本地访问，访问本地nginx后，由nginx转发到真实服务地址。

二、Nginx安装

nginx的安装方式有很多种，可以直接安装在本机上。但作者更喜欢使用docker进行安装，不污染本地环境，还能随时备份删除，也可以创建多个端口的nginx做不同的事情。

首先安装docker desktop桌面版本，这里已经安装好了，可以查阅网络资料进行下载安装，比较简单。

安装完成后，在顶部搜索栏输入nginx进行搜索，找到nginx:latest最新版，右侧有Run按钮点击运行。

Pull是下载镜像到本地，Run是直接基于镜像创建容器，Run之后出现如下界面