博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
开发中那些难题以及那些哭笑不得的解决过程
阅读量:5938 次
发布时间:2019-06-19

本文共 2210 字,大约阅读时间需要 7 分钟。

场景: 同事说Vue出现问题,当一个变量被赋值之后,立刻变成了undefined,而数据源明明是有值的。

我知道肯定是哪个地方改变了变量,但无法通过代码得出结论,最后无奈只能用【二分法删除代码】,经过一番怀疑人生的摸索,终于发现是Select / Option 双向数据绑定导致的。

 

简单的说,就是select绑定了 v-model。,而 option 会影响select的v-model。

当option为空时,v-model所绑定的值会自动变成空。

 

结论:下次直接用【二分法删除代码】来解决问题最好了。

 


 

 

场景:如果微信网页有问题了。记得拿到菜单json,然后【微信开发者工具】

https://www.cnblogs.com/CyLee/p/9101175.html

 


 

 

场景:使用layui开发后台,而不使用iframe,使用了单页方式构建。内容都是动态加载插入页面导致的问题。

有两个页面雷同,结果切换的时候出现了问题,后来发现,是因为命名雷同导致的。

 

 


 

 

场景:只有OPTION而没有POST的请求和相应

非常容易遇到HTTP请求为OPTION的问题,稍后要重点记录一下。

只有OPTION,而没有POST,实际上后端是我自己开发的,所以我很肯定后端没什么问题。但就是没有显示POST请求和响应的明细。

后来发现,原因是"Access-Control-Allow-Headers" 没有设置好,我客户端的请求header中包含app,而后端没有设置,加上app即可。

最好是将 Access-Control-Allow-Headers: *  设置为全部就可以了。

 

自己的本地服务访问不了

1、试试localhost可以不

2、如果可以,可能是FQ问题

3、如果没有FQ,可能是FQ把ie给修改了。修改ie的网络配置

 

场景二:微信调试

请使用https://github.com/wuchangming/spy-debugger

1、开启

2、代理

3、多刷新

 

场景一:临时换API地址引发的一系列问题

接口换了地址,前后端的代码都没变,但就是请求不了。由于是在App内,调试非常不方便。只能通过USB调试了。

先是借了装有App的手机,结果由于对方手机版本太低,调试的界面出现一些问题,而后又因为fq的原因调试不了。又跑去解决了fq问题。

而后登录App后又因为没有账号,找测试人员借。

其实最初我还没有直接使用USB调试,而是思考别的调试方式,也浪费了很多时间。后来直接用了我自己的安卓机才开始了USB调试。

最后以为是application/json的问题,又最后才发现,是因为后端给我的是API相对路径,而没有给我API绝对路径。

 

总结:

-2、找春梅要充电线,不要找王坤的

-1、前端的请求统一使用application/json即可,但需要注意使用application/json的一些套路。

0、遇到App的H5问题,想都不要想直接使用USB调试即可;

1、时刻准备着fq工具、如赛风3;

2、时刻准备着手机有一个线上的App,防止临时有事,紧急调试;

3、准备好USB数据线;

4、准备好一个测试账号;

5、问清楚绝对地址;

 

场景二:cors跨域、OPTIONS的问题

本地开发一切正常,部署到正式环境的时候,显示了异常,但为了友好,统一显示了“网络异常,请稍后重试”、看不出任何的异常。

然后破例将错误显示出来调试,又发现错误信息极其少。只能大约定位到位置,但不能定位问题。

后来使用了USB调试,发觉捕捉不到?后来又用第三方的错误捕捉工具raven / sentry,也没什么用。后来才使用了spy-debugger。通过它可以抓包,知道了OPTION的问题而已。

但当时脑子一片混乱不知道是跨域的问题,后来才通过后端弄了个本地环境,使用了微信开发者工具,在console中发现了cors的问题

Fetch API cannot load . Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

 才完全发现了确定了跨域的问题,但依然怀疑是前端的问题,试着往fetch中加入了mode: 'cors' 和 mode: 'no-cors'

后来都没用。最后后端才告知我是网关拦截的问题。跟前端没有关系。白白浪费了我很多感情

 

总结:

1、除了USB调试,推荐使用spy-debugger调试,尽管console中不能打印出详细的错误,但还能看到抓包。也是很有价值的。

2、想尽一切办法,本地调试。这样就可以看到控制台的错误了

3、出现cors和OPTION的问题,前端就不需要关心了。只需要跟后端禀告,并且全权配合后端即可。跟前端没什么太大关系了。

 

你可能感兴趣的文章
HTML基础知识笔记(二)
查看>>
Sim Module Profile
查看>>
Python--关于 join 和 split
查看>>
javascript 取后台值
查看>>
WPF组件开发之组件的基类
查看>>
JAVA中用偏移 求闰年的疑惑
查看>>
placement new
查看>>
vi操作
查看>>
JAVA----类的继承1(extends)
查看>>
php设计模式-工厂模式
查看>>
梦断代码读后感(一)
查看>>
EF上下文对象线程内唯一性与优化
查看>>
关于IOS新手在安装cocoa pods失败,因为ruby版本过低的解决方法+ (void) {升级ruby}
查看>>
对服务器所有的请求都转向指定的servlet
查看>>
Android 4.0源码目录结构
查看>>
201521123040《Java程序设计》第13周学习总结
查看>>
Mybatis的分页插件com.github.pagehelper
查看>>
Rand工具类
查看>>
iOS边练边学--cocoaPods管理第三方框架--命令行方式实现
查看>>
Exp9 Web安全基础 20164303景圣
查看>>