当我调用 post 方法时反应原生 Axios 或 fetch（get 方法工作正常） post 参数在服务器端获取空数据

Posted 2023-03-28

【中文标题】当我调用 post 方法时反应原生 Axios 或 fetch（get 方法工作正常） post 参数在服务器端获取空数据

【英文标题】：React native Axios or fetch when i called post method (get method working fine) post parameters are getting null data on server side

【发布时间】：2020-10-28 10:56:10

【问题描述】：

当调用 post 方法时，在服务器端 (php - Codeigniter) 获取空参数。 当我使用JSON.stringify 它正在工作但在服务器端，我必须使用有效负载处理请求（$request_body = file_get_contents('php://input')) 现在很好，问题是当我尝试上传文件时（视频/图像） , Payload 将不支持。所以如果我使用表单数据它会引发网络错误，这意味着 Axios 甚至没有去服务器。我已经从 javascript、php 和邮递员测试了相同的服务都工作正常只有反应-native call failed 那么解决方案是3天了，我正在尝试通过更改标题内容来解决这个问题，这是一种仍然无法理解的不同方式。

下面给出的代码

   // alert('check ');
    // const res = DocumentPicker.pick(
    //     type: [DocumentPicker.types.allFiles],
    // ).catch(error => 
    //     alert('doct' + error);
    // );
    //Printing the log realted to the file  
    const imageUrl = 'https://image.shutterstock.com/image-photo/floral-spring-natural-landscape-wild-260nw-1274207287.jpg';
    // if (true) 
    // const fileToUpload = res;
    const formData = new FormData();
    formData.append('name', 'Image Upload');
    formData.append('file_attachment', 
        uri: imageUrl,
        type: "image/jpg",
        name: 'floral-spring-natural-landscape-wild-260nw-1274207287.jpg'
    );
    Axios(
        url: URL + '/VideosController/upload',
        method: 'POST',
        data: formData,
        headers: 
            'Accept': 'application/json',
            'Content-Type': 'multipart/form-data'
        ,
    ).then(
        response => 
            alert('res' + JSON.stringify(response.data));
        ,
        error => 
            alert('check+ ' + error);
        )
        .catch(error => 
            alert('No error' + error);
        );

服务器端 PHP 代码

header("Access-Control-Allow-Methods: GET,POST, OPTIONS");
header("Access-Control-Allow-Headers: Content-Type, Content-Length, Accept-Encoding");
// By searching i seen it might cors error so added headers on top of my method no use



  if(!empty($_FILES['file_attachment']['name'])) 
    $res        = array();
    $name       = 'file_attachment';
    $imagePath  = 'assets/upload/file_attachment';
    $temp       = explode(".",$_FILES['file_attachment']['name']);
    $extension  = end($temp);
    $filenew    = str_replace($_FILES['file_attachment']['name'],$name,$_FILES['file_attachment']['name']).'_'.time().''. "." .$extension;          
    $config['file_name']   = $filenew;
    $config['upload_path'] = $imagePath;
   
    $this->upload->initialize($config);
    $this->upload->set_allowed_types('*');
     print_r($_FILES);
    exit;
    $this->upload->set_filename($config['upload_path'],$filenew);
    
    if(!$this->upload->do_upload('file_attachment')) 
      $data = array('msg' => $this->upload->display_errors());
     else 
      $data = $this->upload->data();    
      if(!empty($data['file_name']))
        $res['url'] = 'assets/upload/file_attachment/'.$data['file_name']; 
      
      if (!empty($res)) 
    echo json_encode(array("status" => 1, "data" => array() ,"msg" => 'upload successfully', 'base_url' => base_url(), "count" => '0'));
      else
    echo json_encode(array("status" => 1,"data" => array() ,"msg" => 'not found', 'base_url' => base_url(), "count" => '0'));
      
    
  

使用 formdData 时出错：

error = 错误：在 EventTarget.handleError (http://localhost:8081/index) 的 createError (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:155044:17) .bundle?platform=android&dev=true&minify=false:154946:16) 在 EventTarget.dispatchEvent (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:34135:27) 在 EventTarget.setReadyState (http ://localhost:8081/index.bundle?platform=android&dev=true&minify=false:33219:20) 在 EventTarget.__didCompleteResponse (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:33046: 16) 在 http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:33156:47 在 RCTDeviceEventEmitter.emit (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false :3422:37) 在 MessageQueue.__callFunction (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2750:44) 在 http://localhost:8081/index.bundle?platform=android&dev =true&minify=false:2472:17 在 M essageQueue.__guard (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2704:13)

请说明实际发生的主题和解决方案。

【参考方案1】：

首先你需要提升服务器端的有效负载限制，仍然会导致问题然后提及细节。

【讨论】：

感谢您没有主题的回复，我们所做的一切都没有用我的问题是 formData 中的网络错误它与服务器端的有效负载限制无关

经过我的研究，我发现它是 FLIPPER_VERSION 中存在的问题，通过将其升级到 0.41.0 这个问题将得到解决。

是的，我在尝试检索base64图像数据时也遇到了同样的问题，然后我升级了flipper版本，它解决了问题。

【参考方案2】：

最后，我通过将 FLIPPER_VERSION 升级到 0.41.0 找到了解决方案，这个问题得到了解决，但如果我升级了应用程序，我什至无法打开。所以现在我所做的是在下面的文件中，我刚刚评论了这些行。为我工作。

\android\app\src\debug\java\com\appname\ReactNativeFlipper.java

public void apply(OkHttpClient.Builder builder) 
            //  builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
            

我刚刚评论了这一行以获得更多帮助，您可以查看以下链接

网址：https://github.com/facebook/react-native/issues/28551#issuecomment-656601532

如果您想更新鳍状肢版本，它将在 ..\android\gradle.properties