Mac上Nginx安装，使用，解决跨域全过程
背景
在调用一个兄弟团队的api接口的时候，本地起一个localhost:8080，结果报跨域错误。一个朋友建议本地使用Nginx可以解决跨域问题，于是试试。
安装过程（执行命令）：
1，/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
很久才成功，可能是网络被墙的原因
2，brew install nginx
先运行brew update一直没反应，只好跳过。
==> Downloading https://ghcr.io/v2/homebrew/core/ca-certificates/manifests/2022-04-26 Already downloaded: /Users/oker/Library/Caches/Homebrew/downloads/21a4c3d0a8e54b4921528b9379605fac4a683424a7a4cb0a2b5f098e18f3e229--ca-certificates-2022-04-26.bottle_manifest.json ==> Downloading https://ghcr.io/v2/homebrew/core/ca-certificates/blobs/sha256:c05a44feba2a630de2e1cefba90d3aa3f74e4d57146c0117858f648c419abeae Already downloaded: /Users/oker/Library/Caches/Homebrew/downloads/52841b405d320473ad2cd55a4a6b2599d57c847d0adf58be89b05929f3c2736c--ca-certificates--2022-04-26.all.bottle.tar.gz ==> Downloading https://ghcr.io/v2/homebrew/core/openssl/1.1/manifests/1.1.1o Already downloaded: /Users/oker/Library/Caches/Homebrew/downloads/75e64159933cb7401740964ef8681602932bd4c67aade21021fd522238a05e20--openssl@1.1-1.1.1o.bottle_manifest.json ==> Downloading https://ghcr.io/v2/homebrew/core/openssl/1.1/blobs/sha256:1da475def33874bd51321fcf9bef11a6b11d9e5a8079d9303b48f6a54b20a226 ==> Downloading from https://pkg-containers.githubusercontent.com/ghcr1/blobs/sha256:1da475def33874bd51321fcf9bef11a6b11d9e5a8079d9303b48f6a54b20 ######################################################################## 100.0% ==> Downloading https://ghcr.io/v2/homebrew/core/pcre2/manifests/10.40 ######################################################################## 100.0% ==> Downloading https://ghcr.io/v2/homebrew/core/pcre2/blobs/sha256:b25728793286a5fcd8a92d4a75033e20df74c60ffe1d5d886ea5ad719fe25927 ==> Downloading from https://pkg-containers.githubusercontent.com/ghcr1/blobs/sha256:b25728793286a5fcd8a92d4a75033e20df74c60ffe1d5d886ea5ad719fe2 ######################################################################## 100.0% ==> Downloading https://ghcr.io/v2/homebrew/core/nginx/manifests/1.21.6_1 ######################################################################## 100.0% ==> Downloading https://ghcr.io/v2/homebrew/core/nginx/blobs/sha256:e3f1eec4488b61a4c6bb56f338b30fbd1472a409db8a3bada92933fb92dc4b95 ==> Downloading from https://pkg-containers.githubusercontent.com/ghcr1/blobs/sha256:e3f1eec4488b61a4c6bb56f338b30fbd1472a409db8a3bada92933fb92dc ######################################################################## 100.0% ==> Installing dependencies for nginx: ca-certificates, openssl@1.1 and pcre2 ==> Installing nginx dependency: ca-certificates ==> Pouring ca-certificates--2022-04-26.all.bottle.tar.gz ==> Regenerating CA certificate bundle from keychain, this may take a while... 🍺 /usr/local/Cellar/ca-certificates/2022-04-26: 3 files, 215.6KB ==> Installing nginx dependency: openssl@1.1 ==> Pouring openssl@1.1--1.1.1o.catalina.bottle.tar.gz 🍺 /usr/local/Cellar/openssl@1.1/1.1.1o: 8,089 files, 18.5MB ==> Installing nginx dependency: pcre2 ==> Pouring pcre2--10.40.catalina.bottle.tar.gz 🍺 /usr/local/Cellar/pcre2/10.40: 230 files, 6.4MB ==> Installing nginx ==> Pouring nginx--1.21.6_1.catalina.bottle.tar.gz ==> Caveats Docroot is: /usr/local/var/www The default port has been set in /usr/local/etc/nginx/nginx.conf to 8080 so that nginx can run without sudo. nginx will load all files in /usr/local/etc/nginx/servers/. To restart nginx after an upgrade: brew services restart nginx Or, if you don't want/need a background service you can just run: /usr/local/opt/nginx/bin/nginx -g daemon off; ==> Summary 🍺 /usr/local/Cellar/nginx/1.21.6_1: 26 files, 2.2MB ==> Running `brew cleanup nginx`... Disable this behaviour by setting HOMEBREW_NO_INSTALL_CLEANUP. Hide these hints with HOMEBREW_NO_ENV_HINTS (see `man brew`). ==> Caveats ==> nginx Docroot is: /usr/local/var/www The default port has been set in /usr/local/etc/nginx/nginx.conf to 8080 so that nginx can run without sudo. nginx will load all files in /usr/local/etc/nginx/servers/. To restart nginx after an upgrade: brew services restart nginx Or, if you don't want/need a background service you can just run: /usr/local/opt/nginx/bin/nginx -g daemon off;
查看安装情况
brew search nginx
oker@okerdeMacBook-Pro ~ brew search nginx ==> Formulae nginx ✔
brew info nginx
oker@okerdeMacBook-Pro ~ brew info nginx nginx: stable 1.21.6 (bottled), HEAD HTTP(S) server and reverse proxy, and IMAP/POP3 proxy server https://nginx.org/ /usr/local/Cellar/nginx/1.21.6_1 (26 files, 2.2MB) * Poured from bottle on 2022-06-17 at 11:13:17 From: https://github.com/Homebrew/homebrew-core/blob/HEAD/Formula/nginx.rb License: BSD-2-Clause ==> Dependencies Required: openssl@1.1 ✔, pcre2 ✔ ==> Options --HEAD Install HEAD version ==> Caveats Docroot is: /usr/local/var/www The default port has been set in /usr/local/etc/nginx/nginx.conf to 8080 so that nginx can run without sudo. nginx will load all files in /usr/local/etc/nginx/servers/. To restart nginx after an upgrade: brew services restart nginx Or, if you don't want/need a background service you can just run: /usr/local/opt/nginx/bin/nginx -g daemon off; ==> Analytics install: 25,609 (30 days), 90,463 (90 days), 453,284 (365 days) install-on-request: 25,566 (30 days), 90,262 (90 days), 452,347 (365 days) build-error: 35 (30 days)
捕捉到的重要信息有：
nginx安装路径：/usr/local/Cellar/nginx/1.21.6_1 (26 files, 2.2MB) *
Docroot is: /usr/local/var/www
The default port has been set in /usr/local/etc/nginx/nginx.conf to 8080 so that
nginx will load all files in /usr/local/etc/nginx/servers/.
启动
nginx原生常用命令启动、停止、重新加载配置文件(不推荐)
nginx #启动nginx
nginx -s reload #重新加载配置文件 ，热加载配置文件
nginx -s quit #:推荐 待nginx进程处理任务完毕进行停止
nginx -s stop #:先查出nginx进程id再使用kill命令强制杀掉进程。启动、停止、重启nginx(推荐)
brew services start nginx
brew services stop nginx
brew services restart nginx # To restart nginx after an upgrade:
查看启动是否成功：
ps -ef | grep nginx
ps aux | grep nginx
http://localhost:8080/ （第一次成功，会让你很开心）
配置文件修改
默认配置
#user nobody; worker_processes 1; #error_log logs/error.log; #error_log logs/error.log notice; #error_log logs/error.log info; #pid logs/nginx.pid; events { worker_connections 1024; } http { include mime.types; default_type application/octet-stream; #log_format main '$remote_addr - $remote_user [$time_local] "$request" ' # '$status $body_bytes_sent "$http_referer" ' # '"$http_user_agent" "$http_x_forwarded_for"'; #access_log logs/access.log main; sendfile on; #tcp_nopush on; #keepalive_timeout 0; keepalive_timeout 65; #gzip on; server { listen 8080; server_name localhost; #charset koi8-r; #access_log logs/host.access.log main; location / { root html; index index.html index.htm; } #error_page 404 /404.html; # redirect server error pages to the static page /50x.html # error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } # proxy the PHP scripts to Apache listening on 127.0.0.1:80 # #location ~ \.php$ { # proxy_pass http://127.0.0.1; #} # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000 # #location ~ \.php$ { # root html; # fastcgi_pass 127.0.0.1:9000; # fastcgi_index index.php; # fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name; # include fastcgi_params; #} # deny access to .htaccess files, if Apache's document root # concurs with nginx's one # #location ~ /\.ht { # deny all; #} } # another virtual host using mix of IP-, name-, and port-based configuration # #server { # listen 8000; # listen somename:8080; # server_name somename alias another.alias; # location / { # root html; # index index.html index.htm; # } #} # HTTPS server # #server { # listen 443 ssl; # server_name localhost; # ssl_certificate cert.pem; # ssl_certificate_key cert.key; # ssl_session_cache shared:SSL:1m; # ssl_session_timeout 5m; # ssl_ciphers HIGH:!aNULL:!MD5; # ssl_prefer_server_ciphers on; # location / { # root html; # index index.html index.htm; # } #} include servers/*; }
代理配置
server { #listen 8080; listen 8082; # server_name localhost; server_name okc.oklink.com; #charset koi8-r; #access_log logs/host.access.log main; add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow-Credentials true; add_header Access-Control-Allow-Methods GET,POST,OPTIONS; location /api/explorer/v1/ { proxy_pass https://www.oklink.com; root html; index index.html index.htm; } location / { proxy_pass http://localhost:8081; root html; index index.html index.htm; }
跨域问题，终于调通了。
原理是：
1，自己起了一个localhost:8081的一个前端服务，去访问（此时跨域）
http://localhost:8082/api/explorer/v1/okc/exceed500tx?time=20220509
2，在nginx配置代理，如上所示
3，访问 http://localhost:8082/ 通过nginx的 location / {
匹配到 http://localhost:8081/
4，在8081服务内，调用了http://localhost:8082/api/explorer/v1/okc/exceed500tx?time=20220509
通过nginx的 location /api/explorer/v1/ {
匹配到 https://www.oklink.com;
因为同是http://localhost:8082/，所以不跨域
所以拿到数据。success！！！
参考文档：
https://juejin.cn/post/6986192474213941262
https://www.cnblogs.com/54chensongxia/p/12938929.html
2023-03-28
又遇到一个新的跨域问题。
本地起一个服务比如：http://localhost:8081，去访问https://exchaintesttmrpc.okex.org。
源码：
import {parseCoins, setupWebKeplr} from "cosmwasm";
async function main() {
let captain = "";
let keplrAddr = "";
const client = await setupWebKeplr(config); // 报错行
console.log(client);
}
解决办法：在js中把服务端接口改为localhost:8092，然后在nginx配置为远程https://exchaintesttmrpc.okex.org，达到间接访问的目的。
nginx配置：
server { listen 8092; # server_name localhost; #charset koi8-r; #access_log logs/host.access.log main; add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS, PUT, DELETE'; add_header Access-Control-Allow-Headers *; add_header Access-Control-Allow-Credentials 'true'; location / { proxy_pass https://exchaintesttmrpc.okex.org; proxy_set_header Host "exchaintesttmrpc.okex.org"; root html; index index.html index.htm; } #error_page 404 /404.html; # redirect server error pages to the static page /50x.html # error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } }
这是一个defults.conf文件
在外层/usr/local/etc/nginx/nginx.conf中有一句
http { ...... /include servers/*; }
成功如图所示：
