61

我在尝试在我的应用程序中执行 POST 请求时遇到问题,我进行了很多搜索,但没有找到解决方案。

所以,我有一个 nodeJS 应用程序和一个网站,我正在尝试使用来自该站点的表单进行 POST 请求,但我总是以这种方式结束:

在此处输入图像描述

在控制台中我看到:

    Uncaught TypeError: Cannot read property 'value' of null 
Post "http://name.github.io/APP-example/file.html " not allowed

在这行代码中:

文件.html:

<form id="add_Emails" method ="POST" action="">

    <textarea rows="5" cols="50" name="email">Put the emails here...
    </textarea>

        <p>
        <INPUT type="submit" onclick="sendInvitation()" name='sendInvitationButton' value ='Send Invitation'/>
        </p>


</form>

<script src="scripts/file.js"></script>

文件.js:

function sendInvitation(){

    var teammateEmail= document.getElementById("email").value;

我阅读了许多帖子和跨域文档,但没有奏效。研究来源 1:http ://enable-cors.org/server.html 研究来源 2:http ://www.w3.org/TR/2013/CR-cors-20130129/#http-access-control-max-年龄

我现在在做什么:

我正在尝试从我的服务器的不同域发布:

发布请求: http ://name.github.io/APP-example/file.html,github 存储库

POST LISTENER : " http://xxx.xxx.x.xx:9000/email , 服务器 localhost ( x-> 我的 ip 地址)

所以,我在其他文件中遇到了同样的问题,但我修复了它,将这段代码放在每条路线的开头:

var express = require('express');
var sha1 = require('sha1'); 

var router = express.Router(); 
var sessionOBJ = require('./session');

var teams = {} 
var teamPlayers = []

router.all('*', function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  res.header("Access-Control-Allow-Methods", "PUT, GET,POST");
  next();
 });

我修好了它。

现在,我遇到了同样的问题,但在这个文件中,唯一的区别是我处理 SMTP 和电子邮件,所以我发布了一封电子邮件,并向我在 POST 请求中收到的这封电子邮件发送了一封电子邮件。

该代码与 POSTMAN 完全兼容,因此,当我使用 POSTMAN 进行测试时,它可以正常工作并且我可以发布。

我在下面包含了这段代码,而不是我展示的第一个代码,但它并没有很好地工作:

router.all('*', function(req, res, next){
            res.header("Access-Control-Allow-Origin", "*")
            res.header("Access-Control-Allow-Methods", "POST, GET, OPTIONS")
            res.header("Access-Control-Allow-Headers", "Origin, Content-Type, Accept")
            res.header("Access-Control-Max-Age", "1728000")
            next();
        });

有人知道如何解决吗?

谢谢你。

4

8 回答 8

64

对您的 nginx.conf 的此配置应该对您有所帮助。

https://gist.github.com/baskaran-md/e46cc25ccfac83f153bb

server {
    listen       80;
    server_name  localhost;

    location / {
        root   html;
        index  index.html index.htm;
    }

    error_page  404     /404.html;
    error_page  403     /403.html;

    # To allow POST on static pages
    error_page  405     =200 $uri;

    # ...
}
于 2014-10-21T17:40:11.917 回答
5

这是到预期服务器的真正代理重定向。

server {
  listen          80;
  server_name     localhost;
location / {
        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://xx.xxx.xxx.xxx/;
    proxy_redirect off;
    proxy_set_header Host $host;

  }
}
于 2016-08-03T15:01:01.090 回答
2

我注意到这不适用于静态先反向代理设置。看起来是这样的:

location @app {
  proxy_pass http://localhost:3000$request_uri;
}

location / {
  try_files $uri $uri/ @app;
  error_page 405 @app;
}
于 2016-10-04T07:42:01.233 回答
2

就我而言,它是 POST 提交要处理的 json 并获得返回值。我交叉检查了使用和不使用 nginx 的应用服务器的日志。我得到的是我的位置没有附加到 proxy_pass url 并且 HTTP 协议版本的版本不同。

  • 没有 nginx:“POST /xxQuery HTTP/1.1”200 -
  • 使用 nginx:“POST / HTTP/1.0”405 -

我之前的位置块是

location /xxQuery {
    proxy_method POST;
    proxy_pass http://127.0.0.1:xx00/;
    client_max_body_size 10M;
}

我把它改成

location /xxQuery {
    proxy_method POST;
    proxy_http_version 1.1;
    proxy_pass http://127.0.0.1:xx00/xxQuery;
    client_max_body_size 10M;
}

有效。

于 2019-10-12T06:24:26.360 回答
1

我已经尝试了将 405 重定向到 200 的解决方案,并且在生产环境中(在我的情况下,它是带有 Nginx Docker 容器的 Google 负载平衡),这个 hack 导致一些 502 错误(Google 负载平衡错误代码:backend_early_response_with_non_error_status)。

最后,我通过将 Nginx 替换为与 Nginx 完全兼容并具有更多插件的 OpenResty 来使其正常工作。

使用ngx_coolkit,现在 Nginx(OpenResty) 可以正确地使用 POST 请求提供静态文件,这里是我的配置文件:

server {
  listen 80;

  location / {
    override_method GET;
    proxy_pass http://127.0.0.1:8080;
  }
}

server {
  listen 8080;
  location / {
    root /var/www/web-static;
    index index.html;
    add_header Cache-Control no-cache;
  }
}

在上面的配置中,我使用ngx_coolkitoverride_method提供的将 HTTP 方法覆盖为.GET

于 2016-12-04T05:49:54.963 回答
0

我与 VueJs 有类似的问题,因为前端应用程序托管在example.com我的 Rails 应用程序作为 API 托管在api.example.com. Vue 被配置为通过ENV变量获取数据VUE_APP_API_BASE_URL

我犯了一个新手错误,忘记env.production.local在生产服务器上创建,因此在构建 VueJs 应用程序时,url 从未被拾取。因此,所有请求都被路由到 egexample.com/signin而不是api.example.com/signin错误。

在生产服务器上创建文件并添加变量后,然后重新构建 vuejs 应用程序一切正常!

于 2021-03-14T21:01:44.890 回答
0

我有类似的问题,但只有 Chrome,Firefox 才有效。我注意到 Chrome 在标头请求中添加了一个 Origin 参数。

因此,在我的 nginx.conf 中,我添加了参数以避免它在location/ 块下

proxy_set_header Origin "";
于 2018-12-24T10:04:23.293 回答
0

为时已晚,但如果有人遇到此问题,请在 nginx.conf 中添加以下代码

server {

        ...

        # pass PHP scripts to FastCGI server
        #
        location ~ \.php$ {
                include snippets/fastcgi-php.conf;

                # With php-fpm (or other unix sockets):
                fastcgi_pass unix:/var/run/php/php7.4-fpm.sock;
                # With php-cgi (or other tcp sockets):

        }


}
于 2022-01-25T19:23:33.790 回答