React Native NetWork request failed

今天敲代码的时候被两个网络请求的问题搞了一天,不担心累而且心碎

记录一下,吃一堑长一智,不知道我老了再来看还能不能看懂

第一个问题:图片上传到服务器

这里代码就不贴出来了,使用的post提交的格式。同样的代码,在iOS上可以正常上传,在android上上传就是network request failed,

我把代码对比了半天就是一模一样,然后报这种无厘头的错误着实让我心碎,后来android调试,iOS调试搞得我

已经快疯了,最后才发现原来是是我传的数据不对,上传图片到服务器使用的是本地图片URL,我忽略了这一点,

总觉得是代码的问题,问题的方向就是错误的,然后左调试右调试才发现不对的地方。以后记住了,像这种post提

交的请求,网络请求失败的话肯定是数据问题,因为这都没走进服务器。

第二个问题:普通的post请求。

这个问题能够解决纯属偶然,因为我现在还不知道原因出现在哪,情况和第一个比较像,也是post提交,然后报一样的

错误network request failed,,因为刚好把第一个问题解决,再发现这种情况我肯定想肯定是数据不对了,然后就去看数据,

看了半天和后台对比了半天发现不是数据问题,这下真让我醉了,又是对接口,又是android ,iOS对比调试,我感觉我今

天真是被谁诅咒了明明是一个很简单的问题却偏要让我做不出来,最后解决的也是出于偶然,找了别的地方post请求的,

对比一下,然后以碰运气的想法写成这样

  fetch(url,{
        method: "POST",
        headers: {
            "Content-Type": "application/x-www-form-urlencoded"
        },
        body: "fileList=" + file + "&token=" + this.state.token
    })
    .then((response) => response.json())

  一开始我是这样写的,这不是一样的,就是大概给个格式,因为我不想重写了,

这个地方和上面的代码不同的地方就是这里用的表单,然后用的options包起来了我们的数据,

对,你猜的没错,就是因为这个options的问题,可能我说的不对,但是我的发现就是因为这个问题,

我不用options 包起来像上面的代码一样直接请求就OK

let formData = new FormData();
      formData.append(‘file‘, {
        uri: this.state.localimageurl,
        type: ‘image/jpeg‘,
        name: ‘photo.jpg‘
      });

    console.log(formData);
    let options ={};
    options.body = formData;
    options.headers={"Content-Type":"multipart/form-data"};
    options.method=‘POST‘;
    var url = "http://10.4.19.105:8081/aist-filesvr-web/webUploader/uploadPicture";
    fetch(url,options)
    .then((response)=> response.json())
    .then((responseData)=>{
    console.warn(responseData);
}) .catch((error) => { console.warn(error); }) .done();

  最后我想说今天我很不开心  

时间: 2024-08-07 21:19:44

React Native NetWork request failed的相关文章

Network Request Failed

在react native项目中,有时候调用接口会出现这样的错误提示:"Network Request Failed". 一.模拟器上报"Network Request Failed"解决办法,也是官网有提到的: 1. 在Info.plist中添加NSAppTransportSecurity类型Dictionary. 2. 在NSAppTransportSecurity下添加NSAllowsArbitraryLoads类型Boolean,值设为YES 二.在一的基础

【React Native】Execution failed for task ':app:installDebug'. > com.android.builder.testing.api.DeviceException: No online devices found.

error Failed to install the app. Make sure you have the Android development environment set up: https://facebook.github.io/react-native/docs/getting-started.html#android-development-environment. Run CLI with --verbose flag for more details. Error: Co

react native TypeError network request failed

异常出现的原因:由IOS9引入的新特性造成的.iOS9引入了App Transport Security (ATS).这个新特性要求App内部访问网络必须使用Https协议.而我的项目使用的是Htttp协议.所以就报以上错误了. 解决方法是在项目中的info.plist文件中添加,App Transport Security Settings,然后再下面添加Allow Arbitrary Loads并把其boolean值设置为YES 如下图所示

【REACT NATIVE 系列教程之十】真机运行报错COMMAND /BIN/SH FAILED WITH EXIT CODE 1 的解决方法

本站文章均为 李华明Himi 原创,转载务必在明显处注明: 转载自[黑米GameDev街区] 原文链接: http://www.himigame.com/react-native/2315.html Himi最近在真机运行遇到  Command /bin/sh failed with exit code 1  的错误, 模拟器运行没有任何问题.此问题已解决,这里分享下解决方案. 先来看下错误日志,如下图: 主要是划线的部分: 1.PhaseScriptExecution Bundle\ Reac

【React Native错误集】Import fails with "Failed to execute 'ImportScripts' on 'WorkerGlobalScope'"

错误1.Import fails with "Failed to execute 'ImportScripts' on 'WorkerGlobalScope'" 解决1.如果是在Degbug模式下,关闭turn off Debug JS Remotely.再重新运行即可. 错误2:rn报错 unhandled JS Exception: Requiring unknown module "49". if you are sure the module is ther

【React Native错误集】* What went wrong: Execution failed for task ':app:installDebug'.

错误1:* What went wrong: Execution failed for task ':app:installDebug'. > com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallException: INSTALL_FAILED_INSUFFICIENT_STORAGE 解决1:内存不足导致,删除模拟器或真机中其他不用的应用程序,释放空间. 错误2:the development

React Native在开发过程中遇到的一些问题(俗称:坑)

4900 服务器地址错误 运行时产生以下错误:Could not connect to development server. 1.URL地址设置 问题: [objc] view plain copy Could not connect to development server. Ensure the following: - Node server is running and available on the same network - run 'npm start' from reac

React Native 网络层分析

文:志俊(沪江Web前端) 本文原创,转载请注明作者及出处 在使用React Native开发中,我们熟练的采用JavaScript的方式发送请求的方式发送一个请求到服务端,但是处理这个请求的过程其实和处理Web应用中发送的请求的过程是不一样的.因为处理这个请求的目标不是浏览器,而是嵌入这个应用的原生操作系统. 在处理React Native的请求时,分为两部分:一部分是JavaScript的运行环境,另一部分是嵌入JavaScript的Native(即原生Android和IOS)运行环境.Re

基于React Native的跨三端应用架构实践

作者|陈子涵 编辑|覃云 “一次编写, 到处运行”(Write once, run anywhere ) 是很多前端团队孜孜以求的目标.实现这个目标,不但能以最快的速度,将应用推广到各个渠道,而且还能节省大量人力物力. React Native 的推出,为跨平台的开发带来了新的曙光. 虽然 Facebook 官方 blog 的说法 React Native 支持“Learn once, write anywhere.”. 但经过开源社区的不断努力,React Native 已经可以达到“一次编写