- 什么是跨域
浏览器不能执行其余网站的脚本，浏览器的同源策略造成的，是浏览器施加的平安限度
像上图这种协定 域名 端口号 前后端呈现有一个不同的就会产生跨域
localhost和127.0.0.1尽管都指向本机，但也属于跨域
2.解决跨域
你用的是Vue，那么能够通过设置 proxy代理的模式；如果你用的不是Vue，能够通过应用Nginx
Vue.config.js： module.exports = { //相当于webpack-dev-server, 对本地服务器进行配置 devSever : { proxy: { "/api" : { target: " http://localhost:3000 ", //须要跨域的指标url ,我这里是本人本地起的一个服务端口 changeOrigin: true, // 将基于名称的虚构托管网站的选项，如果不配置，申请会报404 ws: true, pathRewrite: { " ^/api " : "" //若申请的门路在指标url下但不在/api 下，则将其转换成空 } } } } }- nginx
万字总结，体系化带你全面意识 Nginx ！
https://juejin.cn/post/694260...
nginx前后端拆散遇到的一些坑
https://blog.csdn.net/u012954...
# main段配置信息user nginx; # 运行用户，默认即是nginx，能够不进行设置worker_processes auto; # Nginx 过程数，个别设置为和 CPU 核数一样error_log /var/log/nginx/error.log warn; # Nginx 的谬误日志寄存目录pid /var/run/nginx.pid; # Nginx 服务启动时的 pid 寄存地位 # events段配置信息events { use epoll; # 应用epoll的I/O模型(如果你不晓得Nginx该应用哪种轮询办法，会主动抉择一个最适宜你操作系统的) worker_connections 1024; # 每个过程容许最大并发数} # http段配置信息# 配置应用最频繁的局部，代理、缓存、日志定义等绝大多数性能和第三方模块的配置都在这里设置http { # 设置日志模式 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 /var/log/nginx/access.log main; # Nginx拜访日志寄存地位 sendfile on; # 开启高效传输模式 tcp_nopush on; # 缩小网络报文段的数量 tcp_nodelay on; keepalive_timeout 65; # 放弃连贯的工夫，也叫超时工夫，单位秒 types_hash_max_size 2048; include /etc/nginx/mime.types; # 文件扩展名与类型映射表 default_type application/octet-stream; # 默认文件类型 include /etc/nginx/conf.d/*.conf; # 加载子配置项 # server段配置信息 server { listen 80; # 配置监听的端口 server_name localhost; # 配置的域名 # location段配置信息 location / { root /usr/share/nginx/html; # 网站根目录 index index.html index.htm; # 默认首页文件 deny 172.168.22.11; # 禁止拜访的ip地址，能够为all allow 172.168.33.44；# 容许拜访的ip地址，能够为all } error_page 500 502 503 504 /50x.html; # 默认50x对应的拜访页面 error_page 400 404 error.html; # 同上 }}