Uniapp解决app和H5跨域问题

简介: Uniapp解决app和H5跨域问题

Uniapp解决app和H5跨域问题

1、创建request全局配置文件

module.exports = (vm) => {
  // 初始化请求配置 
  // 设置跨域问题
  // #ifdef H5
  // 此为自定义配置参数,具体参数见上方说明
  uni.$u.http.setConfig({
  baseUrl: 'api',
  loadingText: '努力加载中~',
  loadingTime: 800,
  // ......
  });
  // #endif
// #ifndef H5
  // 此为自定义配置参数,具体参数见上方说明
  uni.$u.http.setConfig({
  baseUrl: 'http://192.168.xx.xx:xxxxx',
  loadingText: '努力加载中~',
  loadingTime: 800,
  // ......
  });
  // #endif
}

2、在manifest.json中对H5进行配置

"h5": {
  "devServer": {
    "proxy": {
    "/api": {
      "target": "http://192.168.xx.xx:xxxx",
      "pathRewrite": {
      "^/api": ""//这个api要和request中对H5配置的baseUrl保持一致
      }
    }
    }
  }
  }

下面示例是文件所在位置


image.png


3、在main.js中全局配置

import App from './App'
App.mpType = 'app'
const app = new Vue({
  ...App
}) 
// 引入请求封装,将app参数传递到配置中
require('@/config/request.js')(app)

uniapp官网网络请求地址

https://uniapp.dcloud.io/api/request/request.htmlimage.png

目录
相关文章
|
移动开发 前端开发 Android开发
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
2019 12
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
12月前
|
移动开发 JavaScript 应用服务中间件
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
1283 5
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
移动开发 Rust JavaScript
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
1348 4
【01】首页建立-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
移动开发 Android开发
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【03】建立隐私关于等相关页面和内容-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
599 0
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
863 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
存储 人工智能 移动开发
uni-app+vue3接入deepseek-v3搭建跨端ai流式(小程序+app+h5)
基于Uniapp+Vue3+Markdown接入DeepSeek-V3聊天大模型,支持编译到H5+小程序+App端。实现流式输出、支持亮色/暗黑主题、代码高亮、会话本地存储等功能。
2537 12
|
XML 移动开发 开发者
京东商品详情数据接口(H5、APP 端)
京东商品详情数据接口是为H5和APP开发者提供的工具,支持获取商品名称、价格、库存、销量、评价、图片等详细信息,优化应用功能。接口返回JSON或XML格式数据,方便解析处理。适用于电商导购、社交媒体分享、活动推广、价格监控等场景,提升用户体验和购物决策效率。示例代码展示了使用Python发送GET请求的方法。
|
移动开发 JSON API
1688 商品详情数据接口(H5、APP 端)
1688商品详情数据接口是1688平台提供的数据交互通道,支持H5和APP端,提供商品的全面信息(如标题、价格、库存、销量等),并实时更新。开发者可通过HTTP/HTTPS协议调用接口,使用GET或POST方法获取数据。示例代码展示了如何用Python请求该接口,需替换API密钥和商品ID。
|
移动开发 小程序
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
1043 0
|
缓存 移动开发 JavaScript
如何优化UniApp开发的App的启动速度?
如何优化UniApp开发的App的启动速度?
1788 139

热门文章

最新文章