window安装nginx,并解决前端跨域问题
window 安装 nginx 流程
第一步:下载nginx
http://nginx.org/en/download.html

第二步:下载完成后,解压到指定目录文件,启动nginx
进入nginx根目录,双击nginx.exe,一个弹框一闪而过,nginx服务启动。

或者打开命令行工具,进入nginx根目录下,输入命令:start nginx 也可以启动。
此时在浏览器输入:localhost:80,就可以看到nginx欢迎页面

第三步:开始设置前端调用后台接口的跨域配置
用编辑器打开nginx文件,找到文件下的nginx.conf文件

再打开的nginx.conf代码下,找到server开始配置如下:

server {
listen 8888; //启动端口号
server_name 127.0.0.1 localhost 10.20.136.189; //自己电脑的ip地址,可以配置多个。
location / { proxy_pass http://localhost:8080; // 配置监听前端启动的浏览地址 }
#配置前端调用的接口反向代理
location ^~ /api/ {
rewrite ^/api/(.*)$/$1 break; //监听所有以api开头的接口地址
proxy_pass https://api.devland.cn/; //后端接口地址
proxy_set_header Host api.devland.cn;
}
}
前端项目调用接口地址时前边需要加 /api/
如:axios.post('/api/goods/details')
至此前端调用接口跨域问题完美解决
windows nginx常用命令
启动nginx服务:start nginx
修改配置后重新加载生效 : nginx -s reload
重新打开日志文件 :nginx -s reopen 测试nginx配置文件是否正确 : nginx -t -c /path/to/nginx.conf
验证配置是否正确 : nginx -t
查看Nginx的版本号:nginx -V
启动Nginx:start nginx
快速停止或关闭Nginx:nginx -s stop
正常停止或关闭Nginx:nginx -s quit
配置文件修改重装载命令:nginx -s reload
window安装nginx,并解决前端跨域问题的更多相关文章
- 用nginx的反向代理机制解决前端跨域问题在nginx上部署web静态页面
用nginx的反向代理机制解决前端跨域问题在nginx上部署web静态页面 1.什么是跨域以及产生原因 跨域是指a页面想获取b页面资源,如果a.b页面的协议.域名.端口.子域名不同,或是a页面为ip地 ...
- 项目部署问题:xftp无法连接服务器、Nginx403 Forbidden解决、nginx反向代理解决前端跨域问题
一.xftp无法连接服务器 在xftp中配置正确的ip,用户名和密码后,居然无法连接 解决方案:将协议里面的FTP换成SFTP,注意换成SFTP后端口就默认换成22,要还是原来的21就还是连不上的哈 ...
- 完美解决前端跨域之 easyXDM 的使用和解析
前端跨域问题在大型网站中是比较常见的问题.本文详细介绍了利用 easyXDM 解决前端跨域的原理细节和使用细节,具体使用时可以在文中代码实例的基础上扩展完成. 0.背景 因个别网络运营商存在 HTTP ...
- JAVA解决前端跨域问题。
什么是跨域? 通俗来说,跨域按照我自己的想法来理解,是不同的域名之间的访问,就是跨域.不同浏览器,在对js文件进行解析是不同的,浏览器会默认阻止,所以 现在我来说下用java代码解决前端跨域问题. 用 ...
- 如何用Nginx解决前端跨域问题?
前言 在开发静态页面时,类似Vue的应用,我们常会调用一些接口,这些接口极可能是跨域,然后浏览器就会报cross-origin问题不给调. 最简单的解决方法,就是把浏览器设为忽略安全问题,设置--di ...
- 【Nginx】在Windows下使用Nginx解决前端跨域问题
提出问题:因为一些历史原因,后台代码不能动.请求别人的接口拿数据显示在前端,怎么办呢? 分析问题:通过ajax请求. 解决问题:因为浏览器的同源策略,所以需要解决跨域问题.(同源策略:请求的url地址 ...
- 用nginx的反向代理机制解决前端跨域问题
什么是跨域以及产生原因 跨域是指a页面想获取b页面资源,如果a.b页面的协议.域名.端口.子域名不同,或是a页面为ip地址,b页面为域名地址,所进行的访问行动都是跨域的,而浏览器为了安全问题一般都限制 ...
- nginx反向代理-解决前端跨域问题
1.定义 跨域是指a页面想获取b页面资源,如果a.b页面的协议.域名.端口.子域名不同,所进行的访问行动都是跨域的,而浏览器为了安全问题一般都限制了跨域访问,也就是不允许跨域请求资源.注意:跨域限制访 ...
- 利用nginx做反向代理解决前端跨域问题
最近朋友再群里提了一个问题,他们公司给他提供了一个获取数据的接口,在浏览器访问这个接口能获取到json数据,但是放在项目里使用ajax就产生了跨域问题,一般这个需要提供接口的后台方面需要做跨域处理,但 ...
- ngnix 反向代理来解决前端跨域问题
1.定义 跨域是指a页面想获取b页面资源,如果a.b页面的协议.域名.端口.子域名不同,所进行的访问行动都是跨域的,而浏览器为了安全问题一般都限制了跨域访问,也就是不允许跨域请求资源.注意:跨域限制访 ...
随机推荐
- linux环境通过nginx转发allure报告
前言: 自动化测试生成的allure报告一般通过jenkins生成,生成后通过jenkins的view账号进行查看,但这样就必须登录jenkins才能看到,如何不通过登录jenkins从而看到al ...
- Vue + Element table的@select方法获取当table中的id值都相同时,获取他们索引
先说下问题情况,原本通过双重forEach方法方法,遍历可以获取到被勾选中的索引. let arr = []val.forEach((val, index) => { this.TableDat ...
- YOLO v6:一个硬件友好的目标检测算法
本文来自公众号"AI大道理" YOLOv6 是美团视觉智能部研发的一款目标检测框架,致力于工业应用. YOLOv6支持模型训练.推理及多平台部署等全链条的工业应用需求,并在 ...
- Redis缓存中的数据和数据库不一致
首先关于两者数据的一致性包含有两种情况: (1)缓存中有数据时,那数据库中的数据要和缓存中的数据相同: (2)缓存中没有数据时,数据库中的数据必须是最新的. 如果不符合以上两种情况,就属于缓存和数据库 ...
- 三本书带您快速深入掌握Spring Boot应用开发《Spring Boot从零开始学(视频教学版)》
#好书推荐##好书奇遇季#三本书带您快速深入掌握Spring Boot应用开发<Spring Boot从零开始学(视频教学版)><Spring Boot应用开发实战><深 ...
- 在集群上运行Spark应用
初识Spark真的存在很多疑问:Spark需要部署在集群里的每个节点上吗?Spark怎么有这么多依赖,这些依赖分别又有什么用?官网里边demo是用sbt构建的,难道还有再学一下sbt吗? --就是这么 ...
- abap screen页签开发注意事项
问题描述:我比较懒,开发程序的时候所有的页签都是直接公用主程序的按钮功能,这就导致,当我按了按钮之后,SY-UCOMM里保存的是我自建按钮的code, 如果不进行页签跳转,或者按其他按钮的话,直接按下 ...
- 最简单的应用flask
服务端 # -*- coding: utf-8 -*- from flask import Flask,request flask_app = Flask('55kai') @flask_app.ro ...
- Hub
public class StreamHub : Hub { public ChannelReader<string> ReadLogStream() { var channel = Ch ...
- ABAP 范围表 range table
范围表定义: DATA gr_test TYPE RANGE OF char6. 做选择屏幕的时候 范围选择框 默认就是一个范围表 范围表内容: 通过断点调试可以看到,范围表有4列 sign opti ...