Axios POST在iOS上失败

I am trying to do a simple ajax POST from domain1 to domain2 using Axios. This is a cross domain simple POST so there is no PREFLIGHT (OPTIONS) call. The response from the application is a simple JSON string.

On Chrome, on Android, Windows and iOS (excluding iPhone) this works fine. But on iPhone 6,7,8+ on both Safari and Chrome i get an error in the console from the axios response.I can see the POST request get to the application on domain2 and a json response is sent. But this is what is shown when i console.log the response in the axios.catch. There are no other details.

Error: Network Error

My POST is a multipart/form-data post with the following Request headers:

Accept: application/json, text/plain, */*
Content-Type: multipart/form-data; boundary=----WebKitFormBoundary81kouhSK7WgyVQZ3
Origin: https://domain1
Referer: https://domain1/test
User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1

And the form data is simply 4 text fields

------WebKitFormBoundary81kouhSK7WgyVQZ3
Content-Disposition: form-data; name="a"
12345
------WebKitFormBoundary81kouhSK7WgyVQZ3
Content-Disposition: form-data; name="b"
asdfasf
------WebKitFormBoundary81kouhSK7WgyVQZ3
Content-Disposition: form-data; name="c"
asdfadsf
------WebKitFormBoundary81kouhSK7WgyVQZ3
Content-Disposition: form-data; name="d"
adfasdfa
------WebKitFormBoundary81kouhSK7WgyVQZ3--

When the POST is sent from Chrome, (or IE and Firefox) on Windows and Mac I get the following response headers and a HTTP 200:

access-control-allow-headers: Accept,Content-Type,Origin,Referer,User-Agent
access-control-allow-methods: GET, POST, PUT, DELETE, OPTIONS
access-control-allow-origin: *
cache-control: no-cache, private
content-type: application/json, text/plain, */*; charset=UTF-8
x-content-type-options: nosniff
x-ratelimit-limit: 60
x-ratelimit-remaining: 59
x-xss-protection: 1

which i have explicitly set on the application of domain2 (Laravel 5.8 application - CORS headers set in middleware).

But on iPhone, both Safari and Chrome (and on Safari browser on a Mac - Chrome works on Mac) I do not see any response - the conole.log(error) shows (see axios code below)

Error: Network Error

And in the network tab looking at the request/response there are no response headers returned and no HTTP status code. Only the request headers are shown.

My axios code is the following:

axios.post('https://domain2/test', formData)           
    .then(function (response) {

        console.log("POST function of axios 1");
        console.log(response);
        console.log("POST function of axios 2");
    })
    .catch(function (error) {
        console.log("Error in catch of axios post");
        console.log(error);
        console.log("End error");
    });

The formData is created using formData.append('a',12345) etc...

I can successfully POST to a test upload from https://domain1 to https://domain1 using the same axios code, so i believe there are some issues with the response headers from domain2 that iOS does not like and kills the response.

I've tried setting/changing all response headers, setting headers on the Axios POST, tried using simple xhr instead of Axios etc but to no avail...same error.

Anyone any pointers? I;ve googled etc... but have not found anything that helps. Even how i could get more information from the Error response on iPhone? I am debugging the iPhone on a Mac so can see the console.log etc...

Many thanks

2个回答


移动设备和服务器是否在同一网络上?
使用服务器的本地网络IP和端口而不是 https:// domain2 </ code>。 将我的示例IP替换为下面的服务器IP和端口。</ p>

  axios.post('http://10.0.0.12:8000/',formData)
</ code> </ pre>

我认为移动设备抛出错误可能无法转换URL https:// domain1 </ code>?</ p>

如果使用服务器IP,也请尝试删除https。
https://stackoverflow.com/a/48843551/4993755
确保在服务器核心设置中启用了 OPTIONS </ code>。 </ p>
     </ div>

展开原文

原文

Is the mobile device and server on the same network? Use the servers local network IP and port instead of https://domain2. Replace my example IP with the servers IP and port below.

axios.post('http://10.0.0.12:8000/', formData)

I think its possible the mobile device throwing the error cant translate the url https://domain1?

Also try with https removed if you are using the servers IP. https://stackoverflow.com/a/48843551/4993755 Make sure OPTIONS is enabled in your servers cors settings.


原来,此错误是由于在响应上设置了Upgrade标头apache所致。
一旦我在apache配置中取消设置该标头,该问题就在iOS上得到解决。
我在域的apache的虚拟主机中的目录部分中设置了以下内容</ p>

 标题未设置升级
</ code> </ pre>
     </ div>

展开原文

原文

Turns out this error was due to an Upgrade header apache was setting on the response. Once i unset that header in the apache config the issue was resolved on iOS. I set the following in the vhost of apache for the domain, in the directory section

Header unset Upgrade

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐