uniapp || uniapp连接不上后台，无法获取数据

最新推荐文章于 2024-02-08 20:41:41 发布
最新推荐文章于 2024-02-08 20:41:41 发布
阅读量4.3k 收藏 7
点赞数 4
分类专栏： 前端 文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Sunshine_DXM/article/details/118635917
版权

目录

问题：

今天在使用HBuilderX进行真机测试时，突然获取不到后台数据了。HBuilderX报错如下：
在这里插入图片描述

解决方法：

1.打开命令行，输入ipconfig，查看IPV4地址
在这里插入图片描述

2.打开http.interceptor.js
在这里插入图片描述
3.将baseUrl参数修改为本地IPV4地址
在这里插入图片描述
这里使用localhost不可行

避免踩坑：

1.一定要启动后台！！！

2.不要用debug模式！！！

·九思·
关注
专栏目录
uniapp接收服务器消息,uniapp连接webSocket实例，收发数据存储到本地，详细教程
weixin_32601635的博客
07-30 5581
在最近通过uniapp开发的项目中，用到了webSocket技术来实现聊天功能，由于是第一次写这样的代码，碰到了不少坑和弯路，但是结果还是可以的，开发出来的聊天效果非常顺滑，远远超过普通的接口实时查询，总之很赞。同样的，我作为一个新手开始摸坑uniapp的webSocket也是比较麻烦的，网上的教程很多不可用或者残缺，官方的文档总是那么的简洁让刚入门的不是很好理解，所以还是整理一个文档自己记录，以...
uni-app 项目调用手机原生事件，获取蓝牙连接，打印信息
06-16
注意，由于各平台对蓝牙API的支持程度不同，部分功能可能在某些平台上不可用，因此在编写代码时要考虑兼容性问题。 在提供的压缩包文件“bluetooth”中，可能包含了实现上述功能的示例代码、配置文件或者文档，你...
uniapp向后端发起请求，报连接失败错误
weixin_42148384的博客
07-12 951
uniapp的app端向后端发起请求报错request:fail abort statusCode:-1 Failed to connect to localhost/127.0.0.1:xxxx
uni-app uni.uploadFile 上传图片后台接收不到（后台C#）
qiandeqiande的专栏
11-27 7289
参考：https://ask.dcloud.net.cn/article/35547 前端代码 <template> <view class="page"> <view class='feedback-title feedback-star-view'> <text>项目</text> <picker v-i...
内网穿透后无法访问springboot项目后端
letterljhx的博客
04-20 1041
内网穿透后无法访问Springboot项目后端
记录 vue项目打包放入 hbuilder 做app真机测试时 无法请求后台服务接口
cscscssjsp的博客
03-04 5854
1.因为发布app时 vue开发模式下配置的跨域是无效的，打包后会找不到接口 例如下面是之前的错误版： '/propertyCmsAPI': { target: 'http://192.168.1.111:9001/', changeOrigin: true, pathRewrite: { '^/propertyCms...
uni-app的uni.uploadFile后台接收不到文件踩坑、补坑！
h_h_y1994的博客
10-09 1万+
一开始项目是打算做成微信小程序的，所以基本都是在微信开发者工具上调试，因为项目功能越做越大，越来越复杂，微信小程序感觉不合适了，就打算转app(这里不得不佩服uni-app的厉害之处)。虽然转app,但是还是可以直接在微=微信开发者工具上调试的。但是鬼使神差的，调试uni.uploadFile时就直接真机调试了，然后问题就来了。。。。 我是用django写的后台，但是后台一直收不到上传的文件，可是...
uniapp源码WIFI密码连接破解小程序源码.zip
07-07
综上所述，这个源码项目提供了从用户界面到服务器端的完整解决方案，涵盖了uniapp小程序开发、WiFi网络管理、用户交互和激励机制等多个技术点。对于开发者来说，它可以作为一个学习案例，了解如何在uniapp框架下构建...
考拉开源仿微信uniapp前端+JAVA后端IM即时通讯
08-17
《考拉开源仿微信uniapp前端+JAVA后端IM即时通讯》 本项目是一个基于开源技术构建的即时通讯系统，其设计灵感来源于微信，旨在提供类似微信的聊天体验。项目的核心在于前端使用了uniapp框架，后端采用了JAVA语言...
php后台+uniapp，IM智能客服支持安卓+pc+H5+全教程
03-24
在现代互联网应用中，即时通讯（Instant Messaging，简称IM）已经成为不可或缺的一部分，无论是用于企业内部沟通还是为用户提供在线客服服务。本教程将全面讲解如何利用PHP后台与UniAPP前端框架，构建一个跨平台的IM...
uin-app 对接后端接口报错This request has been blocked； the content must be served over HTTPS.
fengxiangxi的博客
10-24 548
解决uin-app项目在对接后台接口时产生的必须通过HTTPS请求问题
uniapp 请求本地后台是请求不到数据的问题解决方案
爱我非你莫属的博客
09-25 4002
前端代码如下 后端代码如下： import os import sys from flask import Flask, request, jsonify, make_response, abort, json, send_from_directory from flask_cors import * import json app = Flask(__name__) #设置跨域 CORS(app, supports_credentials=True) @app.route('/getlunbo', .
uniapp转微信小程序使用真机调试后台接口请求不到
qq_43894292的博客
09-21 6125
uniapp
Uniapp真机调试：手机端访问电脑端的后端接口解决
最新发布
不知道你是通过何种途径访问到这里，总之欢迎来到red velet的博客
02-08 4099
hbuildx的uniapp项目真机调试、手机app访问电脑的Java后端项目、内网互通、手机访问电脑的后端项目接口、IPV4
使用uni-app的uni.uploadFile()上传遇到的问题
weixin_58508879的博客
08-16 1万+
在使用uni.uploadFile() 上传遇到了一个问题，在本地连接服务器上传 可以正常使用，打包成App后 上传功能不能使用。 检查之后发现没有添加请求头。 header: { content-type : 'multipart/form-data' } 下面是实例代码： uni.uploadFile({ url: 'https://www.example.com/upload', //仅为示例，非真实的接口地址 filePath:.
H5 uni.uploadFile后台接收不到文件的解决方案
YWLONG的专栏
04-07 1475
去除header的Content-Type设置就可以了
uni app 开发小程序 项目无法运行问题
leesoo7的博客
08-17 2279
如果是 后者 记得检查 node.js版本和 node sass nodeloder 的对应版本 如果不匹配会无法运行 或者 有些页面无法显示。这两种开发项目目录是不一样的 不是对应的项目 直接是无法打开运行的。还有有些插件无法install 记得用淘宝镜像。web stom 和 vscode 目录。uni app 开发小程序 有两种方式。2,webstom,vscode开发。1,HBuilder X开发。HBuilder x 目录。...
uniapp的uni.request请求在浏览器（H5）可以发送请求，真机调试发送请求无效，后端接受不到参数，已解决！
weixin_46360938的博客
10-30 6406
uniapp的uni.request请求在浏览器（H5）可以发送请求，真机调试发送请求无效，后端接受不到参数，已解决！
uniapp调取接口的方法
热门推荐
Front小思的博客
08-22 2万+
面试官的问题：前后端分离，该如何调用接口？？? 思路：应该直接回答这个问题，通过向后端接口路径发送请求，建立http连接后，再由后端对我需要的数据或内容进行操作处理后返回给前端，这就是一个接口的调用。接下来你可以说一下接口，服务器与客户端的三次握手协议，以及请求的方式，比如如GET/POST，HTTP协议等内容。 现实前端开发中，我们需要调取后台接口进行动态数据渲染，我们必须先查阅后台接口文档，了解使用该接口时，确定第三方的接口的基本信息：地址、请求方式，参数、返回值等，需要提交哪些参数，并且接口使用返..
在uniapp中用vue3使用webSocket获取后台服务器数据并调用数据 用TS开发
03-31
1. 安装依赖 在uniapp项目根目录下，打开终端输入以下命令安装依赖： ``` npm install --save-dev typescript @vue/cli-plugin-typescript @vue/cli-plugin-babel @vue/cli-plugin-eslint @vue/eslint-config-typescript vue-loader@next @vue/compiler-sfc@next ``` 安装完成后，在项目根目录下会生成一个 `tsconfig.json` 文件和一个 `src` 目录，`src` 目录下会生成一个 `main.ts` 文件。 2. 配置vue3 在 `main.ts` 文件中，引入 `createApp` 和 `defineComponent` 函数，并使用 `defineComponent` 定义一个组件。 ```typescript import { createApp, defineComponent } from 'vue'; const app = createApp({}); const HelloWorld = defineComponent({ name: 'HelloWorld', props: { msg: String }, setup(props) { return { message: props.msg } }, template: `<div>{{ message }}</div>` }); app.component('HelloWorld', HelloWorld); app.mount('#app'); ``` 3. 配置WebSocket 在 `HelloWorld` 组件中，使用 `onMounted` 钩子函数在组件加载完成后创建 WebSocket 连接。在创建连接时，需要设置 `onopen`、`onmessage`、`onerror` 和 `onclose` 四个事件的回调函数。 ```typescript import { createApp, defineComponent, onMounted } from 'vue'; const app = createApp({}); const HelloWorld = defineComponent({ name: 'HelloWorld', props: { msg: String }, setup(props) { onMounted(() => { const ws = new WebSocket('ws://localhost:3000'); ws.onopen = () => { console.log('WebSocket connection established.'); }; ws.onmessage = (event) => { console.log('WebSocket message received:', event.data); }; ws.onerror = (event) => { console.error('WebSocket error:', event); }; ws.onclose = () => { console.log('WebSocket connection closed.'); }; }); return { message: props.msg } }, template: `<div>{{ message }}</div>` }); app.component('HelloWorld', HelloWorld); app.mount('#app'); ``` 4. 发送和接收数据 在 `HelloWorld` 组件中，可以通过 `ws.send()` 方法向服务器发送数据，并通过 `ws.onmessage` 事件接收服务器返回的数据。在接收到数据后，可以通过 `JSON.parse()` 方法将数据转换为对象，并调用其中的属性。 ```typescript import { createApp, defineComponent, onMounted } from 'vue'; const app = createApp({}); const HelloWorld = defineComponent({ name: 'HelloWorld', props: { msg: String }, setup(props) { onMounted(() => { const ws = new WebSocket('ws://localhost:3000'); ws.onopen = () => { console.log('WebSocket connection established.'); ws.send(JSON.stringify({ type: 'getData' })); }; ws.onmessage = (event) => { console.log('WebSocket message received:', event.data); const data = JSON.parse(event.data); console.log('Data:', data); }; ws.onerror = (event) => { console.error('WebSocket error:', event); }; ws.onclose = () => { console.log('WebSocket connection closed.'); }; }); return { message: props.msg } }, template: `<div>{{ message }}</div>` }); app.component('HelloWorld', HelloWorld); app.mount('#app'); ``` 这样，我们就可以在 uniapp 中使用 vue3 和 TypeScript 开发 WebSocket 应用了。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值