Coder Social home page Coder Social logo

跨域问题 about feature-probe-api HOT 17 CLOSED

xiejiashuai avatar xiejiashuai commented on September 28, 2024
跨域问题

from feature-probe-api.

Comments (17)

xiejiashuai avatar xiejiashuai commented on September 28, 2024

Nginx配置如下
user nginx;
worker_processes auto;

error_log /var/log/nginx/error.log notice;
pid /var/run/nginx.pid;

events {
worker_connections 1024;
}

http {
include /etc/nginx/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  /var/log/nginx/access.log  main;

sendfile        on;
#tcp_nopush     on;

keepalive_timeout  65;

#gzip  on;

include /etc/nginx/conf.d/*.conf;

upstream featureProbeAPI {
    server 127.0.0.1:16458;
}

server {
  listen 4009;  # UI 端口

  location / {
    index  index.html index.htm;
    root /usr/share/nginx/html;
    try_files $uri /index.html;
  }

   location /api { # 访问 /api 时统一转发到 featureProbeAPI 服务
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-NginX-Proxy true;
    proxy_pass http://127.0.0.1:16458/api;
    proxy_ssl_session_reuse off;
    proxy_set_header Host $http_host;
    proxy_cache_bypass $http_upgrade;
    proxy_redirect off;
    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Headers *;
    add_header Access-Control-Allow-Methods *;
  }
}

}

from feature-probe-api.

dengfeige avatar dengfeige commented on September 28, 2024

提示 CORS 中所请求接口的域名和端口是什么呢？可以发出来看下。

from feature-probe-api.

xiejiashuai avatar xiejiashuai commented on September 28, 2024

提示 CORS 中所请求接口的域名和端口是什么呢？可以发出来看下。

http://localhost:4009/server/api/client-sdk/toggles?user=eyJrZXkiOiIxNjY0NDI5NTQ3Nzg1IiwiYXR0cnMiOnt9fQ%3D%3D
http://localhost:16458/api/dictionaries/user_last_seen
http://localhost:16458/api/members/current
http://localhost:16458/api/projects

有很多，我就copy了几个，不知道是不是我配置的问题

image

from feature-probe-api.

dengfeige avatar dengfeige commented on September 28, 2024

看下是不是改了比如 https://github.com/FeatureProbe/feature-probe-ui/blob/main/src/constants/api/project.ts 这个代码中的origin 地址？ 可以看到这个代码中默认地址是相对路径，请求 API 的地址会和你浏览器上的域名和端口一致的，不会出现上面是 4009，请求接口地址是 16458。

https://github.com/FeatureProbe/feature-probe-ui/blob/main/src/constants/api/ 这下面的文件都可以检查下。

from feature-probe-api.

xiejiashuai avatar xiejiashuai commented on September 28, 2024

看下是不是改了比如 https://github.com/FeatureProbe/feature-probe-ui/blob/main/src/constants/api/project.ts 这个代码中的origin 地址？ 可以看到这个代码中默认地址是相对路径，请求 API 的地址会和你浏览器上的域名和端口一致的，不会出现上面是 4009，请求接口地址是 16458。

https://github.com/FeatureProbe/feature-probe-ui/blob/main/src/constants/api/ 这下面的文件都可以检查下。

现在变成502了

http://localhost:4009/api/approvalRecords?pageIndex=0&status%5B0%5D=PENDING&type=APPROVAL&keyword=
image

Nginx日志
172.17.0.1 - - [29/Sep/2022:07:03:53 +0000] "GET /static/css/main.ca8d09dc.css.map HTTP/1.1" 200 2754274 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:07:03:53 +0000] "GET /server/api/client-sdk/toggles?user=eyJrZXkiOiIxNjY0NDM1MDMzNTE5IiwiYXR0cnMiOnt9fQ%3D%3D HTTP/1.1" 200 553 "http://localhost:4009/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
2022/09/29 07:03:53 [error] 33#33: *2 connect() failed (111: Connection refused) while connecting to upstream, client: 172.17.0.1, server: , request: "GET /api/dictionaries/user_last_seen HTTP/1.1", upstream: "http://127.0.0.1:16458/api/dictionaries/user_last_seen", host: "localhost:4009", referrer: "http://localhost:4009/"
172.17.0.1 - - [29/Sep/2022:07:03:53 +0000] "GET /api/dictionaries/user_last_seen HTTP/1.1" 502 559 "http://localhost:4009/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
2022/09/29 07:03:53 [error] 32#32: *6 connect() failed (111: Connection refused) while connecting to upstream, client: 172.17.0.1, server: , request: "GET /api/approvalRecords?pageIndex=0&status%5B0%5D=PENDING&type=APPROVAL&keyword= HTTP/1.1", upstream: "http://127.0.0.1:16458/api/approvalRecords?pageIndex=0&status%5B0%5D=PENDING&type=APPROVAL&keyword=", host: "localhost:4009", referrer: "http://localhost:4009/"
172.17.0.

但是用浏览器请求是能访问通的 ，如图
image

from feature-probe-api.

dengfeige avatar dengfeige commented on September 28, 2024

UI 和 API 都是用 docker run 方式启动的是吧？
从日志上看是因为你的 UI 容器和你的 API 容器网络不通导致 nginx 无法进行 proxy。可以在启动 docker 容器时尝试加上 --net=host 设置与宿主机在同一网络中。

from feature-probe-api.

xiejiashuai avatar xiejiashuai commented on September 28, 2024

UI 和 API 都是用 docker run 方式启动的是吧？ 从日志上看是因为你的 UI 容器和你的 API 容器网络不通导致 nginx 无法进行 proxy。可以在启动 docker 容器时尝试加上 --net=host 设置与宿主机在同一网络中。

UI是docker run , API是IDEA启动的 我试下

from feature-probe-api.

dengfeige avatar dengfeige commented on September 28, 2024

UI 和 API 都是用 docker run 方式启动的是吧？ 从日志上看是因为你的 UI 容器和你的 API 容器网络不通导致 nginx 无法进行 proxy。可以在启动 docker 容器时尝试加上 --net=host 设置与宿主机在同一网络中。

UI是docker run , API是IDEA启动的 我试下

嗯，也会有这个问题。docker 默认网络模式下无法直接用 127.0.0.1 访问宿主机的网络。

from feature-probe-api.

xiejiashuai avatar xiejiashuai commented on September 28, 2024

UI 和 API 都是用 docker run 方式启动的是吧？ 从日志上看是因为你的 UI 容器和你的 API 容器网络不通导致 nginx 无法进行 proxy。可以在启动 docker 容器时尝试加上 --net=host 设置与宿主机在同一网络中。

UI是docker run , API是IDEA启动的 我试下

嗯，也会有这个问题。docker 默认网络模式下无法直接用 127.0.0.1 访问宿主机的网络。

我把API服务通过K8S部署到了docker中，然后配置Nginx代理为k8s域名 然后启动访问变成了503 了
image

Nginx配置

upstream featureProbeAPI {
    server lcp-feature-probe-api.dev-cnhbnp01-lcp.k8s.chehejia.com; # FeatureProbeAPI IP和端口
}

server {
  listen 4009;  # UI 端口

  location / {
    index  index.html index.htm;
    root /usr/share/nginx/html;
    try_files $uri /index.html;
  }

   location /api { # 访问 /api 时统一转发到 featureProbeAPI 服务
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-NginX-Proxy true;
    proxy_pass http://featureProbeAPI/api;
    proxy_ssl_session_reuse off;
    proxy_set_header Host $http_host;
    proxy_cache_bypass $http_upgrade;
    proxy_redirect off;
  }
}

控制台输出
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /static/css/main.ca8d09dc.css.map HTTP/1.1" 200 2754274 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /static/js/main.87377a4f.js.map HTTP/1.1" 200 8933491 "-" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /server/api/client-sdk/toggles?user=eyJrZXkiOiIxNjY0NDQxMzY3NDQ5IiwiYXR0cnMiOnt9fQ%3D%3D HTTP/1.1" 200 553 "http://localhost:4009/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /api/dictionaries/user_last_seen HTTP/1.1" 503 332 "http://localhost:4009/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /api/approvalRecords?pageIndex=0&status%5B0%5D=PENDING&type=APPROVAL&keyword= HTTP/1.1" 503 333 "http://localhost:4009/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /api/members/current HTTP/1.1" 503 333 "http://localhost:4009/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /api/dictionaries/user_last_seen HTTP/1.1" 503 333 "http://localhost:4009/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /api/projects HTTP/1.1" 503 333 "http://localhost:4009/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /api/projects HTTP/1.1" 503 333 "http://localhost:4009/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /api/dictionaries/user_last_seen HTTP/1.1" 503 333 "http://localhost:4009/notfound" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:27 +0000] "GET /api/projects HTTP/1.1" 503 333 "http://localhost:4009/notfound" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:44 +0000] "GET /server/api/client-sdk/toggles?user=eyJrZXkiOiIxNjY0NDQwODgyNjEwIiwiYXR0cnMiOnt9fQ%3D%3D HTTP/1.1" 304 0 "http://localhost:4009/notfound" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:44 +0000] "GET /api/dictionaries/user_last_seen HTTP/1.1" 503 333 "http://localhost:4009/notfound" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"
172.17.0.1 - - [29/Sep/2022:08:49:44 +0000] "GET /api/projects HTTP/1.1" 503 333 "http://localhost:4009/notfound" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36" "-"

from feature-probe-api.

dengfeige avatar dengfeige commented on September 28, 2024

Nginx 配置所在的 UI 容器是怎么运行的呢？启动命令提供下。另外 nginx 的 error 日志有错误吗？ 直接访问 lcp-feature-probe-api.dev-cnhbnp01-lcp.k8s.chehejia.com 能正常解析并请求到 API 服务吗？

还有就是可以尝试 docker exec 到 nginx 容器上，去 curl API 的服务看看是否能通。

from feature-probe-api.

xiejiashuai avatar xiejiashuai commented on September 28, 2024

Nginx 配置所在的 UI 容器是怎么运行的呢？启动命令提供下
这个是构建镜像的命令，K8S负载把docker跑起来
RUN mkdir -p /chj/data/log/nginx && chown -R nginx:nginx /usr/share/nginx/html && chmod -R 755 /usr/share/nginx/html/
CMD /bin/bash -c "if [ -s /etc/nginx/conf.d/default.conf ]; then nginx -g 'daemon off;';
else envsubst < /etc/nginx/conf.d/default.conf.template > /etc/nginx/conf.d/default.conf && nginx -g 'daemon off;'; fi"

nginx 的 error吗？
没找到有错误日志

直接访问 lcp-feature-probe-api.dev-cnhbnp01-lcp.k8s.chehejia.com 能正常解析并请求到 API 服务吗？
通过浏览器访问是没问题的

from feature-probe-api.

xiejiashuai avatar xiejiashuai commented on September 28, 2024

Nginx 配置所在的 UI 容器是怎么运行的呢？启动命令提供下。另外 nginx 的 error 日志有错误吗？ 直接访问 lcp-feature-probe-api.dev-cnhbnp01-lcp.k8s.chehejia.com 能正常解析并请求到 API 服务吗？

还有就是可以尝试 docker exec 到 nginx 容器上，去 curl API 的服务看看是否能通。

目前是通过公司的发布平台(底层用K8S)部署的docker, 到docker容器后 curl命令
image

from feature-probe-api.

dengfeige avatar dengfeige commented on September 28, 2024

我看上面 curl 是 https ，nginx proxy http 。所以 curl http 也是 OK 的吗？

from feature-probe-api.

xiejiashuai avatar xiejiashuai commented on September 28, 2024

Nginx 配置所在的 UI 容器是怎么运行的呢？启动命令提供下。另外 nginx 的 error 日志有错误吗？ 直接访问 lcp-feature-probe-api.dev-cnhbnp01-lcp.k8s.chehejia.com 能正常解析并请求到 API 服务吗？
还有就是可以尝试 docker exec 到 nginx 容器上，去 curl API 的服务看看是否能通。

目前是通过公司的发布平台(底层用K8S)部署的docker, 到docker容器后 curl命令 image
image

image

@dengfeige

from feature-probe-api.

xiejiashuai avatar xiejiashuai commented on September 28, 2024

这个是nginx日志

lcp-feature-probe-ui.log

from feature-probe-api.

dengfeige avatar dengfeige commented on September 28, 2024

嗯，看上去 curl http 地址没有获取到 API 任何响应内容应该也是出错了，可以 curl -i http 地址看下返回详情。所以有可能是你们 k8s 生成的服务地址不支持 http 请求，导致 nginx 无法直接 proxy 过去。

如果确定是这个问题的话，有两个方案：

  1. nginx proxy 的地址改为 https，但需要同时配置证书。详情可参考：nginx之proxy_pass代理后端https请求完全拆解
  2. 看看能否将你们 k8s 生成的服务域名支持 http 访问，或用 IP 直连。

from feature-probe-api.

dengfeige avatar dengfeige commented on September 28, 2024

Nginx 配置所在的 UI 容器是怎么运行的呢？启动命令提供下。另外 nginx 的 error 日志有错误吗？ 直接访问 lcp-feature-probe-api.dev-cnhbnp01-lcp.k8s.chehejia.com 能正常解析并请求到 API 服务吗？
还有就是可以尝试 docker exec 到 nginx 容器上，去 curl API 的服务看看是否能通。

目前是通过公司的发布平台(底层用K8S)部署的docker, 到docker容器后 curl命令 image
image

image

@dengfeige

从第二张图来看是支持 http 访问的？只是因为没有在最后面加 / 导致不能访问？

from feature-probe-api.

Related Issues (5)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.