as

Settings
Sign out
Notifications
Alexa
亚马逊应用商店
AWS
文档
Support
Contact Us
My Cases
新手入门
设计和开发
应用发布
参考
支持

react-native-cookies

react-native-cookies

@amazon-devices/react-native-cookies库为React Native应用提供了管理Cookie的方法。

Cookie是浏览网站时网页浏览器存储在用户设备上的一小段数据。Cookie旨在用作网站记住状态信息或记录用户浏览活动的可靠机制。

安装

  1. package.json文件中添加JavaScript库依赖项。

    已复制到剪贴板。

           "dependencies": {
             ...
             "@amazon-devices/react-native-cookies__cookies": "1.0.1+6.2.1",
             "@react-native-cookies/cookies": "6.2.1",
             ...
           }
    
  2. 使用npm install命令重新安装依赖项。

示例

以下示例显示了此库中已实现的所有方法。

已复制到剪贴板。

import CookieManager, { Cookie } from "@react-native-cookies/cookies";
import React, { useState } from 'react';
import { Button, ScrollView, StyleSheet, Text, View } from 'react-native';

const App = () => {
  const [response, setResponse] = useState('');

  const mockedCookie: Cookie = {
    name: 'myCookie',
    value: 'myValue',
    domain: 'httpbin.org',
    path: '/',
    httpOnly: true,
    expires: '2030-06-01T12:30:00.00-05:00'
  };

  const url = "https://httpbin.org";

  const testMockedFunction = async (func: (...args: any[]) => Promise<any>, ...args: any) => {
    try {
      setResponse("");
      await func(...args).then(
        (result : any) => setResponse(JSON.stringify(result)),
        (reject : any) => setResponse(JSON.stringify(reject))
      );

    } catch(err) {
      if (err instanceof Error) {
        setResponse(err.message);
      }
    }
  };

  const fetchTest = async () => {
    setResponse("");
    const result = await fetch("https://httpbin.org/get");
    setResponse(`${await result.text()}`);
  };

  return (
    <View style={styles.container}>
      <View style={styles.textArea}>
        <ScrollView>
            <Text style={styles.text} numberOfLines={999}>
                {response}
            </Text>
        </ScrollView>
      </View>
      <View style={[styles.buttonRow, { width: 800 }]}>
          <Button title ={"从httpbin.org获取"} onPress={() => fetchTest()} />
          <Button title={"测试设置的方法"} onPress={() => testMockedFunction(CookieManager.set, url, mockedCookie)} />
          <Button title={"获取httpbin.org Cookie"} onPress={() => testMockedFunction(CookieManager.get, url)} />
          <Button title={"清除所有Cookie"} onPress={() => testMockedFunction(CookieManager.clearAll)} />
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    backgroundColor: '#dfebeb',
    justifyContent: 'center',
    paddingHorizontal: 5,
    flex: 1,
    display: 'flex',
    alignItems: 'center',
    overflow: 'hidden',
  },
  textArea: {
    width: 750,
    height: 250,
    alignItems: 'center',
    marginVertical: 20
  },
  buttonRow: {
    flexDirection: 'row',
    marginVertical: 10,
    justifyContent: 'space-between'
  },
  text: {
    color: 'black',
    fontFamily: 'monospace',
    overflow: 'scroll',
    flex: 1,
  }
});

export default App;

API参考

查看@react-native-cookies/cookies的GitHub存储库中的官方自述文件(仅提供英文版)。

下面的列表示出了已实现功能的当前状态。

方法 描述
set 在给定Cookie对象和URL的情况下设置Cookie
get 为URL获取Cookie
clearAll 清除Cookie
  • 如果没有为Cookie对象指定domain字段,则将改用URL主机。
  • 如果没有为Cookie对象指定path,则假定路径为空路径/
  • 在Vega平台上为任何接受参数的方法设置useWebKit = true都是无操作的。如果未提供任何值,则useWebKit默认为false
  • 将格式错误的URL传递给任何接受URL的方法都会返回错误消息。

实现详情

  • Cookie对象的expires字段可接受的日期时间格式是ISO8601格式,与UTC存在偏移量。在Vega上,设置Cookie后,此项将始终转换为GMT。
    • 例如,在设置了上述示例中的mockedCookie后,后续检索将返回时间戳expires: '2030-06-01T17:30:00.00Z',这是GMT的等效时间。
  • 使用get检索会话Cookie(没有expires字段的Cookie)时,expires字段将填充1970-01-01T00:00:00Z。如果此Cookie要与其他Cookie管理器一起使用,则可能需要从Cookie中删除该字段,否则其他Cookie管理器实现(例如Webview Cookie管理器)可能会认为它已经过期。

支持的版本

程序包名称 亚马逊NPM库版本 Vega OS内部版本号 Vega SDK版本 发布说明
@amazon-devices/react-native-cookies__cookies 1.0.1+6.2.1 OS 1.1 (201010438050) 0.20  

其他资源

有关其他库的信息,请参阅支持的第三方库和服务


Last updated: 2025年10月2日