undefinedfix
Sign in

Axios failed to cross domain request on mobile web page, HTTP status code returned 0

hank edited in Thu, 21 Jul 2022

Project Description: using Vue framework, AJAX request using Axios, the back-end has set CORS

In the case of cross domain, there is no problem in the PC browser access, you can get data normally

The HTTP status code returned by the browser on the mobile phone is 0, so the data cannot be obtained, as shown in the figure

图片描述

First of all, in order to prove that it is caused by cross domain problems, I made a homologous request on my own server. There is no problem on the mobile terminal, and the data can be obtained normally. This can prove that it is caused by cross domain problems

At the same time, in order to prove that it is Axios related, I use native Ajax and jQuery for cross domain requests respectively, and there is no problem on the mobile side.

It can be summarized as follows: in the case of cross domain, Axios has problems in the mobile request

So I think of two ways to deal with it: the first is not to make cross domain requests, but this is limited to the back-end, because the web page is stored in the back-end server, and the domain name of the general API is a secondary domain name, so the secondary domain name is also a cross domain request, so this method is abandoned. The second is to use the native Ajax request or jQuery instead of the Axios request If so, there will be a lot less functions.

I would like to ask why this situation occurs on the mobile end when cross domain requests are made with Axios! Thank you for your answers.

Supplementary note: the built-in QQ browser and mobile chrome in wechat can request normally, but the request fails in UC and QQ browser alone

9 Replies
beat_it_987
commented on Thu, 21 Jul 2022

I'm sorry to have kept you waiting for a long time. I didn't expect that so many people had this problem. I also mentioned that CORS is used to solve the cross domain problem. Although I have solved this problem, I haven't found out the reason yet. To solve this problem, the back end has changed a line of code: access control allow headers: * / / error. The headers above can't be set to *. To set the specific fields, the following is access control allow headers: content type / / right

MikeRyz
commented on Thu, 21 Jul 2022

The back end allows cross domain. Secondly, cross domain is limited by the browser's homology policy, so jQuery can't solve the problem.

mpjxc
commented on Thu, 21 Jul 2022

Change fly.js try

iqrabookmart
commented on Thu, 21 Jul 2022

The reason may be that the HTTP page requests the data of HTTP, or the HTTP page requests the data of HTTPS. But there will be no error in IOS. Android is normal.

user616861
commented on Thu, 21 Jul 2022

Has the problem been solved

faza
commented on Fri, 22 Jul 2022

Seeking the same solution

Albertus
commented on Fri, 22 Jul 2022

Do you have a solution ~ ~, online, etc

FoulFoot
commented on Fri, 22 Jul 2022

I also encountered this problem, I appeared on the wechat client in the window. Cross domain has been set in the back end, and both the front and back end are HTTPS. And try to change access control allow headers: * to access control allow headers: content type, which is useless

Rosie
commented on Fri, 22 Jul 2022

I also encountered this problem. How did I solve it

lock This question has been locked and the reply function has been disabled.