API 集成

MootingAPP 与后端 API 的集成说明。

HTTP 客户端

Axios 配置

// services/api.js
import axios from 'axios';

const BASE_URL = 'http://localhost:8080';

const apiClient = axios.create({
  baseURL: BASE_URL,
  timeout: 10000,
  headers: {
    'Content-Type': 'application/json',
  },
});

export default apiClient;

请求拦截器

apiClient.interceptors.request.use(
  (config) => {
    const token = getStoredToken();
    if (token) {
      config.headers.Authorization = `Bearer ${token}`;
    }
    return config;
  },
  (error) => Promise.reject(error)
);

响应拦截器

apiClient.interceptors.response.use(
  (response) => response,
  (error) => {
    if (error.response?.status === 401) {
      // Token 过期，跳转登录
      handleLogout();
    }
    return Promise.reject(error);
  }
);

API 函数

用户注册

export const registerUser = async (data) => {
  const response = await apiClient.post('/api/auth/register', data);
  return response.data;
};

发送验证码

export const sendVerifyCode = async (type, target) => {
  const response = await apiClient.post('/api/verify-code/send', {
    type,
    target,
  });
  return response.data;
};

验证登录

export const verifyCode = async (target, code) => {
  const response = await apiClient.post('/api/verify-code/verify', {
    target,
    verifyCode: code,
  });
  return response.data;
};

使用示例

import { sendVerifyCode, verifyCode } from '../services/api';

const LoginScreen = () => {
  const [email, setEmail] = useState('');

  const handleSendCode = async () => {
    try {
      await sendVerifyCode('email', email);
      Alert.alert('验证码已发送');
    } catch (error) {
      Alert.alert('发送失败', error.message);
    }
  };

  return (
    <View>
      <TextInput value={email} onChangeText={setEmail} />
      <Button title="发送验证码" onPress={handleSendCode} />
    </View>
  );
};

环境配置

根据环境切换 API 地址：

const getBaseUrl = () => {
  if (__DEV__) {
    return 'http://localhost:8080';
  }
  return 'https://api.mooting.life';
};