Flutter加载Html

news2025/2/4 4:03:30

Flutter_Fai_Webview 插件可实现的功能：

  • 同时适配于 Android Ios 两个平台
  • 通过 url 来加载渲染一个Html 页面
  • 加载 Html 文本数据 如 <html> .... </html>等
  • 加载 Html 标签数据 如 <p> ... </p>
  • 实现 WebView 加载完成后，自动测量 WebView 的高度，并回调 Flutter
  • 实现 WebView 加载完成监听
  • 实现 WebView 上下滑动、滑动到顶部兼听、滑动到底部兼听并回调 Flutter
  • 实现 兼听 WebView 输出日志并将日志回调 Flutter
  • 实现 为 Html 页面中所有的图片添加点击事件 并回调 Flutter
  • 实现Html与Flutter的JS双向互调
  • 实现打开相机相册的功能
  • 实现回退历史浏览记录的功能
  • 实现监听Html中图片的点击事件回调
  • 刷新Html页面的加载

Flutter中可用于来加载 Html 页面的插件 ,

  • flutter_WebView_plugin
  • webView_flutter
  • flutter_inappbrowser
  • html
  • flutter_html
  • flutter_html_view

这些多多少满足不了我项目中的需求，所以花了几天时间开发了 Flutter_Fai_Webview 插件，可实现 Android 中 WebView 或者 是 iOS 中的 UIWebView 中的功能，因为 Flutter_Fai_Webview 插件本质上是通过 PlatformView 功能将原生的 View 嵌套在 Flutter 中。

开发插件要具备的知识：

也就是说在这里将教会你 开发一个 Flutter 插件。

开始使用

1 基本使用说明

1.1 Flutter 项目中 pubspec.xml 文件中 配置插件

pub方式依赖：点击这里查看最新版本

dependencies:
  flutter_fai_webview: ^1.0.0

git方式依赖：

flutter_fai_webview:
    git:
      url: https://github.com/zhaolongs/Flutter_Fai_Webview.git
      ref: master
dependencies:
  flutter_fai_webview: ^0.0.2

1.2 在使用到 WebView 页面中

引入头文件

import 'package:flutter_fai_webview/flutter_fai_webview.dart';

1.3 通过url加载网页

如这里使用到的地址：

String htmlUrl = "https://blog.csdn.net/zl18603543572";

然后使用FaiWebViewWidget来加载显示这个h5链接，代码如下：

///通过url加载页面
  FaiWebViewWidget buildFaiWebViewWidget() {
    return FaiWebViewWidget(
      //webview 加载网页链接
      url: htmlUrl,
      //webview 加载信息回调
      callback: callBack,
      //输出日志
      isLog: true,
    );
  }

其中callBack是一个回调，如webview的加载完成、向上滑动、向下滑动等等，代码如下：

///加载 Html 的回调
  ///[code]消息类型标识
  ///[msg] 消息内容
  ///[content] 回传的参数
  void callBack(int code, String msg, content) {
    //加载页面完成后 对页面重新测量的回调
    //这里没有使用到
    //当FaiWebViewWidget 被嵌套在可滑动的 widget 中，必须设置 FaiWebViewWidget 的高度
    //设置 FaiWebViewWidget 的高度 可通过在 FaiWebViewWidget 嵌套一层 Container 或者 SizeBox
    if (code == 201) {
      //页面加载完成后 测量的 WebView 高度
      double webViewHeight = content;
      print("webViewHeight " + webViewHeight.toString());
    } else {
      //其他回调
    }
    setState(() {
      message = "回调：code[" + code.toString() + "]; msg[" + msg.toString() + "]";
    });
  }

1.4 关于回调中的code取值说明如下

  • 201 测量webview 成功
  • 202 JS调用
  • 203 图片点击回调
  • 301 滑动到顶部
  • 302 向下滑动
  • 303 向上滑动
  • 304 滑动到底部
  • 401 webview 开始加载
  • 402 webview 加载完成
  • 403 webview html中日志输出
  • 404 webview 加载出错
  • 501 webview 弹框回调
  • 1000 操作失败

加载Html的过程中会实时回调Flutter，详细说明如下：

/**
   * code 原生 Android iOS 回调 Flutter 的消息类型标识
   * message 消息类型日志
   * content 回调的基本数据
   */
  Function(int code, String message, dynamic content) callback;

详细说明

//当前点击的图片 URL
  String imageUrl = null;
  //是否显示浮动按钮
  bool isShowFloat = false;
  /**
   * code 当前点击图片的 位置
   * url 当前点击图片对应的 链接
   * images 当前 Html 页面中所有的图片集合
   */
  void imageCallBack(int code, String url, List<String> images) {
    imageUrl = url;
    setState(() {});
  }

  void callBack(int code, String msg, content) {
    String call = "回调 code:" +
        code.toString() +
        " msg:" +
        msg.toString() +
        " content:" +
        content.toString();
    if (code == 201) {
      //加载页面完成后 对页面重新测量的回调
      //这里没有使用到
      //当FaiWebViewWidget 被嵌套在可滑动的 widget 中，必须设置 FaiWebViewWidget 的高度
      //设置 FaiWebViewWidget 的高度 可通过在 FaiWebViewWidget 嵌套一层 Container 或者 SizeBox
      webViewHeight = content;
    } else if (code == 202) {
      // Html 页面中 Js 的回调
      // Html 页面中的开发需要使用 Js 调用  【 Android 中 使用 controll.otherJsMethodCall( json )】 【iOS中 直接调用 otherJsMethodCall( json ) 】
      // 在 Flutter 中解析 json 然后加载不同的功能
      String jsJson = content;
    } else if (code == 203) {
      // 为 Html 页面中的图片添加 点击事件后，点击图片会回调此方法
      // content 为当前点击图片的 地址
      // 实现更多功能 比如 一个 Html 页面中 有5张图片，点击放大查看并可右右滑动
      // 这个功能可以在 imageCallBack 回调中处理

    } else if (code == 301) {
      //当 WebView 滑动到顶部的回调
    } else if (code == 302) {
      //当 WebView 开始向下滑动时的回调
      //隐藏按钮
      isShowFloat = true;
    } else if (code == 303) {
      //当 WebView 开始向上滑动时的回调
      //显示按钮
      isShowFloat = false;
    } else if (code == 304) {
      //当 WebView 滑动到底部的回调
    } else if (code == 401) {
      //当 WebView 开始加载的回调
    } else if (code == 402) {
      //当 WebView 加载完成的回调
    } else if (code == 403) {
      // WebView 中 Html中日志输出回调
    } else if (code == 401) {
      // WebView 加载 Html 页面出错的回调
    } else if (code == 501) {
      // 当 Html 页面中有 Alert 弹框弹出时 回调消息

    } else if (code == 1000) {
      // 操作失败 例如 空指针异常 等等
    } else {
      //其他回调
    }
    setState(() {
      message = call;
    });
  }

2 Flutter 加载页面

2.1 通过 url 加载 Html 页面

在上述1.3 通过url加载网页已进行过描述

2.2 通过 Html Data 加载 String类型的Html 页面

加载String类型的Html页面，一般先是将String类型的Html代码加载到内容中，如通过网络请求接口获取的，或者是在页面中定义好的代码如下:

String htmlBlockData =
  "<!DOCTYPE html>
<html> <head><meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\">  
<meta name=\"viewport\" content=\"width=device-width,initial-scale=1,maximum-scale=1\"> </head> <body><p>加载中</p></body></html>";

或者是放在assets目录的静态Html，那么就需要先读取静态资源目录下的Html文件 ，代码如下：

///读取静态Html
  Future<String> loadingLocalAsset() async {
    ///加载
    String htmlData = await rootBundle.loadString('assets/html/test.html');
    print("加载数据完成 $htmlData");
    return htmlData;
  }

当然你需要配制好目录依赖，如我这里的example中的html文件配置代码如下：

assets:
    - assets/html/

然后就是使用FaiWebViewWidget来渲染Html页面了，如果是直接显示已加载好的String类型的Html，那么直接配置FaiWebViewWidget中的htmlBlockData就可以，如果是使用异步加载assets目录下的静态Html，那么可以结合FutureBuilder组件来实现加载，代码如下：

///异步加载静态资源目录下的Html
  FutureBuilder<String> buildFutureBuilder() {
    return FutureBuilder<String>(
      ///异步加载数据
      future: loadingLocalAsset(),
      ///构建
      builder: (BuildContext context, var snap) {
        ///加载完成的html数据
        String htmlData = snap.data;
        //使用插件 FaiWebViewWidget
        if (htmlData == null) {
          return CircularProgressIndicator();
        }
        ///通过配置 htmlBlockData 来渲染
        return FaiWebViewWidget(
          //webview 加载本地html数据
          htmlBlockData: htmlData,
          //webview 加载信息回调
          callback: callBack,
          //输出日志
          isLog: true,
        );
      },
    );
  }

2.3 加载混合页面

也就是说 一个页面中，一部分是 Flutter Widget 一部分是 webview 加载。

动图封面

import 'package:flutter/material.dart';
import 'dart:async';
import 'package:flutter_fai_webview/flutter_fai_webview.dart';

/**
 *   混合页面加载
 *
 */
class DefaultHexRefreshPage extends StatefulWidget {
  @override
  MaxUrlHexRefreshState createState() => MaxUrlHexRefreshState();
}

class MaxUrlHexRefreshState extends State<DefaultHexRefreshPage> {
  FaiWebViewWidget webViewWidget;

  //原生 发送给 Flutter 的消息
  String message = "--";
  String htmlUrl = "https://blog.csdn.net/zl18603543572";
  double webViewHeight = 1;

  @override
  void initState() {
    super.initState();

    //使用插件 FaiWebViewWidget
    webViewWidget = FaiWebViewWidget(
      //webview 加载网页链接
      url: htmlUrl,
      //webview 加载信息回调
      callback: callBack,
      //输出日志
      isLog: true,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          onPressed: () {
            Navigator.pop(context);
          },
          icon: Icon(Icons.arrow_back_ios),
        ),
        title: Container(
          padding: EdgeInsets.only(left: 10, right: 10),
          height: 28,
          alignment: Alignment(0, 0),
          color: Color.fromARGB(90, 0, 0, 0),
          child: Text(
            message,
            style: TextStyle(color: Colors.white, fontSize: 12),
          ),
        ),
      ),
      body: buildRefreshHexWidget(),
    );
  }

  /**
   * 需要注意的是 
   * RefreshIndicator 会覆盖 WebView 的滑动事件
   * 所有关于 监听 WebView 的滑动监听将会失效
   */
  Widget buildRefreshHexWidget() {

    return RefreshIndicator(
      //下拉刷新触发方法
      onRefresh: _onRefresh,
      //设置webViewWidget
      child: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            Container(
              color: Colors.grey,
              height: 220.0,
              child: Column(mainAxisSize: MainAxisSize.min,children: <Widget>[
                  Center(child: Text("这里是 Flutter widget  "),)
              ],),
            ),
            Align(
              alignment: Alignment(0, 0),
              child: Text("以下是 Html 页面 "),
            ),
            Container(
              color: Colors.redAccent,
              height: 1.0,
            ),
            Container(
              height: webViewHeight,
              child: webViewWidget,
            )
          ],
        ),
      ),
    );
  }

  Future<Null> _onRefresh() async {
    return await Future.delayed(Duration(seconds: 1), () {
      print('refresh');
      webViewWidget.refresh();
    });
  }

  callBack(int code, String msg, content) {
    //加载页面完成后 对页面重新测量的回调
    if (code == 201) {
      //更新高度
      webViewHeight = content;
      print("webViewHeight " + content.toString());
    } else {
      //其他回调
    }
    setState(() {
      message = "回调：code[" + code.toString() + "]; msg[" + msg.toString() + "]";
    });
  }
}

3 Flutter与Html中JS的双向互调

在这里使用到的Html页面代码如下：

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
</head>
<body><p><br/></p>
<p>测试一下 &nbsp;</p>
<p><img src="https://images.gitee.com/uploads/images/2020/0602/203000_9fa3ddaa_568055.png"
        title="" alt=""/></p>
<p><img src="https://images.gitee.com/uploads/images/2020/0602/203000_9fa3ddaa_568055.png"
        title="" alt=""/></p>
<p id="flutter"><br/></p>

<button type="button" onclick="toFlutter()">调用 Flutter中的内容</button>
<p><br/></p>
<p><br/></p>

<script>

  //Flutter调用的 JS方法
  //这里传回的参数是 JSON 格式
  //获取具体的参数内容 可以将 JSON文本转 对象或者是数组
  function testAlert2(value) {

    console.log(' 这里是JS 的方法 传的参数是  ' + value);
    ///交Json文本转对象
    var obj = JSON.parse(value);
    console.log(' 解析字符串的数据  ' + obj.test);
    ///在HTML中p标签中输入传过来的cdvo
    document.getElementById('flutter').innerHTML = obj.test;
  }


  //JS调用Flutter中的方法
  function toFlutter() {

    ///向Flutter传递的参数
    var obj = Object();
    obj.name = '张三';
    obj.age = 10;
    var json = JSON.stringify(obj);

    ///根据不同的手机加载不同的方法
    var sys = checkSystem();
    if (sys === 'ios') {
      controll.otherJsMethodCall(json);
    } else {
      otherJsMethodCall(json);
    }
  }

  //判断是安卓还是IOS
  function checkSystem() {
    var u = window.navigator.userAgent, app = window.navigator.appVersion;
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g
    var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
    if (isAndroid) {
      return 'android';
    }
    if (isIOS) {
      return 'ios';
    }
  }


</script>

</body>
</html>

3.1 Flutter中调用JS中的方法

Flutter中调用JS方法，需要使用到FaiWebViewController，代码如下：

///webView控制器
  FaiWebViewController faiWebViewController = new FaiWebViewController();
  ///构建webview组件
  FaiWebViewWidget buildFaiWebViewWidget(String htmlData) {
    return FaiWebViewWidget(
      controller: faiWebViewController,
      //webview 加载本地html数据
      htmlBlockData: htmlData,
      //webview 加载信息回调
      callback: callBack,
      //输出日志
      isLog: true,
    );
  }

然后在点击按钮的时候调用HTML中JS的方法，代码如下：

RaisedButton(
    child: Text("Flutter调用JS方法"),
    onPressed: () {
      ///向JS方法中传的参数
      Map<String, dynamic> map = new Map();
      map["test"] = "这是Flutter中传的参数";

      ///参数一为调用JS的方法名称
      ///参数二为向JS中传递的参数
      faiWebViewController.toJsFunction(
          jsMethodName: "testAlert2", parameterMap: map);
    },
  )

这里使用到的testAlert2就是JS中声明的方法

3.2 JS中调用Flutter的方法

在上述描述到的Html文件中，声明了一个按钮，然后在点击按钮时调用 toFlutter方法，然后在Flutter中对应的FaiWebViewWidget设置的callback监听中会收到这个回调，处理代码如下：

///FaiWebViewWidget 的回调处理
  callBack(int code, String msg, content) {

    if (code == 202) {
      /// json.encode(mapData); //Map转化JSON字符串
      /// json.decode(strData); //JSON 字符串转化为Map类型
      Map<String, dynamic> map = json.decode(content);

      String name = map["name"];
      int age = map["age"];
      print('这里是Js调用到Flutter中的数据 name $name  age $age');
    } else {
      //其他回调
    }
    setState(() {
      message = "回调：code[" + code.toString() + "]; msg[" + msg.toString() + "]";
    });
  }

然后在这里接收到JS中的调用以及参数后，就可以在Flutter中做任何想要的操作

在正个过程中参数数据是通过json格式的数据来传递的，在实际项目开发中需要保持json的一至

4 Flutter操作Html的其他方法简述

4.1 刷新页面加载

通过 FaiWebViewController的 refresh方法就可实现，代码如下：

faiWebViewController.refresh();

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/761995.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

【报错】Failed to determine a suitable driver class

【报错】Failed to determine a suitable driver class

文章目录 是否需要mybatis依赖&#xff1a;不需要排除resources未编译 报错信息 *************************** APPLICATION FAILED TO START ***************************Description:Failed to configure a DataSource: url attribute is not specified and no embedded datas…
阅读更多...
Python实现HBA混合蝙蝠智能算法优化循环神经网络回归模型(LSTM回归算法)项目实战

Python实现HBA混合蝙蝠智能算法优化循环神经网络回归模型(LSTM回归算法)项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档视频讲解&#xff09;&#xff0c;如需数据代码文档视频讲解可以直接到文章最后获取。 1.项目背景 蝙蝠算法是2010年杨教授基于群体智能提出的启发式搜索算法&#xff0c;是一种搜索全局最优解的有效方法…
阅读更多...
【2023江西省研究生数学建模竞赛】第三题 植物的多样性 48页论文及Python代码

【2023江西省研究生数学建模竞赛】第三题 植物的多样性 48页论文及Python代码

【2023江西省研究生数学建模竞赛】第三题 植物的多样性 48页论文及Python代码 相关链接 【江西省研究生数学建模竞赛】第一题 蒸汽发生器倒U型管内液体流动 70页论文及MATLAB代码 【江西省研究生数学建模竞赛】第一题 蒸汽发生器倒U型管内液体流动 70页论文及MATLAB代码 【2…
阅读更多...
IntelliJ IDEA 2023.2 新版本即将发布，拥抱 AI

IntelliJ IDEA 2023.2 新版本即将发布，拥抱 AI

IntelliJ IDEA 近期连续发布多个EAP版本&#xff0c;官方在对用户体验不断优化的同时&#xff0c;也新增了一些不错的功能&#xff0c;尤其是人工智能助手补充&#xff0c;AI Assistant&#xff0c;相信在后续IDEA使用中&#xff0c;会对开发者工作效率带来不错的提升。 以下是…
阅读更多...
亚信科技 AntDB 数据库与星辰天合全产品体系完成兼容互认

亚信科技 AntDB 数据库与星辰天合全产品体系完成兼容互认

近日&#xff0c;亚信科技 AntDB 数据库与星辰天合全产品体系完成兼容互认。经过双方团队的严格测试&#xff0c;AntDB 数据库与天合翔宇分布式存储系统、统一数据平台 XEDP、超融合平台 XHERE 等产品完全兼容&#xff0c;整体运行稳定高效。 双方产品的兼容互认完成&#xff…
阅读更多...
基于Java+SpringBoot+vue的早餐店点餐系统设计与实现

基于Java+SpringBoot+vue的早餐店点餐系统设计与实现

博主介绍&#xff1a;✌擅长Java、微信小程序、Python、Android等&#xff0c;专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; 精彩专栏推荐订阅&#x1f447;&#x1f3fb; 不然下次找不到哟 Java项目精品实战案…
阅读更多...
代理辅助多任务优化算法（Matlab代码实现）

代理辅助多任务优化算法（Matlab代码实现）

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…
阅读更多...
SpringBoot集成海康网络设备SDK

SpringBoot集成海康网络设备SDK

目录 SDK介绍 概述功能下载对接指南集成 初始化项目初始化SDK 初始化SDK概述新建AppRunner新建SdkInitService新建InitSdkTask新建 HCNetSDK调用业务接口部署 拷贝so库文件到部署目录追加环境变量追加so库加载路径验证SDK初始化是否成功代码 SDK介绍 概述 设备网络SDK是基于…
阅读更多...
企业数据怎样管理才能蜕变为可变现的资产？

企业数据怎样管理才能蜕变为可变现的资产？

企业竞争的本质&#xff0c;是在不确定市场环境下资源配置效率的竞争。 如何快速感知市场变化、识别客户需求、增强决策准确性&#xff0c;是企业资源配置的核心关注点和竞争点。 数据作为企业资源的具体表现形式和载体&#xff0c;已经渗透到企业设计、生产、管理、服务和运…
阅读更多...
Qt开发5--Qt5中菜单和工具栏

Qt开发5--Qt5中菜单和工具栏

在这部分Qt5 C编程教程中&#xff0c;讨论Qt5应用程序中菜单和工具栏。 一个菜单栏是一个GUI程序的常见部分。它是位于称为菜单的各种位置中的命令组。工具栏提供了对最常用命令的快速访问。 1) Qt5简单菜单 第一个例子展示显示一个简单菜单。以下是源代码&#xff0c;我们有…
阅读更多...
【算法 -- LeetCode】（021） 合并两个有序链表

【算法 -- LeetCode】（021） 合并两个有序链表

1、题目 将两个升序链表合并为一个新的 升序 链表并返回。新链表是通过拼接给定的两个链表的所有节点组成的。 示例 1&#xff1a; 输入&#xff1a;l1 [1,2,4], l2 [1,3,4] 输出&#xff1a;[1,1,2,3,4,4] 示例 2&#xff1a; 输入&#xff1a;l1 [], l2 [] 输出&#…
阅读更多...
【并发编程】深入理解并发工具类CountDownLatch

【并发编程】深入理解并发工具类CountDownLatch

文章目录 前言一、初识 CountDownLatch二、CountDownLatch 的核心方法三、CountDownLatch 的应用场景应用场景一&#xff1a;等待多个线程任务执行完成应用场景二&#xff1a;等待外部资源初始化应用场景三&#xff1a;控制线程执行顺序 四、CountDownLatch 的源码分析核心方法…
阅读更多...
mysql表主键自增过大问题

mysql表主键自增过大问题

问题及项目环境 问题 最近在做项目时&#xff0c;发现我创建的每一个表的主键设置自增&#xff0c;在插入数据数据时会出现自增值过大的问题。 问题展示: 在后端执行Basemapper中的insert()方法时&#xff0c;数据库中的主键id字段为下: 且我在对应的实体类的设置为下: 我们…
阅读更多...
mysql四种隔离级别以及原理

mysql四种隔离级别以及原理

事务4大特性&#xff1a; 原子性&#xff1a; undolog日志来保证&#xff0c; 记录了要回滚的日志信息&#xff0c; 事务回滚时撤销已经执行的sql. 一致性&#xff1a;由其它3大特性来保证。 隔离性: MVCC来保证&#xff0c; 多版本并发控制。 持久性&#xff1a;由redolog来保…
阅读更多...
flask路由、模板、请求与响应、闪现以及请求扩展

flask路由、模板、请求与响应、闪现以及请求扩展

一、函数加装饰器的执行顺序 flask的路由基于装饰器---->在视图函数上再加装饰器---->加多个装饰器的执行顺序---->登录认证装饰器---->加载router下，先做路由匹配，匹配成功执行被auth包裹的视图函数 二、路由系统 flask的路由是基于装饰器的---->但是它的…
阅读更多...
APB/AHB/AXI总线介绍和理解

APB/AHB/AXI总线介绍和理解

APB/AHB/AXI总线介绍&#xff1a; APB/AHB/AXI均属于AMBA (Advanced Microcontroller Bus Architecture)&#xff0c;常用于SoC设计中&#xff0c;全称叫作高级微控制器总线架构&#xff0c;它是由ARM公司研发推出的高性能片上总线协议。 AMBA 1.0还包含ASB和APB&#xff08;A…
阅读更多...
MP4格式视频怎么转mov格式？好用的视频格式转换方法分享

MP4格式视频怎么转mov格式？好用的视频格式转换方法分享

MOV格式是苹果公司的专有格式&#xff0c;因此在苹果设备上播放MOV格式的视频时&#xff0c;兼容性更好&#xff0c;因此可以实现更高质量的视频。如果我们需要高质量的视频输出&#xff0c;将MP4转换为MOV格式可能是个好选择。那么怎么进行转换呢&#xff1f;给大家分享几种简…
阅读更多...
Linux环境下，Nginx+Naocs远程访问碰到的若干问题

Linux环境下，Nginx+Naocs远程访问碰到的若干问题

一、配置背景 该项目来源于尚硅谷SpringCloud进阶课程&#xff0c;在linux环境下配置一个注册中心组。 二、碰到的问题 问题主要是远程访问Nginx显示无法连接的问题&#xff0c;接下来是排查方案&#xff1a; 1. 防火墙问题 这里需要确保双方电脑能ping通之后确保端口也能…
阅读更多...
k210获取机器码

k210获取机器码

准备工作&#xff1a; kflash_gui&#xff08;下载固件到开发板&#xff09; key_gen_v1.2&#xff08;需要将其下载至开发板&#xff09; 1.kflash_gui 下载地址&#xff1a;Releases sipeed/kflash_gui GitHub 2. key_gen_v1.2下载地址&#xff1a;下载站 - Sipeed 3.…
阅读更多...
Java经典面试解析：服务器卡顿、CPU飙升、接口负载剧增

Java经典面试解析：服务器卡顿、CPU飙升、接口负载剧增

01 线上服务器CPU飙升&#xff0c;如何定位到Java代码 解决这个问题的关键是要找到Java代码的位置。下面分享一下排查思路&#xff0c;以CentOS为例&#xff0c;总结为4步。 第1步&#xff0c;使用top命令找到占用CPU高的进程。 第2步&#xff0c;使用ps –mp命令找到进程下…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023