美文网首页
使用charles解决跨域问题

使用charles解决跨域问题

作者: 团猫咪爱吃玉米 | 来源:发表于2018-11-06 10:08 被阅读17次

    最近折腾了一下charles,发现这个软件不仅仅可以在前端mock数据,还可以解决跨域的问题。
    栗子:
    后端给的接口地址为:https://stg-pteppp.leanapp.cn/h5/jsconfig
    我在前端的代码如下:

    componentDidMount () {
        axios.get('/api/h5/jsconfig')
        .then((res) => {
          console.log(res);  
        })
      }
    

    如果不使用代理工具,发现会报跨域的错误。这时候我们的charles就派上用场啦。

    • 配置tools -> Map Remote Settings
      e678d25a9fd9c5b1475da2c2d756d0a.png
    • 注意Preserve host这个选项不能打钩
    • 再次访问浏览器,发现数据拿到啦
      3b1877e437638f1adc4e930599bd572.png
      另附charles的破解工具:https://www.zzzmode.com/mytools/charles/
      macOS: /Applications/Charles.app/Contents/Java/charles.jar
      Windows: C:\Program Files\Charles\lib\charles.jar

    相关文章

      网友评论

          本文标题:使用charles解决跨域问题

          本文链接:https://www.haomeiwen.com/subject/aqpyxqtx.html