近使用react做了一个音乐播放器小项目,在线下开发完成后,测试一切都没有问题,于是打算打包上线。首先注册了一个新浪云账号,然后创建了一个SAE应用实例,再然后就照着新浪云给出的远程仓库进行push。最终在这里整整花了一天的时间,经过老师的指导,最终成功上线,好了,接下来便说说我在push代码过程中遇到的问题吧!

首先:

前端环境:react react-router-dom redux react-redux  axios

后台环境:nodejs

因为数据是通过反向代理得到的,所以搭建后台只是为了代理数据,并且这也是我在后面遇到的问题之一。

然后,git上传代码的时候遇到如下问题:

1、因为使用git不熟练,所以在拉取远程仓库的时候用户名写错了,然后后面就一直报错

报错代码:

fatal: Authentication failed for 'https://git.sinacloud.com/mymusic/'

解决方法:

方法一:

git config --global user.name "xxx"

git config --global user.email "xxx"

方法二:

git remote -v

git remote remove origin

git remote add origin xxx

上面的这两个方法如果解决不了问题,再尝试一下下面这个方法,一般情况下下面这个方法可以解决这类问题,具体如下所示:

git config --system --unset credential.helper

执行这个命令之后,你可以重新写入账号密码,这样就可以重新提交代码了。

解决方法来源于:https://cloud.tencent.com/developer/news/234398(感谢提供)

2、git在commit时找不到用户信息

报错代码:

** Please tell me who you are.

Run

git config --global user.email "you@example.com"
  git config --global user.name "Your Name"

to set your account's default identity.
Omit --global to set the identity only in this repository.

fatal: unable to auto-detect email address (got 'tim@newton.(none)')

解决办法:

直接在命令窗口运行

git config --global user.email "you@example.com"
git config --global user.name "Your Name"

这两句代码,把后面的名字改成你自己的就可以了,当然也可以不用改。

3、最终push的时候报了一个错,然后我就弄了一天!

[remote rejected] master -> master (pre-receive hook declined)

我这里报错的的原因就是我在上面说的,因为后台没有搭建,因为我刚开始是通过反向代理代理的别人的数据,但是在传到新浪云应用去的时候需要与服务端一起传递才可以但是我并没有搭建服务端,然后我用express -e 快速搭建了一个以express为框架的服务端。最后成功的把文件传上了远程仓库,但是,后面又遇到了问题。

解决办法:搭建一个后台

4、由于前端代码中使用了反向代理,在线下开发中测试没有任何问题,但是线上却代理不到数据。

解决办法:

在服务器端进行反向代理。代码如下:

"connect-history-api-fallback": "^1.5.0",
"http-proxy-middleware": "^0.19.1",

  这是服务器端package.json的代码,因为需要通过npm下载这两个中间件

connect-history-api-fallback:重定向
http-proxy-middleware:反向代理

两个中间件下载好后,就在app.js中进行配置,代码如下:
var history = require('connect-history-api-fallback');
var proxy = require('http-proxy-middleware');var app = express();app.use(history({index: '/'
}));
app.use('/music/api/*', proxy({target: 'https://api.mlwei.com/', changeOrigin: true}));

并将前端的反向代理改为如下:

axios.get('/music/api/?key=523077333&id=3641614987&type=11&cache=1&size=hq').then((res)=>{if(res.data.Code==='OK'){setSessionStorage('songList',JSON.stringify(res.data.Body));this.setState({list:res.data.Body,isLoading:true});}})    

然后就ok啦,项目就能在网上奔腾啦!!!献上项目展示:list/pic/lyric页:

(项目路径:http://mymusic.applinzi.com)

链接:https://pan.baidu.com/s/1aMcwQYZqRbGqZtfj8d10Vg 
提取码:nkia

最后,感谢老师和同学们的帮助!!!!

转载于:https://www.cnblogs.com/xiaojianwei/p/10071087.html

关于react上线系列问题及解决方案相关推荐

  1. 建站四部曲之前端显示篇(React+上线)

    本系列分为四篇: 建站四部曲之后端接口篇(SpringBoot+上线) 建站四部曲之Python数据爬虫篇(selenium) 建站四部曲之前端显示篇(React+上线) 建站四部曲之移动端篇(And ...

  2. 【REACT NATIVE 系列教程之十三】利用LISTVIEW与TEXTINPUT制作聊天/对话框获取组件实例常用的两种方式...

    本站文章均为 李华明Himi 原创,转载务必在明显处注明:  转载自[黑米GameDev街区] 原文链接: http://www.himigame.com/react-native/2346.html ...

  3. [React 基础系列] 受控表单 vs 不受控表单

    [React 基础系列] 受控表单 vs 不受控表单 受控表单 refs 不受控表单 不受控组件 总结 之前的学习部分带了一些表单内容的使用--之前的案例基本上是用的都是 input,接下来就学习一下 ...

  4. 基于阿里云服务器环境搭建到项目上线系列文章之三——安装git

    基于阿里云服务器环境搭建到项目上线系列 前言:最近购买了域名和一台阿里云服务器准备做点东西放上去,所以准备把环境搭建到项目上线的过程记录下来,计划一个系列6篇文章 基于阿里云服务器环境搭建到项目上线系 ...

  5. 基于阿里云服务器环境搭建到项目上线系列文章之一——putty使用秘钥登录远程服务器

    基于阿里云服务器环境搭建到项目上线系列 前言:最近购买了域名和一台阿里云服务器准备做点东西放上去,所以准备把环境搭建到项目上线的过程记录下来,计划一个系列6篇文章 基于阿里云服务器环境搭建到项目上线系 ...

  6. React 深入系列3:Props 和 State

    文:徐超,<React进阶之路>作者 授权发布,转载请注明作者及出处 React 深入系列3:Props 和 State React 深入系列,深入讲解了React中的重点概念.特性和模式 ...

  7. C#进阶系列——WebApi 异常处理解决方案

    原文:C#进阶系列--WebApi 异常处理解决方案 前言:上篇C#进阶系列--WebApi接口传参不再困惑:传参详解介绍了WebApi参数的传递,这篇来看看WebApi里面异常的处理.关于异常处理, ...

  8. 【REACT NATIVE 系列教程之十二】REACT NATIVE(JS/ES)与IOS(OBJECT-C)交互通信

    一用到跨平台的引擎必然要有引擎与各平台原生进行交互通信的需要.那么Himi先讲解React Native与iOS之间的通信交互. 本篇主要分为两部分讲解:(关于其中讲解的OC语法等不介绍,不懂的请自行 ...

  9. React 深入系列4:组件的生命周期

    文:徐超,<React进阶之路>作者 授权发布,转载请注明作者及出处 React 深入系列4:组件的生命周期 React 深入系列,深入讲解了React中的重点概念.特性和模式等,旨在帮助 ...

  10. React+Redux系列教程

    2019独角兽企业重金招聘Python工程师标准>>> 参考项目:https://github.com/lewis617/react-redux-tutorial 参考项目下载地址: ...

最新文章

  1. BCP utility in Sybase(Unix Environment)
  2. Eclipse配置开发Go的插件——Goclipse
  3. dedecms如何调用当前栏目的子栏目及子栏目文章
  4. 20145219 《信息安全系统设计基础》第01周学习总结
  5. 详解EBS接口开发之采购申请导入
  6. zookeeper 虚拟机搭建好后 外部链接不上_Ubuntu Server搭建Hyperledger Fabric 2.1学习环境...
  7. appcan双击返回退出系统
  8. bzoj3207花神的嘲讽计划Ⅰ
  9. SSH进阶(2)——用Struts拦截器实现登陆限制
  10. 【PADS】用PADS画PCB
  11. HTML网页设计:二、网页的基本标签
  12. WebService系列之HttpClient调用WebService接口
  13. [Vuetify] Multiple instances of Vue detected
  14. 819A - 如何成为一名职业程序员
  15. 实战——幂等性+海量数据处理
  16. 简单介绍快速开始使用Unity引擎的步骤
  17. 北大计算机论文答辩,自考同路人:在北大参加论文答辩的全过程
  18. 中间件-ES-中文拼音多音字插件
  19. 个人文件转移工具 v1.9.0.2107 系统目录迁移工具
  20. 树莓派4b连接单端口无线校园网及基本配置

热门文章

  1. docker api java_docker-java Docker的java API
  2. 3.MongoDB uri中包含特殊字符与读策略配置
  3. 7 centos 查看程序文件数量_MongoDB最大连接数(centos7应用程序最大打开文件数)设置失效的异常分析过程与解决方法...
  4. 领域搜索算法java_多起点的局部搜索算法(multi-start local search)解决TSP问题(附Java代码及注释)...
  5. python安装软件win10_在win10上安装Python和Tensorflow
  6. nacos-demo feign调用
  7. 【渝粤教育】国家开放大学2018年春季 7138-22T人际交流与沟通 参考试题
  8. [渝粤教育] 中国地质大学 思想道德修养与法律基础 复习题
  9. rand()与srand()函数用法详解
  10. python中str与bytes