POST 请求在 Phoenix 中变为 200 OPTIONS 但未发送以下 POST

Posted

技术标签:

【中文标题】POST 请求在 Phoenix 中变为 200 OPTIONS 但未发送以下 POST【英文标题】:POST Request is turning to 200 OPTIONS in Phoenix but not sending the following POST 【发布时间】:2017-11-12 04:01:26 【问题描述】:

我正在使用 Angular 2 和 Phoenix,我正在尝试向 Phoenix 发送 POST 请求。我有以下代码:

endpoint.ex

plug Corsica, origins: "http://localhost", allow_headers: ["content-type"]

在我的前端我有

@Injectable()
export class RegisterService 

    public headers: Headers;

    constructor(private _http: Http) 
        this.headers = new Headers();
        this.headers.append('Content-Type', 'application/json');
    

    createUser(): Observable<Response> 
        return this._http.post(
            'http://localhost:4000/v1/users', 
            JSON.stringify(
                firstName: 'lll',
                lastName: 'xxxxx',
                email: 'dddd@gmail.com',
                password: 'test123'
            ), 
            headers: this.headers
        );
    

这是组件代码

createUser(): void 
    this._registerService.createUser().subscribe();

我得到 200 OK OPTIONS 但它从不发送 POST 请求。

一般

Request URL:http://localhost:4000/v1/users
Request Method:OPTIONS
Status Code:200 OK
Remote Address:127.0.0.1:4000
Referrer Policy:no-referrer-when-downgrade

响应标头

cache-control:max-age=0, private, must-revalidate
content-length:0
date:Sat, 10 Jun 2017 04:29:50 GMT
server:Cowboy
x-request-id:hfm969svbqv9oa2jatn5ri641srsht3s

请求标头

Accept:*/*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:content-type
Access-Control-Request-Method:POST
Connection:keep-alive
Host:localhost:4000
Origin:http://localhost:4200
Referer:http://localhost:4200/signup

我的凤凰日志只是说

[info] OPTIONS /v1/users
[info] Sent 200 in 31µs

不知道我做错了什么。我确实稍微修改了我的 router.ex ......虽然不确定它是否会有所不同,但它就是这里

defmodule Api.Router do
  use Api.Web, :router

  pipeline :api do
    plug :accepts, ["json"]
  end

  scope "/", Api do
    pipe_through :api

    resources "/organizations", OrganizationController
  end

  scope "/v1", Api.V1, as: :v1 do
    pipe_through :api

    resources "/users", UserController, only: [:create, :show, :update]
  end
end

【问题讨论】:

你是 subscribingcreateUser() 方法。用组件代码更新帖子。 @Aravind 已更新,是的,我正在调用它。 plug Corsica 是否高于plug MyApp.Router?您可以尝试暂时将origins 更改为"*" 看看是否可以解决此问题? @Dogbert 是的,plug Corsica 在 plug 之上,我将其更改为“*”,它似乎工作......它现在正在发送 POST 请求!!!!不过,在那张纸条上,当我使用我的 chrome 开发工具时,怎么会同时看到 OPTIONS 和 POST 请求?我以前从未见过。 你可以试试origins: "http://localhost:4200" 一次吗?有用吗? 【参考方案1】:

origins 值与 origin 标头完全匹配。您的请求正在发送原始值 http://localhost:4200,而您只允许 http://localhost。如果要允许来自http://localhost:4200 的请求,则需要将origins 更改为http://localhost:4200

plug Corsica, origins: "http://localhost:4200", allow_headers: ["content-type"]

【讨论】:

你知道为什么它还在发送 200 OPTIONS 响应吗?但不是帖子?我觉得如果 200 OPTIONS 失败会更合理。 @LukeXu @sideshowbarker 在他们回答的最后解释了这一点,比我做得更好。 :)【参考方案2】:

您需要配置http://localhost:4000/v1/users 路由以发送包含Access-Control-Allow-Origin 响应标头的响应,并且还包含带有字符串“Content-Type”的Access-Control-Allow-Headers 响应标头和@987654327 @response header,值中带有字符串POST

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS详细讲解。

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Preflighted_requests 解释了浏览器为何发送 OPTIONS 请求,以及浏览器需要什么响应。

我得到 200 OK OPTIONS 但它从不发送 POST 请求。

这是因为如果OPTIONS 响应不包含Access-Control-Allow-Origin 标头以及Access-Control-Allow-HeadersAccess-Control-Allow-Methods 标头(具有如上所述的值),则浏览器会停在那里并且永远不会发送@987654334 @。

【讨论】:

以上是关于POST 请求在 Phoenix 中变为 200 OPTIONS 但未发送以下 POST的主要内容,如果未能解决你的问题,请参考以下文章

POST 请求在 Postman 中有效,但在 Python 请求中无效(200 响应机器人检测)

如何用Phoenix框架渲染json?

JMeter POST 请求返回 200 OK 而不是 302(重定向)

对API的Golang POST请求返回400,而与e的请求相同。 G。邮差返回200

POST 请求的 HTTP 状态码 202 与 200

Cors Post 请求上的 Axios 网络错误,状态码为 200