React Native atob()/btoa() 在没有远程 JS 调试的情况下无法工作

本文介绍了React Native atob()/btoa() 在没有远程 JS 调试的情况下无法工作的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我有一个反应原生的测试应用程序，当我远程启用调试 js 时，一切正常.它在设备(来自 XCode)和模拟器中运行良好，运行后:

I have a testing app in react native, and all works fine when I have enabled the debug js remotely. It works fine in device (from XCode) and simulator, after run:

react-native run ios

问题是，如果我停止远程js调试，登录测试不再有效.登录逻辑非常简单，我正在获取api以测试登录，API端点通过https.

The problem is that if I stop remote js debugging, the login test not works anymore.The login logic is very simple, I'm making a fetch to an api to test a login, the API endpoint is over https.

我需要改变什么?

更新:此代码在 JS Debug Remote Enabled 下完美运行，如果我禁用它，它将不再起作用.

/** * Sample React Native App * github/facebook/react-native * @flow */ import React, { Component } from 'react' import { AppRegistry, StyleSheet, View, Button, Alert } from 'react-native' export default class MyClass extends Component { constructor (props) { super(props) this.testFetch = this.testFetch.bind(this) } async testFetch () { const email = 'email@example' const password = '123456' try { const response = await fetch('www.example/api/auth/login', { /* eslint no-undef: 0 */ method: 'POST', headers: { 'Accept': 'application/json' /* eslint quote-props: 0 */, 'Content-Type': 'application/json', 'Authorization': 'Basic ' + btoa(email + ':' + password) } }) Alert.alert('Error fail!', 'Fail') console.log(response) } catch (error) { Alert.alert('Error response!', 'Ok') } } render () { return ( <View style={styles.container}> <Button onPress={this.testFetch} title="Test me!" /> </View> ) } } const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#F5FCFF' }, welcome: { fontSize: 20, textAlign: 'center', margin: 10 }, instructions: { textAlign: 'center', color: '#333333', marginBottom: 5 } }) AppRegistry.registerComponent('testingReactNative', () => MyClass)

谢谢.

推荐答案

给你 (sketch.expo.io/BktW0xdje).创建一个单独的组件(例如 Base64.js)，导入它即可使用.例如 Base64.btoa('123');

Here you go (sketch.expo.io/BktW0xdje). Create a separate component (e.g. Base64.js), import it and it's ready to use. For instance Base64.btoa('123');

// @flow // Inspired by: github/davidchambers/Base64.js/blob/master/base64.js const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/='; const Base64 = { btoa: (input:string = '') => { let str = input; let output = ''; for (let block = 0, charCode, i = 0, map = chars; str.charAt(i | 0) || (map = '=', i % 1); output += map.charAt(63 & block >> 8 - i % 1 * 8)) { charCode = str.charCodeAt(i += 3/4); if (charCode > 0xFF) { throw new Error("'btoa' failed: The string to be encoded contains characters outside of the Latin1 range."); } block = block << 8 | charCode; } return output; }, atob: (input:string = '') => { let str = input.replace(/=+$/, ''); let output = ''; if (str.length % 4 == 1) { throw new Error("'atob' failed: The string to be decoded is not correctly encoded."); } for (let bc = 0, bs = 0, buffer, i = 0; buffer = str.charAt(i++); ~buffer && (bs = bc % 4 ? bs * 64 + buffer : buffer, bc++ % 4) ? output += String.fromCharCode(255 & bs >> (-2 * bc & 6)) : 0 ) { buffer = chars.indexOf(buffer); } return output; } }; export default Base64;