angular - Angular 5 Post 不工作

问题描述

我已经在 Angular 5 中创建了应用程序。我正在调用带有标题的 api，它不会在浏览器中添加标题。它将在标题中显示 OPTION 而不是它。403 响应。我已经在我的服务中启用了 CORS。当我在没有标题的情况下调用此帖子时，它工作正常。请让我知道问题出在哪里。

 var headerOptions = new Headers();
        headerOptions.append('Content-Type', 'application/json');    
        headerOptions.append('Auth-Token', '12345');

        var requestOptions = new RequestOptions({ method: RequestMethod.Post, headers: headerOptions });
        return this.http.post("mydomain.com/api/getdata", null, requestOptions)
          .map((data: Response) => { return data.json() })
          .toPromise().then(x => {



          }).catch(e => {
            console.log(e);
          });
      }

标签： angular

为请求方法 OPTIONS 返回带有 200 状态码的响应

由浏览器检查服务器是否允许请求方法。收到200个浏览器后会发送你的实际请求。

https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/OPTIONS

https://github.com/mgonto/restangular/issues/368

如果您使用的是 PHP： 您可以在 API/后端逻辑中拦截您的请求。我在我的项目中使用了一个函数（Zend Framework3 - PHP）

    public function handlePreflightRequests(MvcEvent $event) {
    if ($event->getRequest()->getMethod() == 'OPTIONS') {
        $response = $event->getResponse();
        $response->setStatusCode(200);
        $response->getHeaders()->addHeaderLine('Content-Type', 'application/json');
        $view = new JsonModel(array('status' => 'success', 'message' => 'Checkpost passed'));
        $response->setContent($view->serialize());
        return $response;
    }
}

您可以在 laravel 中构建一个中间件，或者只检查控制器中的请求方法发送成功响应并在您的 htaccess 中添加：

<IfModule mod_headers.c>
Header always set Access-Control-Allow-Origin "*"
Header always set Access-Control-Allow-Methods "GET, POST, PUT, PATCH, DELETE, OPTIONS"
Header always set Access-Control-Allow-Headers "Cache-Control, Pragma, Origin, Authorization, Content-Type, X-Requested-With, WU-Api-Key, WU-Api-Secret"

angular - Angular 5 Post 不工作

问题描述

解决方案

推荐阅读