尝试发送POST请求时，App Script发送405响应 [英] App Script sends 405 response when trying to send a POST request

问题描述

我已经使用如下的doPost方法公开发布了一个应用脚本(任何人，甚至是匿名的)，

I have published an app script publicly (Anyone, even anonymous) with a doPost method as follow,

 function doPost(e){
    var sheet = SpreadsheetApp.getActiveSheet();
    var length = e.contentLength;
    var body = e.postData.contents;
    var jsonString = e.postData.getDataAsString();
    var jsonData = JSON.parse(jsonString);
    sheet.appendRow([jsonData.title, length]);
    var MyResponse = "works";
    return ContentService.createTextOutput(MyResponse).setMimeType(ContentService.MimeType.JAVASCRIPT);
}

当我使用Advanced Rest Client发送带有JSON对象的Post请求时，所有请求均有效，并返回200 OK响应.但是，当我尝试从本地托管的react应用发送带有react axios的发布请求时，它会发送405响应.

When I sent a Post request with a JSON object with Advanced Rest Client it all works and return a 200 OK response. But when I try to send a post request with the react axios from a locally hosted react app it sends a 405 Response.

XMLHttpRequest cannot load https://script.google.com/macros/s/AKfycbzyc2CG9xLM-igL3zuslSmNY2GewL5seTWpMpDIQr_5eCod7_U/exec. Response for preflight has invalid HTTP status code 405

我也在浏览器中启用了跨源资源共享.发送POST请求的功能如下，

I have enabled cross origin resource sharing in the browser as well. The function that sends the POST request is as follow,

axios({
          method:'post',
          url:'https://script.google.com/macros/s/AKfycbzyc2CG9xLM-igL3zuslSmNY2GewL5seTWpMpDIQr_5eCod7_U/exec',
          data: {
            "title": 'Fred',
            "lastName": 'Flintstone'
          }
        }).then(function (response) {
            console.log(response);
          })
          .catch(function (error) {
            console.log(error);
          });

推荐答案

您错过了重要部分:

对飞行前的响应具有无效的HTTP状态码405.

Response for preflight has invalid HTTP status code 405.

您的浏览器正在发出预检请求，该请求使用了

Your browser is making a preflight request, which uses the OPTIONS HTTP method. This is to check whether the server will allow the POST request – the 405 status code is sent in the response to the OPTIONS request, not your POST request.

CORS预检请求是一个 CORS 请求，该请求会检查是否存在CORS协议被理解.  ^源

---

此外，对于可能导致服务器数据产生副作用的HTTP请求方法(尤其是对于 GET ，或用于 POST 使用某些 MIME类型)，则该规范要求浏览器预检"请求，并使用HTTP OPTIONS 请求方法，然后在服务器批准"后，使用实际的HTTP请求方法发送实际的请求. CORS预检.在本文中，这些被称为简单请求" [a] ="a href =" https://developer.mozilla.org/docs/Web/HTTP/CORS#Simple_requests"rel =" noreferrer> ^来源
_{本文部分详细介绍了将请求视为简单请求"所必须满足的条件.}

---

[...]预检"请求首先通过 OPTIONS发送HTTP请求方法访问另一个域上的资源，以确定实际请求是否可以安全发送.跨站点请求会这样进行预检，因为它们可能会影响用户数据.  ^源
_{本文部分详细介绍了导致请求被预查的条件.}

A CORS preflight request is a CORS request that checks to see if the CORS protocol is understood. ^Source

---

Additionally, for HTTP request methods that can cause side-effects on server's data (in particular, for HTTP methods other than GET, or for POST usage with certain MIME types), the specification mandates that browsers "preflight" the request, soliciting supported methods from the server with an HTTP OPTIONS request method, and then, upon "approval" from the server, sending the actual request with the actual HTTP request method. ^Source

---

Some requests don’t trigger a CORS preflight. Those are called "simple requests" in this article [...] ^Source
_{This article section details the conditions a request has to meet to be considered a "simple request".}

---

[...] "preflighted" requests first send an HTTP request by the OPTIONS method to the resource on the other domain, in order to determine whether the actual request is safe to send. Cross-site requests are preflighted like this since they may have implications to user data. ^Source
_{This article section details the conditions which cause a request to be preflighted.}

在这种情况下，以下原因导致请求被预检:

In this case, the following is causing the request to be preflighted:

[...] 如果 Content-Type 标头具有以下值:

[...] if the Content-Type header has a value other than the following:

• application/x-www-form-urlencoded
• multipart/form-data
• text/plain

• application/x-www-form-urlencoded
• multipart/form-data
• text/plain

Content-Type标头的值由axios设置为application/json;charset=utf-8.使用text/plain;charset=utf-8或text/plain可解决问题:

The value for the Content-Type header is set to application/json;charset=utf-8 by axios. Using text/plain;charset=utf-8 or text/plain fixes the problem:

axios({
    method: 'post',
    url: 'https://script.google.com/macros/s/AKfycbzyc2CG9xLM-igL3zuslSmNY2GewL5seTWpMpDIQr_5eCod7_U/exec',
    data: {
        title: 'Fred',
        lastName: 'Flintstone',
    },
    headers: {
        'Content-Type': 'text/plain;charset=utf-8',
    },
}).then(function (response) {
    console.log(response);
}).catch(function (error) {
    console.log(error);
});

这篇关于尝试发送POST请求时，App Script发送405响应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！