Can‘t find variable: token（token is not defined）

Can't find variable: token

token is not defined

源代码

// index.js

Page({
  data: {
    products:[],
    cardLayout: 'grid',  // 默认卡片布局为网格模式
    isGrid: true,  // 默认为网格布局
    page: 0, // 当前页码
    size: 10, // 每页大小
    hasMore: true, // 是否还有更多数据
    loading:true,
    showBottomImage: false, // 控制底部图片的显示状态
    searchValue: '',
    currentFilter: 'all', // 默认选中 all
  },
  // 处理网格视图按钮点击事件
  handleGridViewClick: function() {
    const currentLayout = this.data.cardLayout;
    const newLayout = currentLayout === 'grid' ? 'list' : 'grid';

    this.setData({
      cardLayout: newLayout,
      isGrid: !this.data.isGrid
    });
  },
  onLoad: function () {
    this.fetchData();
  },
  // 发送请求获取数据
  async fetchData(page = 0, size = 10) {
    try {
      
      // const token = wx.getStorageSync('token')
      try {
        // 使用 await 等待 getToken() 的结果
        const app = getApp();
        const token = await app.getToken();
        console.log("获取商品数据前需要携带token=" + token);
  
      } catch (error) {
        console.error('Token 获取失败:', error);
        wx.showToast({
          title: 'Token 获取失败，请重新登录',
          icon: 'none'
        });
      }

      
      if (!token) {
        wx.showToast({
          title: '获取 token 失败，请重试',
          icon: 'none'
        });
        return;
      }

      const response = await new Promise((resolve, reject) => {
        wx.request({
          url: 'https://api.crossbiog.com/product/admin/list', // 使用配置文件中的URL
          method: 'GET',
          data: { page, size }, // 分页参数
          header: { 
            'token': token,
            'Cache-Control': 'max-age=60' // 设置缓存时间为60秒
          },
          success: resolve,
          fail: reject
        });
      });

      console.log('response:', response); // 添加这一行来检查响应数据
          
      if (response.statusCode === 200) {

          //检查 response.data 是否存在
          if (!response.data || !response.data.data) {
            wx.showToast({
              title: '数据格式错误 null is not an object',
              icon: 'none'
            });
            return;
          }
          
        const products = response.data.data.content || [];
        const formattedProducts = products.map(product => ({
          ...product,
          image:  `https://www.crossbiog.com/${product.image}`
        }));

        const filteredProducts = formattedProducts.filter(product =>
          product.status === 1 && product.editAuth === 1
        );

        this.setData({
          products: [...this.data.products, ...filteredProducts],
          loading: false, // 如果有加载指示器，设置为false
          hasMore: filteredProducts.length === size, // 是否还有更多数据
          page:page //更新页面数据中的page值
        });

        if (filteredProducts.length < size) {
          wx.showToast({
            title: '没有更多数据了',
            icon: 'none'
          });
        }
      } else {
        wx.showToast({
          title: '数据加载失败',
          icon: 'none'
        });
      }
    } catch (error) {
      wx.showToast({
        title: error.message || '请求失败',
        icon: 'none'
      });
    }
  },
  
  //监听页面触底事件，如用于加载更多数据。
  onReachBottom: function() {
    if (this.data.hasMore) {
      this.fetchData(this.data.page + 1, this.data.size);
    } else {
      wx.showToast({
        title: '没有更多数据了',
        icon: 'none'
      });
    }
    // 用户滑动到页面底部时触发
    this.setData({
      showBottomImage: true
    });
  },

  // 扫描二维码
  scanQrcode: function() {
    wx.scanCode({
      onlyFromCamera: false,  // 允许从相机和相册中选择图片
      success: (res) => {
        const jancode = res.result;
        console.log("扫描结果:", jancode);
        this.getProductByJancode(jancode);
      },
      fail: (err) => {
        wx.showToast({
          title: '扫描失败，请重试',
          icon: 'none'
        });
      }
    });
  },

  // 获取 token
  getToken: function() {
    return new Promise((resolve,reject)=>{
      const token = wx.getStorageSync('token')
      resolve(token)
    });
  },
  
  // 根据条码查询产品信息
  getProductByJancode: function(jancode) {
    this.getToken().then((token) => {
      if (!token) {
        wx.showToast({
          title: '获取 token 失败，请重试',
          icon: 'none'
        });
        return;
      }
      wx.request({
        url: `https://api.crossbiog.com/product/admin/detailByJancode`, // 使用配置文件中的URL
        method: 'GET',
        data: {
          jancode: jancode
        },
        header: {
          'token': `${token}`
        },
        success: (res) => {
          console.log("res=" + res);
          console.log("后端返回的数据:", res.data); // 添加日志输出
          if (res.statusCode === 200 && res.data && res.data.data) {
            const product = res.data.data;
            if (product) {
              // 显示产品信息
              this.setData({
                products: [product],
                showNoResultsImage: false // 如果有结果，隐藏无结果图片
              });
            } else {
              // 没有找到产品
              wx.showToast({
                title: '未找到该条码对应的产品',
                icon: 'none'
              });
              this.setData({
                showNoResultsImage: true // 如果没有结果，显示无结果图片
              });
            }
          } else {
            wx.showToast({
              title: '数据加载失败',
              icon: 'none'
            });
          }
        },
        fail: (err) => {
          wx.showToast({
            title: '请求失败',
            icon: 'none'
          });
        }
      });
    }).catch((err) => {
      wx.showToast({
        title: err.message,
        icon: 'none'
      });
    });
  },

  // 点击商品卡片后跳转到详情页
  navigateToDetail(event) {
    const productId = event.currentTarget.dataset.id;
    console.log("跳转到详情页，产品ID:", productId);
    wx.navigateTo({
      url: `/pages/productDetail/productDetail?id=${productId}`,
    });
  },

        // 处理输入框的输入事件
        handleSearchInput: function (e) {
          this.setData({
            searchValue: e.detail.value // 更新输入框的值
          });
        },
  
        // 处理搜索事件（按下回车时）
        handleSearch: function () {
          const value = this.data.searchValue; // 获取输入的值
          if (!value) {
            wx.showToast({
              title: '请输入搜索内容',
              icon: 'none'
            });
            return;
          }
              // 获取 token 并跳转到结果页面
              this.getToken().then((token) => {
                  if(!token){
                      wx.showToast({
                        title: '获取 token 失败，请重试',
                        icon: 'none'
                    });
                    return;
                  }
                  // 跳转到另一个页面，并传递搜索内容和 token
                  wx.navigateTo({
                      url: `/pages/searchResults/searchResults?value=${value}&token=${token}`
                  }); 
              }).catch((err)=>{
                    // 获取 token 失败时，在这里处理错误
                    wx.showToast({
                        title: '获取 token 失败，请重试',
                        icon: 'none'
                    });
              })
        },

        handleFilterClick: function(e) {
        const filterType = e.target.dataset.type;
        this.setData({
          currentFilter: filterType,
          page: 0, // 重置页码
          hasMore: true, // 重置是否有更多数据标志
          products: [] // 清空当前商品列表
        });
        this.fetchData();
    },

   
  // 用户点击右上角分享按钮时触发
  onShareAppMessage: function (res) {
    // 调用全局分享配置方法
    // return app.getShareConfig(
    //   'pages/index/index',
    //   '让自然拥抱肌肤，为美注入灵感', // 分享的标题
    //   '/icons/no-results.png' // 分享的图片 URL
    // );
  },

   // 用户点击右上角分享按钮时触发（分享到朋友圈）
   onShareTimeline: function (res) {
    return {
      title: '让自然拥抱肌肤，为美注入灵感',
      //query: 'param1=value1&param2=value2', // 分享的查询参数
      imageUrl: '/icons/no-results.png', // 分享的图片 URL
      success: function () {
        wx.showToast({
          title: '分享成功',
          icon: 'success',
          duration: 2000
        });
      },
      fail: function () {
        wx.showToast({
          title: '分享失败',
          icon: 'none',
          duration: 2000
        });
      }
    };
  }
})

在 JavaScript 中，try...catch 语句用于异常处理，但它并不会创建一个新的作用域。这意味着在 try 块中声明的变量可以在 try 块外部访问，只要这些变量是使用 var、let 或 const 在 try 块外部声明的。

然而，如果你在 try 块内部使用了 let 或 const 来声明变量，并且这些变量只在 try 块内使用，那么它们将不会在 try 块外部可见。这是因为 let 和 const 具有块级作用域（block scope），而 var 具有函数级作用域（function scope）或全局作用域（global scope）。

例子 1：使用 var

try {
  var token = 'some-token';
  console.log('Inside try:', token); // 输出: Inside try: some-token
} catch (error) {
  console.error(error);
}

console.log('Outside try:', token); // 输出: Outside try: some-token

在这个例子中，token 是用 var 声明的，因此它在 try 块外部也是可见的。

例子 2：使用 let 或 const

try {
  let token = 'some-token';
  console.log('Inside try:', token); // 输出: Inside try: some-token
} catch (error) {
  console.error(error);
}

console.log('Outside try:', token); // 报错: ReferenceError: token is not defined

在这个例子中，token 是用 let 声明的，因此它只在 try 块内部可见，try 块外部无法访问它。

例子 3：异步操作

如果你在 try 块中进行异步操作（如 await），并且希望在 try 块外部访问结果，你可以将结果赋值给一个在 try 块外部声明的变量。

async function fetchData() {
  let token; // 在 try 块外部声明

  try {
    token = await app.getToken();
    console.log('Inside try:', token); // 输出: Inside try: some-token
  } catch (error) {
    console.error('Token 获取失败:', error);
  }

  console.log('Outside try:', token); // 输出: Outside try: some-token
}

在这个例子中，token 是在 try 块外部声明的，因此即使在 try 块内部进行了异步操作，token 仍然可以在 try 块外部访问。

你的代码中的情况

根据你提供的代码片段，token 是在 try 块内部通过 await 获取的。为了确保 token 可以在 try 块外部访问，你应该在 try 块外部声明 token 变量：

async fetchData(page = 0, size = 10) {
  let token; // 在 try 块外部声明

  try {
    const app = getApp();
    token = await app.getToken();
    console.log("获取商品数据前需要携带token=" + token);

    if (!token) {
      wx.showToast({
        title: '获取 token 失败，请重试',
        icon: 'none'
      });
      return;
    }

    // 继续执行请求...
  } catch (error) {
    console.error('Token 获取失败:', error);
    wx.showToast({
      title: 'Token 获取失败，请重新登录',
      icon: 'none'
    });
  }

  // 现在可以在 try 块外部使用 token
  if (token) {
    // 使用 token 进行网络请求
    const response = await new Promise((resolve, reject) => {
      wx.request({
        url: 'https://api.crossbiog.com/product/admin/list',
        method: 'GET',
        data: { page, size },
        header: {
          'token': token,
          'Cache-Control': 'max-age=60'
        },
        success: resolve,
        fail: reject
      });
    });

    console.log('response:', response);

    if (response.statusCode === 200) {
      // 处理响应数据
    } else {
      wx.showToast({
        title: '数据加载失败',
        icon: 'none'
      });
    }
  }
}

通过这种方式，你可以确保 token 在 try 块外部也可以被访问和使用。这样可以避免 token is not defined 的错误，并确保你的代码逻辑正确运行。