zoukankan      html  css  js  c++  java
  • 开发中那些难题以及那些哭笑不得的解决过程

    场景: 同事说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、如果可以,可能是翻墙问题

    3、如果没有翻墙,可能是翻墙把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 http://172.16.200.110:31006/carAction/selectAuctionReg. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://p20m258128.imwork.net' 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的问题,前端就不需要关心了。只需要跟后端禀告,并且全权配合后端即可。跟前端没什么太大关系了。

  • 相关阅读:
    Bootstrap JS插件使用实例(2)-模态对话框
    Java常用正则表达式验证工具类RegexUtils.java
    程序员不是砌砖工人,他们是作家【转】
    js中继承的几种用法总结(apply,call,prototype)
    javascript中apply()方法解析-简单易懂!
    javascript方法 call()和apply()的用法
    高性能优化Web前端
    Javascript类继承-机制-代码Demo【原创】
    初识WEB:输入URL之后的故事【转】
    博客园添加网站统计访问量-操作简单很实用哦!
  • 原文地址:https://www.cnblogs.com/CyLee/p/8609431.html
Copyright © 2011-2022 走看看