react 访问后端_react前端用nginx怎么配置跨域访问后端restful api？
開發機器是windows，windows中安裝了centos虛擬機做restful api服務器，在瀏覽器中可以正常訪問該api服務器：
http://192.168.33.3:8080/articles
// 20181229004601
// http://192.168.33.3:8080/articles
{
"code": 0,
"message": "OK",
"data": {
"article_list": [
{
"id": 15,
"title": "hello15",
"content": "hello world15",
},
//...
]
}
前端用react-create-app腳手架，可以正常訪問loacalhost:3000，在react中用axios訪問后端api服務器，需要做跨域設置，嘗試了兩種方式：
第1種：在react-create-app中的package.json中添加下面代碼
"proxy": "http://192.168.33.3:8080"
這種方式在chrome控制臺會出現下面錯誤：
GET http://192.168.33.3/articles?limit=10&offset=5 net::ERR_CONNECTION_REFUSED
第2種：使用nginx反向代理
1、在windows上安裝了nginx，使用localhost:80可以正常訪問，在conf/nginx.conf文件中用下面的代碼添加一個反向代理服務器，并啟動nginx：
//D:\workspace\nginx\conf\nginx.conf
server {
listen 3000;
server_name localhost;
location / {
proxy_pass http://192.168.33.3:8080/;
}
}
2、使用npm start啟動react-create-app腳手架，這時會說3000端口被占用。
問題：
那么，使用nginx應該怎么設置反向代理？
總結
以上是生活随笔為你收集整理的react 访问后端_react前端用nginx怎么配置跨域访问后端restful api？的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： vue设置输入框输入长度_vue输入框限
- 下一篇： java集合多个最大值_Java 8 S