目标:把flutter web项目部署到自己的服务器上,可以使用自己的服务器IP访问

前提:服务器已经安装了nginx,

这是我的flutter配置

edz@lwqdeMacBook-Pro ~ % flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.0.1, on Mac OS X 10.15.6 19G2021 darwin-x64,
locale zh-Hans-CN)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
[✓] Xcode - develop for iOS and macOS
[✓] Chrome - develop for the web
[✓] Android Studio (version 3.5)
[✓] VS Code (version 1.54.1)
[✓] Connected device (1 available)

1.创建flutter web 和打包

$cd myfile      //到项目目录下
$flutter create myflutterwebappname //创建flutter web项目
$flutter run -d chrome // 运行项目到浏览器
$flutter web build // 打包
打包后,项目中xxx/build/web 文件中会有些文件,说明已经成功打包了,

2.上传打包文件到服务器,工具(Royal TSX: oopg)

1.打开工具,创建一个document,并再里面创建创建一个Terminal和File transfer(注意:创建时使用SFTP,端口默认22,)
2.使用自己的服务器ip和连接密码,在Terminal中连接服务器,启动nginx
3.File transfer 中把打包好的web目录下的文件上传到服务器的一个文件夹中,记下其中一个index.html路径,修改nginx的配置文件时要用

3.修改nginx的配置文件,

1.找到/etc/nginx/nginx.conf文件,把root 的路径改成 上面记下的index.html路径,
2.Terminal 中
$nginx -t //检查配置文件,(也可以用此方法找到nginx的配置文件路径)
$nginx -s reload //刷新nginx,就可以使用服务器ip访问了

我的nginx配置文件:

user  nginx;
worker_processes 1; error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid; events {
worker_connections 1024;
} http {
include /etc/nginx/mime.types;
default_type application/octet-stream; log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"'; access_log /var/log/nginx/access.log main; sendfile on;
#tcp_nopush on; keepalive_timeout 65; #gzip on; include /etc/nginx/conf.d/*.conf; server {
listen 80 default_server;
server_name _; #root /lwq/ios/down;
root /lwq/flutterweb/testflutterweb; location / {
index index.html;
}
} }

Royal TSX界面:

FlutterWeb部署到服务器的更多相关文章

  1. Linux下部署FTP服务器

    Linux下部署FTP服务器 下载安装包 在这里介绍的是离线部署FTP,首先下载对应的rpm包,下载链接为: 下载vsftpd服务 下载FTP客户端 安装ftp服务器 关闭防火墙 service ip ...

  2. 部署openssh服务器

    1.安装服务器端软件包 先查看是否已经安装openSSH服务器软件包 # rpm -qa|grep openssh openssh-askpass-.3p1-.el6_6..x86_64 openss ...

  3. 将war包部署到服务器的详细步骤

    第一步: 先将项目打包成war文件,也就是将在项目上单击鼠标右键,选择Export: 选择WAR file,点击下一步: 会出现如下所示,选择你要保存的位置,点击完成: 在你所选择的地方会有个如下所示 ...

  4. 部署git服务器 gitServer 软件

    部署git服务器 gitServer 软件 搭建git服务器也并不是非常的难,有这么多优秀的软件,选择一个适合自己就行了 1. windows版本 http://gitstack.com/ 免费版本, ...

  5. Centos环境下部署游戏服务器-常用命令

         图1     在Linux的世界,如果你不玩命令,那你见了同行都不好意思和人家打招呼.同时服务器正常状况下放在远端,一般都是开ssh登录服务器,相信远程桌面的人很少见吧.这篇文章说说Linu ...

  6. Centos环境下部署游戏服务器-权限

    部署Web服务器的时候,在"DocumentRoot"指向的根目录新建一个文件夹,然后将网页和资源放在这个文件夹里,通过地址http://192.168.0.100/Res/ind ...

  7. debian7下部署nginx服务器

    笔者是在vmware中的Debian7下部署nginx服务器,采用离线部署方式.过程如下: 1.准备好需要的离线安装包 nginx-1.6.2.tar.gz,pcre-8.34.tar.gz,open ...

  8. Asp.Net 之 WebService部署到服务器后出现" The test form is only available for requests from the local machine "

    最近由于任务需要开发了一个WebService, 部署到服务器以后,出现上述问题,网上查找到如下解决方案: 问题原因: 从 NET Framework 1.1 起定义了一个名为 HttpPostLoc ...

  9. 单点登录CAS使用记(二):部署CAS服务器以及客户端

    CAS-Server下载地址:https://www.apereo.org/projects/cas/download-cas CAS-Client下载地址:http://developer.jasi ...

  10. 将网站部署到服务器上出现_STORAGE_WRITE_ERROR_问题

    用的thinkphp3.2的框架,在本地运行没有问题,部署到服务器上(基于centos的LAMP环境)即报错,报错信息如下(完全看不懂...):求大神帮帮忙~~~~(>_<)~~~~ :( ...

随机推荐

  1. 解决IDEA创建项目时无法引入依赖问题:Cannot resolve **.**.**(已解决)

    今天在创建SpringBoot整合MyBatis项目时出现报错: Cannot resolve org.springframework:spring-tx:5.3.26 Cannot resolve ...

  2. Java中方法的定义和使用

    方法的定义和使用 注意事项: 1.方法与方法之间是 平级关系 不可以嵌套定义 2.方法的位置 可以在类{}中任意位置 3.方法定义之后 之后被调用 才能被执行 4.return 关键字的作用  返回关 ...

  3. Azure DevOps(一)基于 Net6.0 的 WPF 程序如何进行持续集成、持续编译

    一,引言 我们是否正在为如何快速的编译.部署客户端应用程序而烦恼?这也是博主最近遇到的问题.目前博主所在公司主要做项目级的定制化开发,多以 C/S 架构的 WPF 程序为主,每次到了协助开发团队给实施 ...

  4. 基于django+ansible+webssh运维自动化管理系统

    基于django+ansible+webssh运维自动化管理系统   前言 最初开发这个基于Django ansible运维自动化管理系统的想法其实从大学时候就已经有了,但是苦于技术原因和没有线上环境 ...

  5. vue中获取所有路由

    在router实例上有options属性:

  6. vue路由的两种方式(路由传参)

    query和params区别 query类似 get, 跳转之后页面 url后面会拼接参数,类似?id=1, 非重要性的可以这样传, 密码之类还是用params刷新页面id还在 params类似 po ...

  7. PM系统成本科目挂接教程-如何查手册和看帮助文档

    如果这么简单的问题都无法入门只能说回炉重造吧孩子. ---by SheZQ 正文 成本科目挂接作为PM系统最基本的取数依据,数据汇总的根本,是必须要会的技能.如果没有挂接,就会出现空值或者0值. 摘自 ...

  8. 2022-07-05:给定一个数组,想随时查询任何范围上的最大值。 如果只是根据初始数组建立、并且以后没有修改, 那么RMQ方法比线段树方法好实现,时间复杂度O(N*logN),额外空间复杂度O(N*

    2022-07-05:给定一个数组,想随时查询任何范围上的最大值. 如果只是根据初始数组建立.并且以后没有修改, 那么RMQ方法比线段树方法好实现,时间复杂度O(NlogN),额外空间复杂度O(Nlo ...

  9. 2021-08-17:谷歌面试题扩展版,面值为1~N的牌组成一组,每次你从组里等概率的抽出1~N中的一张,下次抽会换一个新的组,有无限组,当累加和<a时,你将一直抽牌,当累加和>=a且<b时,你将获胜

    2021-08-17:谷歌面试题扩展版,面值为1N的牌组成一组,每次你从组里等概率的抽出1N中的一张,下次抽会换一个新的组,有无限组,当累加和<a时,你将一直抽牌,当累加和>=a且< ...

  10. vue全家桶进阶之路20:ECMAScript脚本语言规范

    ECMAScript(简称 ES)是一种由 Ecma 国际组织定义的脚本语言标准,它定义了 JavaScript 语言的基本规范和特性.JavaScript 是一种基于 ECMAScript 标准的编 ...